שורות בתוך עמודות

חלק מהיחידה האפליקציה הראשונה שלך במסלול ה-Flutter של Coddy. שיעור 24 מתוך 32.

Row יכולה להיות אחד מהילדים של Column. כך המסך מציג שורות שיש בהן כמה פריטים:

Column(
  mainAxisSize: MainAxisSize.min,
  children: [
    Text('Pancakes'),
    Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        Text('20 min'),
        SizedBox(width: 12),
        Text('Easy'),
      ],
    ),
  ],
)

mainAxisSize: MainAxisSize.min גורם לשורה או לעמודה להיות בגודל הילדים שלה בלבד, במקום לתפוס את כל המקום שניתן לה. כאן הוא משאיר את שניהם במרכז המסך.

אתגר

קל

הפכו את זה לכותרת פרופיל קטנה:

השאירו את Ada Lovelace בשורה הראשונה
הציבו את London ואת 1815 זה לצד זה מתחתיה, בתוך Row

נסו בעצמכם

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: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Text('Ada Lovelace', style: TextStyle(fontSize: 28)),
              Text('London'),
              Text('1815'),
            ],
          ),
        ),
      ),
    );
  }
}