質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

Q&A

解決済

1回答

1226閲覧

flutter ListView.builderで画像を表示したい

endiv

総合スコア161

Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

0グッド

0クリップ

投稿2021/07/01 08:15

前提・実現したいこと

flutterでListView.builderを用い、画像を横並べしたいと思っています。
どなたかわかる方いたら教えていただければ幸いです。

発生している問題/エラー

categoriesというMapデータを作りListVIewで表示したいと思っていますが、
エラーが発生します。

dart

1The getter 'isEmpty' was called on null. 2Receiver: null 3Tried calling: isEmpty

該当のソースコード

dart

1 Container( 2 height: 120, 3 child: categories.isEmpty 4 ? Center(child: Text('ぬる'),)//こっちになってしまう 5 : ListView.builder( 6 scrollDirection: Axis.horizontal, 7 itemCount: categories.length, 8 itemBuilder:(context,index){ 9 return Container( 10 child: Column( 11 children: [ 12 Container( 13 height: 50, 14 width: 50, 15 child: Image.asset(categories.elementAt(index)['iconPath']),//これを表示したい 16 ), 17 ], 18 ), 19 ); 20 }, 21 ), 22 ),

categoriesのデータ

dart

1Set<Map<String,String>> categories = { 2 {'name' : 'jun', 'iconPath':'images/jun.jpeg'}, 3 {'name' : 'hiroyuki', 'iconPath': 'images/hiroyuki.jpeg'}, 4 {'name' : 'hikakin', 'iconPath': 'images/hikakin.png'}, 5 {'name' : 'seikin', 'iconPath': 'images/seikin.jpeg'}, 6};

試したこと

DartPadで文法の間違いを探した
DartPad

dart

1void main() { 2 Set<Map<String,String>> categories = { 3 {'name' : 'jun', 'iconPath':'images/jun.jpeg'}, 4 {'name' : 'hiroyuki', 'iconPath': 'images/hiroyuki.jpeg'}, 5 {'name' : 'hikakin', 'iconPath': 'images/hikakin.png'}, 6 {'name' : 'seikin', 'iconPath': 'images/seikin.jpeg'}, 7 }; 8 9    if(categories.isEmpty){ 10 print('ない'); 11 }else{ 12 print('ある'); 13 } 14 print(categories.elementAt(0)['iconPath']); 15 print(categories.elementAt(0)['name']); 16 print(categories.length); 17 print('ここからfor文'); 18 var i = 0; 19 for(i=0;i<categories.length;i++){ 20 print(categories.elementAt(i)['iconPath']); 21 } 22}

結果

dart

1ある 2images/jun.jpeg 3jun 44 5ここからfor6images/jun.jpeg 7images/hiroyuki.jpeg 8images/hikakin.png 9images/seikin.jpeg

補足情報(FW/ツールのバージョンなど)

flutter2.0.6

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

自己解決

非同期の為、isEnptyチェックの方が早く終わってしまうため、まだDataファイルの読み込みが終わらないようです。
そのためnullが返ってくるようです。今回はisEnptyチェックの前にMapDataを書くことで解決しました。

投稿2021/07/01 08:52

endiv

総合スコア161

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問