Flutter图片保存插件 gallery_saver_plus 的使用

gallery_saver_plus 是一个用于在Flutter应用中保存图片和视频到外部存储（如Android的相册或iOS的照片库）的插件。本文将详细介绍如何安装和使用该插件，并提供完整的示例代码。

安装

首先，在您的 pubspec.yaml 文件中添加 gallery_saver_plus 作为依赖项：

dependencies:
  gallery_saver_plus: ^latest_version

iOS 配置

在 <project root>/ios/Runner/Info.plist 文件中添加以下键值对：

<key>NSPhotoLibraryUsageDescription</key>
<string>我们需要访问您的照片库以保存图片和视频。</string>

Android 配置

在 AndroidManifest.xml 文件中添加以下权限：

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

使用示例

下面是一个完整的示例，展示了如何使用 gallery_saver_plus 插件来保存从相机拍摄的照片和视频，以及从网络链接保存图片和视频。

示例代码

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:gallery_saver_plus/gallery_saver.dart';
import 'package:image_picker/image_picker.dart';

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

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

class _MyAppState extends State<MyApp> {
  String firstButtonText = '拍照';
  String secondButtonText = '录制视频';
  double textSize = 20;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Container(
          color: Colors.white,
          child: Column(
            children: <Widget>[
              Flexible(
                flex: 1,
                child: Container(
                  child: SizedBox.expand(
                    child: RaisedButton(
                      color: Colors.blue,
                      onPressed: _takePhoto,
                      child: Text(firstButtonText,
                          style: TextStyle(fontSize: textSize, color: Colors.white)),
                    ),
                  ),
                ),
              ),
              Flexible(
                child: Container(
                  child: SizedBox.expand(
                    child: RaisedButton(
                      color: Colors.white,
                      onPressed: _recordVideo,
                      child: Text(secondButtonText,
                          style: TextStyle(fontSize: textSize, color: Colors.blueGrey)),
                    ),
                  ),
                ),
                flex: 1,
              ),
              Flexible(
                child: Container(
                  child: SizedBox.expand(
                    child: RaisedButton(
                      color: Colors.green,
                      onPressed: _saveNetworkImage,
                      child: Text('保存网络图片',
                          style: TextStyle(fontSize: textSize, color: Colors.white)),
                    ),
                  ),
                ),
                flex: 1,
              ),
              Flexible(
                child: Container(
                  child: SizedBox.expand(
                    child: RaisedButton(
                      color: Colors.red,
                      onPressed: _saveNetworkVideo,
                      child: Text('保存网络视频',
                          style: TextStyle(fontSize: textSize, color: Colors.white)),
                    ),
                  ),
                ),
                flex: 1,
              ),
            ],
          ),
        ),
      ),
    );
  }

  void _takePhoto() async {
    final pickedFile = await ImagePicker().pickImage(source: ImageSource.camera);
    if (pickedFile != null) {
      setState(() {
        firstButtonText = '保存中...';
      });
      GallerySaver.saveImage(pickedFile.path).then((String path) {
        setState(() {
          firstButtonText = '图片已保存!';
        });
      });
    }
  }

  void _recordVideo() async {
    final pickedFile = await ImagePicker().pickVideo(source: ImageSource.camera);
    if (pickedFile != null) {
      setState(() {
        secondButtonText = '保存中...';
      });
      GallerySaver.saveVideo(pickedFile.path).then((String path) {
        setState(() {
          secondButtonText = '视频已保存!';
        });
      });
    }
  }

  void _saveNetworkImage() async {
    String imageUrl =
        'https://image.shutterstock.com/image-photo/montreal-canada-july-11-2019-600w-1450023539.jpg';
    GallerySaver.saveImage(imageUrl).then((bool success) {
      setState(() {
        print('图片已保存');
      });
    });
  }

  void _saveNetworkVideo() async {
    String videoUrl =
        'https://sample-videos.com/video123/mp4/720/big_buck_bunny_720p_1mb.mp4';
    GallerySaver.saveVideo(videoUrl).then((bool success) {
      setState(() {
        print('视频已保存');
      });
    });
  }
}

解释

1. 拍照功能：点击“拍照”按钮后，调用 ImagePicker().pickImage 方法打开相机并获取图片路径。然后使用 GallerySaver.saveImage 将图片保存到相册。

2. 录制视频功能：点击“录制视频”按钮后，调用 ImagePicker().pickVideo 方法打开相机录制视频并获取视频路径。然后使用 GallerySaver.saveVideo 将视频保存到相册。

3. 保存网络图片：点击“保存网络图片”按钮后，调用 GallerySaver.saveImage 方法将指定的网络图片URL保存到相册。

4. 保存网络视频：点击“保存网络视频”按钮后，调用 GallerySaver.saveVideo 方法将指定的网络视频URL保存到相册。

注意事项

• 网络图片或视频的链接必须包含 http/https 前缀。
• 在实际应用中，您可能需要处理更多的错误情况和用户权限请求。

通过以上步骤，您可以轻松地在Flutter应用中实现图片和视频的保存功能。