初めて投稿します。
Flutter(Dart)を始めて3日目になります。
実現したいこと
スマホアプリでアプリ内に保存しているjpg画像をInstagramのようにグリッド表示し、タップされた画像を画面に合わせて表示できるようにしたいと考えています。
直したいこと
Android Studioを使ってFlutter(Dart)で上記のようなアプリを作ってみたく、見よう見まねでコードを書いてみたのですが、下記のエラーが消えず悩んでいます。
発生している問題・エラーメッセージ
コーディングしているエリアの右上のエラーとワーニングの数が表示されているところを押してみると、ソースの下に下記の3つのエラーが出ます。
Function expressions can't be named. :23 Expected an identifier. :23 The getter '(' isn't defined for the type 'Future<List<String>>'. :23
デバッグボタンを押して実行してみると下記のエラーになります。
lib/griddisplay_images.dart:23:26: Error: A function expression can't have a name. fileNameList.forEach(imageFileName) { ^^^^^^^ lib/griddisplay_images.dart:23:26: Error: Expected an identifier, but got 'forEach'. Try inserting an identifier before 'forEach'. fileNameList.forEach(imageFileName) { ^^^^^^^ Target kernel_snapshot failed: Exception FAILURE: Build failed with an exception.
該当のソースコード
Flutter(Dart)
1import 'dart:io'; 2 3import 'package:flutter/material.dart'; 4 5class GridImagesPage extends StatelessWidget { 6 const GridImagesPage({ 7 Key? key, 8 }) : super(key: key); 9 10 @override 11 Widget build(BuildContext context) { 12 Future<List<String>> fileNameList = getFileList(); 13 return Scaffold( 14 appBar: AppBar( 15 title: const Text('画像をタップしてください'), 16 ), 17 body: GridView.count( 18 crossAxisCount: 3, 19 childAspectRatio: 1.5, 20 mainAxisSpacing: 4, 21 crossAxisSpacing: 4, 22 children: [ 23 fileNameList.forEach(imageFileName) { 24 //for (var imageFileName in fileNameList) 25 Hero( 26 tag: Text(imageFileName), 27 child: GestureDetector( 28 onTap: () { 29 Navigator.of(context).push( 30 MaterialPageRoute<void>( 31 builder: (context) => 32 ImagePage( 33 imageFile: imageFileName, 34 ), 35 ), 36 ); 37 }, 38 ), 39 ); 40 } 41 ]), 42 ); 43 } 44 45 Future<List<String>> getFileList() async { 46 Directory imageFileDir = Directory('images/'); 47 List<String> fileNameList = []; 48 await for (var entity 49 in imageFileDir.list(recursive: false, followLinks: false)) { 50 fileNameList.add(entity.path); 51 } 52 return fileNameList; 53 } 54} 55 56class ImagePage extends StatelessWidget { 57 const ImagePage({ 58 required this.imageFile, 59 Key? key, 60 }) : super(key: key); 61 final String imageFile; 62 63 @override 64 Widget build(BuildContext context) { 65 return Material( 66 child: Scaffold( 67 backgroundColor: Colors.black87, 68 appBar: AppBar( 69 title: Text(imageFile), 70 leading: BackButton( 71 color: Colors.white, 72 ), 73 ), 74 body: Padding( 75 padding: const EdgeInsets.symmetric(horizontal: 16), 76 child: Hero( 77 tag: Text(imageFile), 78 child: Center(child: Image.asset(imageFile)), 79 ), 80 ), 81 ), 82 ); 83 } 84}
試したこと
元々は、24行目にコメントアウトしていますが、for...inでループさせようとしたのですが、下記のエラーが出て色々と調べていたところforEachでのループを試して見ることにしました。
for...inでのエラー
1The type 'Future<List<String>>' used in the 'for' loop must implement 'Iterable'.` :24
補足情報(FW/ツールのバージョンなど)
Android Studio Giraffe | 2022.3.1 Patch 3
Flutter 3.13.9
対処方法がお分かりになられる方がいりゃっしゃいましたら何卒お教えいただけますようお願い致します。
![guest](/img/icon/icnUserSample.jpg)
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2023/11/17 00:45