[Flutter]Table(テーブル)の外側に枠線をつけるには？

どうも、ちょげ(@chogetarou)です。

Tableの外側に枠線をつける方法を紹介します。

方法

Tableの外側に枠線をつけるには、引数「border」を使います。

まず、Tableの引数「border」にTableBorder.symmetric()を指定します。

そして、TableBorder.symmertric()の引数「outside」にBorderSideを指定します。

Table(
  border: TableBorder.symmetric(
    outside: BorderSide(),
  ),
  children: <TableRow>[
    ・・・
  ],
),

Tableの引数「border」を使うことで、Tableの外側に枠線をつけることが出来ます。

使用例

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Center(
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Table(
              border: TableBorder.symmetric(
                outside: BorderSide(color: Colors.red),
              ),
              children: <TableRow>[
                TableRow(
                  children: [
                    Text('太郎'),
                    Text('18歳'),
                    Text('男'),
                  ],
                ),
                TableRow(
                  children: [
                    Text('花子'),
                    Text('16歳'),
                    Text('女'),
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }