Chiều rộng và chiều cao

Thuộc phần Ứng dụng đầu tiên trong hành trình Flutter của Coddy. Bài học 16 trên 32.

Đặt width: và height: cho Container để hộp không còn ôm sát phần tử con. Kích thước được tính bằng pixel:

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

Phần tử con nằm ở góc trên bên trái của hộp. Pixel trong Flutter có cùng kích thước trên mọi điện thoại, vì vậy hộp rộng 300 trông gần như giống nhau trên điện thoại nhỏ và lớn.

Thử thách

Dễ

Đặt chiều rộng của hộp màu xanh là 200 pixel và chiều cao là 100 pixel.

Tự làm thử

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'),
          ),
        ),
      ),
    );
  }
}