[Flutter]Card(カード)に枠線(boder)をつけるには？

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

Cardの枠線の太さを設定する方法を紹介します。

方法
使用例

方法

Cardの枠線をつけるには、RoundedRectangleBorderを使います。

まず、Cardの引数「shape」にRoundedRectangleBorderを指定します。

そして、RoundedRectangleBorderの引数「border」にBorderSideを指定します。

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Card(
          shape: RoundedRectangleBorder(
            side: BorderSide(),
          ),
        ),
      ),
    );
  }

これでCardに枠線がつきます。

使用例

以下は、使用例です。

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Card(
          shape: RoundedRectangleBorder(
            side: BorderSide(
              color: Colors.pink, //色
              width: 2, //太さ
            ),
          ),
          child: ListTile(
            title: Text('Flutter'),
          ),
        ),
      ),
    );
  }