Flutter Tips💡 – リソース・アセットの設定方法

リソース・アセットの設定方法

Flutterプロジェクトで使用する、

画像や音声などのリソースをどこにどのように保管するのか

を解説していきます(*^^)

リソース用フォルダは自作する

Androidプロジェクトでは「Drawableフォルダ」がありましたが、

Flutterプロジェクトでは、

デフォルトでリソース・アセット用のフォルダが用意されていません。

そのため、専用のフォルダを自作する必要があります。

プロジェクト名の上で右クリックして

[新規(New)] -> [ディレクトリー(Directory)]

を選択します。

フォルダ名は任意ですが、「英小文字」と「アンダーバー」のみで命名します。

またこれも任意ですが、

さらにリソースの種類ごと(画像、サウンドなど)に

サブフォルダを分けると分かりやすいですね(*^^)v

ここでは「assets」フォルダ下に「images」フォルダを作ってみました。

リソースを配置する

コピー&ペースト、

もしくは直接ドラッグでリソースファイルを追加します。

pubspec.yamlファイルへ登録

最後に「pubspec.yaml」ファイルへリソースを登録します。

デフォルトでコメントアウトしてあるassets:の項目を使いましょう。

使用するリソースをパス指定しますが、

カレントディレクトリはこのプロジェクト階層(この場合”my_first_app”ディレクトリ)です。

先ほど作ったassetsフォルダから指定します。

この時フォルダごと指定すれば、そのフォルダ内のリソースすべてを対象とします。

パスの指定が終わったら、

右上の「Packages get」をクリックして更新します。

これでOK!