[Flutter]ボタン(Button)の背景(background)に画像(image)を設定する方法

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

ボタンの背景に画像を設定する方法を紹介します。

方法
まとめ

方法

ボタンの背景に画像を設定するには、MaterialButtonとContainerを使います。

MaterialButton(
    padding: EdgeInsets.all(8.0),
    textColor: Colors.black,
    elevation: 8.0,
    child: Container(
      decoration: BoxDecoration(
        image: DecorationImage(
          image: AssetImage('asset/images/dog-illust.jpg'),
          fit: BoxFit.cover,
        ),
      ),
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Text("Button"),
      ),
    ),
    onPressed: () {},
  ),