宽度和高度

本课属于 Coddy Flutter 学习旅程的“你的第一个应用”单元。第 16 课，共 32 课。

给 Container 设置 width: 和 height: 后，它就不会再紧贴子组件。尺寸以像素为单位：

Container(
  width: 300,
  height: 50,
  color: Colors.orange,
  child: Text('Banner'),
)

子组件位于方框的左上角。Flutter 中的像素在所有手机上大小都相同，因此宽度为 300 的方框在小手机和大手机上看起来差不多大。

挑战

简单

将蓝色方框的宽度设为 200 像素，高度设为 100 像素。

亲手试试

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: Container(
            color: Colors.lightBlue,
            child: Text('Box'),
          ),
        ),
      ),
    );
  }
}