Flutter图片保存插件awesome_gallery_saver的使用

发布于 1周前 作者 nodeper 来自 Flutter

Flutter图片保存插件awesome_gallery_saver的使用

awesome_gallery_saver 插件用于将图片或视频保存到相册。

使用方法

要使用此插件,在 pubspec.yaml 文件中添加 awesome_gallery_saver 作为依赖项。例如:

dependencies:
  awesome_gallery_saver: ^0.0.6

iOS

您的项目需要用 Swift 创建。在 Info.plist 文件中添加以下键:

  • NSPhotoLibraryAddUsageDescription - 描述为什么您的应用需要访问照片库权限。这在可视化编辑器中称为“隐私 - 照片库添加用途描述”。

Android

您需要请求存储权限才能将图片保存到相册。您可以使用 flutter_permission_handler 来处理存储权限。在 Android 版本 10 中,打开 AndroidManifest.xml 并在应用标签中添加以下行:

<application android:requestLegacyExternalStorage="true" .....>

示例

从互联网保存图片,质量和名称为可选项

Future<void> _saveImage() async {
  // 使用Dio从网络获取图片数据
  final Response<dynamic> response = await Dio().get(
    "https://lmg.jj20.com/up/allimg/1114/040221103339/210402103339-8-1200.jpg",
    options: Options(responseType: ResponseType.bytes),
  );
  // 将获取的数据保存到相册
  final result = await GallerySaver.saveImage(
    Uint8List.fromList(response.data), // 将字节列表转换为Uint8List
    quality: 60, // 设置图片质量
    name: "hello", // 设置保存的文件名
  );
  // 打印结果
  print(result);
}

从互联网下载文件(如图片/视频/GIF/其他)并保存

Future<void> _saveFile() async {
  // 获取临时目录
  final appDocDir = await getTemporaryDirectory();
  // 设置保存路径
  String savePath = appDocDir.path + "/image.jpg";
  // 下载文件到本地
  await Dio().download("https://lmg.jj20.com/up/allimg/1114/040221103339/210402103339-8-1200.jpg", savePath);
  // 将文件保存到相册
  final result = await GallerySaver.saveFile(savePath);
  // 打印结果
  print(result);
}

完整示例Demo

import 'dart:typed_data';

import 'package:awesome_gallery_saver/gallery_saver.dart';
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: const Text('插件应用')),
        body: Center(
          child: Column(
            children: [
              Container(
                padding: const EdgeInsets.only(top: 15),
                width: 200,
                height: 50,
                child: ElevatedButton(
                  onPressed: _saveImage,
                  child: const Text("保存图片"),
                ),
              )
            ],
          ),
        ),
      ),
    );
  }

  Future<void> _saveImage() async {
    // 使用Dio从网络获取图片数据
    final Response<dynamic> response = await Dio().get(
      "https://lmg.jj20.com/up/allimg/1114/040221103339/210402103339-8-1200.jpg",
      options: Options(responseType: ResponseType.bytes),
    );
    // 将获取的数据保存到相册
    final result = await GallerySaver.saveImage(
      Uint8List.fromList(response.data), // 将字节列表转换为Uint8List
      quality: 60, // 设置图片质量
      name: "hello", // 设置保存的文件名
    );
    // 打印结果
    debugPrint(result.toString());
    // 显示Toast提示
    Fluttertoast.showToast(msg: "$result");
  }
}

更多关于Flutter图片保存插件awesome_gallery_saver的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter图片保存插件awesome_gallery_saver的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中使用awesome_gallery_saver插件来保存图片的示例代码。这个插件允许你将图片保存到设备的图库中。

1. 添加依赖

首先,你需要在pubspec.yaml文件中添加awesome_gallery_saver依赖:

dependencies:
  flutter:
    sdk: flutter
  awesome_gallery_saver: ^0.7.0  # 请检查最新版本号

2. 导入插件

在你的Dart文件中导入插件:

import 'package:awesome_gallery_saver/awesome_gallery_saver.dart';
import 'package:path_provider/path_provider.dart';
import 'dart:typed_data';
import 'dart:ui' as ui;

3. 请求存储权限(如果需要)

在Android和iOS上保存图片可能需要存储权限。你可以使用permission_handler插件来请求权限(这里假设你已经添加了permission_handler依赖并进行了相应配置)。

import 'package:permission_handler/permission_handler.dart';

Future<void> requestStoragePermission() async {
  var status = await Permission.storage.status;
  if (!status.isGranted) {
    var result = await Permission.storage.request();
    if (!result.isGranted) {
      throw Exception('存储权限被拒绝');
    }
  }
}

4. 保存图片到图库

以下是一个完整的示例,演示如何生成一个图片(例如,一个简单的矩形),并将其保存到图库中:

import 'package:flutter/material.dart';
import 'package:awesome_gallery_saver/awesome_gallery_saver.dart';
import 'package:path_provider/path_provider.dart';
import 'dart:typed_data';
import 'dart:ui' as ui;
import 'package:permission_handler/permission_handler.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: SaveImageScreen(),
    );
  }
}

class SaveImageScreen extends StatefulWidget {
  @override
  _SaveImageScreenState createState() => _SaveImageScreenState();
}

class _SaveImageScreenState extends State<SaveImageScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('保存图片示例'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () async {
            await requestStoragePermission();
            ByteData image = await generateImage();
            File imageFile = await saveImageToTemp(image);
            bool result = await GallerySaver.saveImage(imageFile.path);
            if (result) {
              ScaffoldMessenger.of(context).showSnackBar(
                SnackBar(content: Text('图片保存成功!')),
              );
            } else {
              ScaffoldMessenger.of(context).showSnackBar(
                SnackBar(content: Text('图片保存失败!')),
              );
            }
          },
          child: Text('保存图片'),
        ),
      ),
    );
  }

  Future<ByteData> generateImage() async {
    final recorder = ui.PictureRecorder();
    final canvas = Canvas(recorder);
    final paint = Paint()
      ..color = Colors.blue
      ..style = PaintingStyle.fill;
    canvas.drawRect(Rect.fromLTWH(0, 0, 200, 200), paint);
    final picture = recorder.endRecording();
    final image = await picture.toImage(200, 200);
    final byteData = await image.toByteData(format: ui.ImageByteFormat.png);
    return byteData;
  }

  Future<File> saveImageToTemp(ByteData image) async {
    final directory = (await getTemporaryDirectory()).path;
    final file = File('$directory/image.png');
    await file.writeAsBytes(image.buffer.asUint8List());
    return file;
  }
}

注意事项

  1. 权限处理:确保在Android的AndroidManifest.xml和iOS的Info.plist中配置了必要的权限。
  2. 错误处理:在生产代码中,添加更多的错误处理逻辑,以处理各种可能的异常情况。
  3. 插件版本:确保使用最新的插件版本,并查看插件的官方文档以获取最新的使用指南和API变化。

这个示例代码展示了如何使用awesome_gallery_saver插件来生成并保存图片到设备的图库中。希望这对你有所帮助!

回到顶部