Flutter Containerの上に枠線を表示するサンプル

2024年2月17日

環境
Windows11 pro 64bit
Flutter 3.3.7

構文
Container(
decoration: BoxDecoration(
border: Border(),
),
Containerの引数「decoration」にBoxDecorationを指定します。
BoxDecorationの引数「border」にBorderを指定します。

使用例

Container(
  width: 110,
  height: 50,
  decoration: BoxDecoration(
    border: Border(
      top: BorderSide(
        color: Colors.green, //枠線の色
        width: 5, //枠線の太さ
      ),
    ),
  ),
  child: Text(
    'Hello',
    style: TextStyle(fontSize: 50),
  ),
),