Flutter图片选择插件adv_image_picker的使用

Flutter图片选择插件adv_image_picker的使用

这是我的自定义图片选择器，它允许你多选图片并使用我们的自定义UI。

注意：此插件仍在开发中，某些组件可能尚未可用或仍存在许多错误。

安装

首先，在你的 pubspec.yaml 文件中添加 adv_image_picker 作为依赖项。

dependencies:
  adv_image_picker: ^1.0.6

说明

如果你打算加载缩略图大小的图片，建议从 AdvImagePickerPlugin.getThumbnail 获取图片字节。否则，可能会导致内存问题。

示例

你可以在这里找到完整的示例代码：此处

示例代码

import 'dart:async';
import 'dart:io';
import 'dart:typed_data';

import 'package:adv_image_picker/adv_image_picker.dart';
import 'package:adv_image_picker/plugins/adv_image_picker_plugin.dart';
import 'package:flutter/material.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  // CustomImageCache();
  runApp(MyApp());
}

// 自定义图片缓存类
class CustomImageCache extends WidgetsFlutterBinding {
  [@override](/user/override)
  ImageCache createImageCache() {
    ImageCache imageCache = super.createImageCache();
    // 设置你的图片缓存大小
    imageCache.maximumSize = 10;
    return imageCache;
  }
}

class MyApp extends StatelessWidget {
  // 这个小部件是你的应用的根
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: '图片选择器演示首页'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<File> files = []; // 存储选择的文件
  List<ImageProvider> thumbnails = []; // 存储缩略图
  bool isPreparing = false; // 是否正在准备数据

  [@override](/user/override)
  void initState() {
    super.initState();

    AdvImagePicker.cameraFolderName = "相机文件夹";
    AdvImagePicker.cameraFilePrefixName = "相机测试前缀名_";
    AdvImagePicker.cameraSavePath = "/storage/emulated/0/相机测试文件夹/";
  }

  [@override](/user/override)
  void dispose() {
    // 清理之前占用的内存
    if ((thumbnails.length) > 0) {
      for (ImageProvider each in thumbnails) {
        each.evict();
      }
    }

    super.dispose();
  }

  void _pickImage() async {
    final result = await AdvImagePicker.pickImagesToFile(
          context,
        ) ??
        [];
    files.addAll(result);
    print("files => ${files.map((e) => e.path).join("\n")}");
    print("size of files => ${files.map((e) => e.lengthSync()).join("\n")}");
    prepare();
  }

  Future<void> prepare() async {
    List<ImageProvider> thumbnails = [];
    double screenWidth = MediaQuery.of(context).size.width;

    for (int i = 0; i < files.length; i++) {
      String path = files[i].path;
      ByteData data = await AdvImagePickerPlugin.getAlbumThumbnail(
        imagePath: path,
        height: screenWidth ~/ 4,
        width: screenWidth ~/ 4,
      );

      Uint8List imageData = data.buffer.asUint8List();

      thumbnails.add(MemoryImage(imageData));
    }

    this.thumbnails = List<ImageProvider>.from(thumbnails);

    if (this.mounted) setState(() {});
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: isPreparing
            ? CircularProgressIndicator()
            : GridView.count(
                crossAxisCount: 4,
                children: thumbnails
                    .map((ImageProvider image) => Image(
                          image: image,
                          fit: BoxFit.cover,
                        ))
                    .toList(),
              ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _pickImage,
        child: Icon(Icons.add),
      ),
    );
  }
}