在 Flutter 中将目录中的所有图像显示到列表中

Question

我想知道是否有一种方法可以将用户移动设备中特定目录中的所有图像或文件显示到 flutter 中的列表/数组，以便我可以在 ListView 中使用。

谢谢任何帮助是受欢迎的。

PS：我想尝试使用 path_provider 但不知道如何。

Answer 1

我正在开发使用本地存储/应用程序目录的应用程序。

花了五天时间我找到了解决方案......

import 'dart:async';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:path/path.dart';
import 'package:path_provider/path_provider.dart';

final Directory _photoDir = new Directory(
    '/storage/emulated/0/Android/data/com.eclixtech.doc_scanner/files/CroppedImages');

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Document Scanner',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ImageCapture(),
    );
  }
}

class ImageCapture extends StatefulWidget {
  @override
   _ImageCaptureState createState() => _ImageCaptureState();
}

class _ImageCaptureState extends State<ImageCapture> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Doc Scanner'),
      ),
      body: Container(
        child: FutureBuilder(
          builder: (context, status) {
            return ImageGrid(directory: _photoDir);
          },
        ),
      ),
    );
  }
}
class ImageGrid extends StatelessWidget {
  final Directory directory;

  const ImageGrid({Key key, this.directory}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var refreshGridView;
    var imageList = directory
        .listSync()
        .map((item) => item.path)
        .where((item) => item.endsWith(".jpg"))
        .toList(growable: false);
    return GridView.builder(
      itemCount: imageList.length,
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3, childAspectRatio: 3.0 / 4.6),
      itemBuilder: (context, index) {
        File file = new File(imageList[index]);
        String name = file.path.split('/').last;
        return Card(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8.0),
          ),
          child: Padding(
            padding: const EdgeInsets.all(5.0),
            child: InkWell(
              onTap: () => {
                refreshGridView =
                Navigator.push(context, MaterialPageRoute(builder: (context) {
              return ImageEditClass(
                imagepath: imageList[index],
              );
            })).then((refreshGridView) {
              if (refreshGridView != null) {
                build(context);
              }
            }).catchError((er) {
              print(er);
            }),
              },
               child: Padding(
                 padding: new EdgeInsets.all(4.0),
                 child: Image.file(
                   File(imageList[index]),
                   fit: BoxFit.cover,
                 ),
               ),
            ),
          ),
        );
      },
    );
  }
}

您可以在此处提及图像的扩展名（.jpg、.png 等）。

.where((item) => item.endsWith(".jpg"))

在上面提到的代码中。

Answer 2

我找到了解决方案。

我必须与其他方法通道合作才能实现这一目标。

写完获取文件列表的java代码后，我通过一个通道传入flutter

Java获取文件的方法

private List<String> getImages(){
        String path = Environment.getExternalStorageDirectory().toString();

        List<String> imgs = new ArrayList<String>();
        File directory = new File(path);
        List<String> files = Arrays.asList(directory.list());

        imgs = files;

        return imgs;
    }

Java方法通道

new MethodChannel(getFlutterView(), CHANNEL).setMethodCallHandler(
              (call, result) -> {
                  if (call.method.equals("getImages")) {
                      List<String> imgs = getImages();
                      if (imgs.size() <= 0) {
                          result.error("Empty", "No Images.", null);
                      } else {
                          result.success(imgs);                      }
                  } else {
                      result.notImplemented();
                  }

              });

飞镖代码

 Future<void> _getImages() async {
    List images;
    try {
      final List result = await platform.invokeMethod('getImages');
      images = result;
    } on PlatformException catch (e) {
      print("Error");
    }

    setState(() {
      imgs = images;
    });
  }

完整源代码可在Github上获取