بطاقة العمل: التخطيط
جزء من قسم تطبيقك الأول في رحلة Flutter على Coddy. الدرس 30 من 32.
حان وقت جمع كل شيء معًا. في الدروس الثلاثة التالية، ستبني تطبيقًا لبطاقة عمل، وهو نوع الشاشة التي تبدأ منها كل صفحة ملف شخصي.
ابدأ بالتخطيط. ارسم الشاشة على هيئة مربعات أولًا: صورة رمزية مستديرة في الأعلى، ثم الاسم، ثم الوظيفة، وكلها في عمود واحد بمنتصف الشاشة. بعد وضع المربعات في الأماكن الصحيحة، يأتي دور التنسيق.
التحدي
سهلأنشئ البطاقة في منتصف الشاشة، على هيئة Column (مع mainAxisSize: MainAxisSize.min) تتكوّن من:
CircleAvatarبنصف قطرradius: 48، ولون خلفيةbackgroundColor: Colors.indigo، والحرفين الأولينJDكعنصر ابن له، باللون الأبيض وبحجم 32- الاسم،
Jordan Diaz - الوظيفة،
Flutter Developer
جرّب بنفسك
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Center(
child: Text('Jordan Diaz'),
),
),
);
}
}
يتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.
جميع دروس تطبيقك الأول
تدرّب بنفسك: مترجم Flutter عبر الإنترنت