Flutter ローカルの画像を表示させサイズを指定

ローカルに画像を用意

Flutter プロジェクトの中に、assetsフォルダを作りその中にimagesフォルダを作ります。

assets/images/unnamed.pngというパスになります。
この画像を表示させます。

pubspec.yamlに画像の置き場所を設定する

デフォルトでは下記のようにコメントアウトされているかと思います。

pubspec.yaml

flutter:
    ...(省略)...
  # To add assets to your application, add an assets section, like this:
  # assets:
  #  - images/a_dot_burr.jpeg
  #  - images/a_dot_ham.jpeg

assets:から下の部分をコメントから以下のように編集します。

pubspec.yaml

flutter:
    ...(省略)...
  # To add assets to your application, add an assets section, like this:
  assets:
    - assets/images/unnamed.png

ここでのassets/images/unnamed.pngは最初に画像を設置したパスのことですね。

※インデントの問題でエラーが発生しやすいので要注意です！元のインデントを崩さないように編集しましょう！

サイズを指定して画像を表示

            Container(
                width: 154,
                height: 230,
                child: Image.asset(
                  'assets/images/unnamed.png',
                  fit: BoxFit.contain,
                ),
              ),

サイズを指定して表示するためにContainerのchildにImageを設置