Menu
CoddyTech
flag Ar iconالعربيةdown icon

بطاقة العمل: التخطيط

جزء من قسم تطبيقك الأول في رحلة Flutter على Coddy. الدرس 30 من 32.

حان وقت جمع كل شيء معًا. في الدروس الثلاثة التالية، ستبني تطبيقًا لبطاقة عمل، وهو نوع الشاشة التي تبدأ منها كل صفحة ملف شخصي.

ابدأ بالتخطيط. ارسم الشاشة على هيئة مربعات أولًا: صورة رمزية مستديرة في الأعلى، ثم الاسم، ثم الوظيفة، وكلها في عمود واحد بمنتصف الشاشة. بعد وضع المربعات في الأماكن الصحيحة، يأتي دور التنسيق.

challenge icon

التحدي

سهل

أنشئ البطاقة في منتصف الشاشة، على هيئة 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'),
        ),
      ),
    );
  }
}
quiz iconاختبر نفسك

يتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.

جميع دروس تطبيقك الأول

تدرّب بنفسك: مترجم Flutter عبر الإنترنت