こんなのを作ります
ダークモードだとこんな感じ
完成版のコード
いきなり完成版のコードです。
解説
まず冒頭部分ですがStatelessWidgetを継承して作成しています。
コンストラクタで各値を受け取るようにして、iconUrlはNullableで定義しています。
Cardウィジェットが一番親に居てshapeにRoundedRectangleBorderを指定することで、角を丸くしています。
またmarginを指定して上下に余白を持たせています。
Columnを一つ挟んでSizedBoxでマージンを調整して、その下にRowで横方向に要素を並べています。
テキストはFlexibleで囲むことによって、長い文章の最大行数を指定しつつ、超えた部分は3点リードなどに自動で置き換えてくれるようになります。
overflow: TextOverflow.ellipsis,
maxLines: 3,
コメント