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

Question

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

感谢您的帮助。

PS：我想尝试使用path_provider，但不知道该怎么做。

Answer 1

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

花了五天后，我找到了解决方法...

PDO::ATTR_PERSISTENT => true

您可以在此处提及图像的范围（.jpg，.png ect）。

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,
                 ),
               ),
            ),
          ),
        );
      },
    );
  }
}

上述代码中。

Answer 2

我能够找到解决方案。

我还必须与MethodChannels合作才能实现这一目标。

在编写了用于获取文件列表的Java代码之后，我通过一个通道传入了

用于获取文件的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 MethodChannel

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();
                  }

              });

Dart代码

 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上的完整源代码

Answer 3

我做了类似的事情，在我的一个Flutter应用程序中，我从下载目录中获取了Urls图片列表，并以交错列表的形式显示它们。

在MethodChannel的帮助下，从下载目录中检索图像URL。另外，别忘了在flutter中将所需的软件包添加到pubspec.yaml文件中

import 'package:flutter/material.dart';
import 'dart:async';
import 'dart:core';
import 'dart:io';
import 'package:flutter/services.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:denphy_wallpapers/main_image_screen/fullscreen_wallpaper.dart';

class Downloads extends StatefulWidget {
  static final String id = 'downloads';

  @override
  _DownloadsState createState() => _DownloadsState();
}

class _DownloadsState extends State<Downloads> {
  static const platform = const MethodChannel('samples.flutter.dev/battery');
  List images;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();

    _getImages();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: new AppBar(
        title: new Text(
          "Downloads",
          style: TextStyle(
              fontFamily: 'Welcome', color: Colors.blue, fontSize: 32.0),
        ),
        centerTitle: true,
        backgroundColor: Colors.white,
      ),
      body: images != null
          ? new StaggeredGridView.countBuilder(
              padding: const EdgeInsets.all(8.0),
              crossAxisCount: 4,
              itemCount: images.length,
              itemBuilder: (context, i) {
                String imgPath = images[i];
                print(imgPath);
                return new Material(
                  elevation: 8.0,
                  borderRadius: new BorderRadius.all(new Radius.circular(8.0)),
                  child: new InkWell(
                    onTap: () {
                      //print(imageName);
                      Navigator.push(
                          context,
                          new MaterialPageRoute(
                              builder: (context) =>
                                  new FullScreenImagePage(imgPath, "")));
                    },
                    child: new Hero(
                      tag: imgPath,
                      child: ClipRRect(
                          borderRadius: BorderRadius.circular(8.0),
                          child: Image.file(
                            File(imgPath),
                            fit: BoxFit.cover,
                          )),
                    ),
                  ),
                );
              },
              staggeredTileBuilder: (i) =>
                  new StaggeredTile.count(2, i.isEven ? 2 : 3),
              mainAxisSpacing: 8.0,
              crossAxisSpacing: 8.0,
            )
          : new Center(
              child: new CircularProgressIndicator(),
            ),
    );
  }

  //Check the MainActivity.java
  Future<void> _getImages() async {
    print('inside get images>>>>>>>>>>>>');
    List imgs;
    try {
      final List result = await platform.invokeMethod('getImages');
      imgs = result;
      for (String i in result) {
        print('>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>$i');
      }
    } on PlatformException catch (e) {
      print("Error");
    }

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

这是MainActivity的代码。

import android.os.Bundle;
import androidx.annotation.RequiresApi;
import android.Manifest;
import android.app.WallpaperManager;
import android.content.ActivityNotFoundException;
import android.content.Intent;
import android.content.pm.PackageManager;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.drawable.BitmapDrawable;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.os.Environment;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.Toast;
import java.io.File;
import java.io.IOException;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import java.io.FilenameFilter;
import io.flutter.app.FlutterActivity;
import io.flutter.plugins.GeneratedPluginRegistrant;
import io.flutter.plugin.common.MethodCall;
import io.flutter.plugin.common.MethodChannel;
import io.flutter.plugin.common.MethodChannel.MethodCallHandler;
import io.flutter.plugin.common.MethodChannel.Result;

import android.content.ContextWrapper;
import android.content.Intent;
import android.content.IntentFilter;
import android.os.BatteryManager;
import android.os.Build.VERSION;
import android.os.Build.VERSION_CODES;
import android.os.Bundle;

public class MainActivity extends FlutterActivity {
    private static final String TAG = "MainActivity";
    private static final String CHANNEL = "samples.flutter.dev/battery";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        GeneratedPluginRegistrant.registerWith(this);

        new MethodChannel(getFlutterView(), CHANNEL).setMethodCallHandler(
                new MethodCallHandler() {
                    @Override
                    public void onMethodCall(MethodCall call, Result result) {
                         if(call.method.equals("getImages")){
                            android.util.Log.e(TAG, "onMethodCall: "+"get Images" );
                            List<String> imgs = getImages();
                            if (imgs.size() <= 0) {
                                result.error("Empty", "No Images.", null);
                            } else {
                                result.success(imgs);
                            }
                        }
                        else {
                            result.notImplemented();
                        }
                    }
                }
        );

    }


    private List<String> getImages() {
        File folder = new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_DOWNLOADS).toString()+"/denphy walls/");
        folder.mkdirs();
        File[] allFiles = folder.listFiles(new FilenameFilter() {
            public boolean accept(File dir, String name) {
                return (name.endsWith(".jpg") || name.endsWith(".jpeg") || name.endsWith(".png"));
            }
        });
        List<String> item = new ArrayList<String>();
        for (File file : allFiles) {
            item.add(file + "");
        }
        return item;
    }
}

上面的代码包含一些额外的功能，您可以根据需要将其删除。