アセット内の画像の利用方法

画像を利用するにはまず、プロジェクトルートに assets などの名前でフォルダを作成します。

作成したフォルダ内にアプリケーションで利用したい画像ファイルをコピーします。

次に、pubspec.yaml ファイルの flutter: エントリの下に、 assets: エントリを作成し、その下に下のようにファイルを指定します。

flutter:
  assets:
    - assets/laguna-beach.jpg
    - assets/torrance-beach.jpg

ここで - に続くのは、上で作成したフォルダ名と、その中にコピーした画像ファイル名です。

このようにすると、Image ウィジェットで次のように指定することで、アセット内の画像を表示することができます。

Image.asset('assets/torrance-beach.jpg'),

ここまでお読みいただき、誠にありがとうございます。SNS 等でこの記事をシェアしていただけますと、大変励みになります。どうぞよろしくお願いします。

© 2024 Flutter 入門