Flutter拍照相册选择插件flimer的使用

概述

Flimer代表Flutter Image Picker，适用于Mobile、Desktop和Web平台。它结合了以下两个包的功能：

• image_picker：支持Android、iOS和Web
• file_selector：支持MacOS、Windows和Linux

注意：由于pana-issue#889，目前仅检测到Web平台。

安装

在您的pubspec.yaml文件中添加依赖：

dependencies:
  flimer: latest

确保将latest替换为具体的版本号或使用最新的稳定版本。

使用示例

单张图片选择

final XFile? file = await flimer.pickImage(source: ImageSource.gallery);
if (file == null) {
  // 用户取消操作
  return;
}
final String fileName = file.name;
final String filePath = file.path;

多张图片选择

final List<XFile>? files = await flimer.pickImages();
if (files == null || files.isEmpty) {
  // 用户取消操作
  return;
}
print("Selected images : ${files.length}");

完整示例Demo

以下是完整的示例代码，展示了如何使用flimer插件来实现打开单张图片、多张图片以及拍摄照片的功能。

import 'package:flimer/flimer.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(home: MyApp()));
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  @override
  Widget build(BuildContext context) {
    final ButtonStyle style = ElevatedButton.styleFrom(
      primary: Colors.blue,
      onPrimary: Colors.white,
    );

    return Scaffold(
      appBar: AppBar(
        title: const Text('Flimer'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            ElevatedButton(
              style: style,
              child: Text('Open an image'),
              onPressed: _openImageFile,
            ),
            SizedBox(height: 8),
            ElevatedButton(
              style: style,
              child: Text('Open multiple images'),
              onPressed: _openImageFiles,
            ),
            SizedBox(height: 8),
            ElevatedButton(
              style: style,
              child: Text('Take a picture'),
              onPressed: _takePicture,
            ),
          ],
        ),
      ),
    );
  }

  void _openImageFile() async {
    final file = await flimer.pickImage(source: ImageSource.gallery);
    if (file == null) {
      // 用户取消操作
      return;
    }
    final String fileName = file.name;
    final String filePath = file.path;

    await showDialog(
      context: context,
      builder: (context) => ImageDisplay(fileName, filePath),
    );
  }

  void _openImageFiles() async {
    final files = await flimer.pickImages();
    if (files == null || files.isEmpty) {
      // 用户取消操作
      return;
    }

    await showDialog(
      context: context,
      builder: (context) => MultipleImagesDisplay(files),
    );
  }

  void _takePicture() async {
    final file = await flimer.pickImage(source: ImageSource.camera);
    if (file == null) {
      // 用户取消操作
      return;
    }
    final String fileName = file.name;
    final String filePath = file.path;

    await showDialog(
      context: context,
      builder: (context) => ImageDisplay(fileName, filePath),
    );
  }
}

// 假设存在一个用于展示图片的组件ImageDisplay和MultipleImagesDisplay
class ImageDisplay extends StatelessWidget {
  final String fileName;
  final String filePath;

  ImageDisplay(this.fileName, this.filePath);

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text(fileName),
      content: Image.file(File(filePath)),
      actions: [
        TextButton(
          onPressed: () => Navigator.of(context).pop(),
          child: Text('Close'),
        )
      ],
    );
  }
}

class MultipleImagesDisplay extends StatelessWidget {
  final List<XFile> files;

  MultipleImagesDisplay(this.files);

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text('${files.length} Images Selected'),
      content: SingleChildScrollView(
        child: Column(
          children: files.map((file) => Image.file(File(file.path))).toList(),
        ),
      ),
      actions: [
        TextButton(
          onPressed: () => Navigator.of(context).pop(),
          child: Text('Close'),
        )
      ],
    );
  }
}

请注意，上述代码中的ImageDisplay和MultipleImagesDisplay是假设存在的用于显示图片的组件。根据实际需求，您可能需要调整这些组件以适应您的应用设计。