1. ホーム
  2. ヒラメキ

[解決済み】Flutterで角丸画像を作成する方法

2022-03-30 21:56:33

質問

Flutterを使って、映画の情報一覧を作成しています。今、左のカバー画像を角丸の画像にしたいのですが、どうすればいいですか?以下のようにしたのですが、うまくいきません。ありがとうございました。

    getItem(var subject) {
    var row = Container(
      margin: EdgeInsets.all(8.0),
      child: Row(
        children: <Widget>[
          Container(
            width: 100.0,
            height: 150.0,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.all(Radius.circular(8.0)),
              color: Colors.redAccent,
            ),
            child: Image.network(
              subject['images']['large'],
              height: 150.0,
              width: 100.0,
            ),
          ),
        ],
      ),
    );
    return Card(
      color: Colors.blueGrey,
      child: row,
    );
  }

を次のようにします。

解決方法は?

使用方法 ClipRRect であれば、問題なく動作します。

ClipRRect(
    borderRadius: BorderRadius.circular(8.0),
    child: Image.network(
        subject['images']['large'],
        height: 150.0,
        width: 100.0,
    ),
)