Container 為 Widget 設定背景顏色 | 點燈坊

Container 可替 Widget 設定 背景顏色。

Version

Flutter 3.24

Background Color

• Hello World 的 背景色 為 土黃色
• Text 並 沒有 提供屬性設定 backgroundColor

import 'package:flutter/material.dart';

class Home extends StatelessWidget {
  const Home({super.key});

  @override
  Widget build(BuildContext context) {
    var appBar = AppBar(title: const Text('Container Background Color'));

    var container =
        Container(color: Colors.amber, child: const Text('Hello World'));

    var body = Center(child: container);

    return Scaffold(appBar: appBar, body: body);
  }
}

Line 10

var container = Container(color: Colors.amber, child: const Text('Hello World'));

• color：設定 Container 的顏色為 Text 的背景色
• child：將 Text 包在 Container 內

Conclusion

• 若沒對 Container 設定 有效 屬性，Android Studio 會提出警告