Abstand zwischen Widgets

Teil des Abschnitts Deine erste App der Flutter-Journey von Coddy. Lektion 21 von 32.

Die Elemente einer Column berühren sich. Um Platz zwischen zwei davon zu schaffen, füge eine leere SizedBox in die Liste ein:

Column(
  children: [
    Text('Top'),
    SizedBox(height: 20),
    Text('Bottom'),
  ],
)

Eine SizedBox zeichnet nichts. Sie nimmt nur Platz ein: hier 20 Pixel Höhe. Verwende in einer Row stattdessen SizedBox(width: 20).

Aufgabe

Einfach

Füge 24 Pixel Abstand zwischen Title und Subtitle ein.

Probier es selbst

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('Title', style: TextStyle(fontSize: 32)),
              Text('Subtitle'),
            ],
          ),
        ),
      ),
    );
  }
}