In this guide, we will learn how to save an image to the gallery by using the external package name gallery_saver in a flutter. Basically, it saves images and videos from the network or temporary files to external storage. Both images and videos will be visible in Android Gallery and iOS Photos.
To set up the gallery_saver in our application. At first, we should do the following things.
Step1: Add the dependency
Start by adding the dependency to the pubspec.yml file
dependencies:
gallery_saver: ^2.3.2
or
We can do that by running the following command in our terminal: $ flutter pub add gallery_saver
The gallery_saver
the plugin will be added as a dependency to our pubspec.yaml
file as a result.
Configuration
IOS
Add the following keys to your Info.plist file, located in <project root>/ios/Runner/Info.plist
:
NSPhotoLibraryUsageDescription
– describe why your app needs permission for the photo library. This is called Privacy – Photo Library Usage Description in the visual editor.
android.permission.WRITE_EXTERNAL_STORAGE
– Permission for the usage of external storage
Let’s take an example of how we can save the image to the gallery in our flutter application.
import 'package:flutter/material.dart';
import 'package:gallery_saver/gallery_saver.dart';
class ImageSaveScreen extends StatefulWidget {
const ImageSaveScreen({Key? key}) : super(key: key);
@override
State<ImageSaveScreen> createState() => _ImageSaveScreenState();
}
class _ImageSaveScreenState extends State<ImageSaveScreen> {
String path = 'https://i.ytimg.com/vi/5uShwmVXopc/maxresdefault.jpg';
saveImage() async {
await GallerySaver.saveImage(path, toDcim: true, albumName: 'Flutter');
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Image Save to Gallery'),
centerTitle: true,
),
body: Column(
children: [
Image.network(
path,
fit: BoxFit.cover,
),
Padding(
padding: const EdgeInsets.all(20.0),
child: ElevatedButton(
style: ElevatedButton.styleFrom(
primary: Colors.blue,
shape: const StadiumBorder(),
textStyle: const TextStyle(fontSize: 20),
minimumSize: const Size.fromHeight(72),
),
onPressed: () {
saveImage();
},
child: const Text('Download Images to Gallery'),
),
)
],
),
);
}
}
Meanwhile, when we run this application in the emulator or device, we should get the UI similar to the screenshot below:
on clicking on the Download image to the gallery the image is saved in our local gallery folder name as Flutter which is shown below
Thank you for reading the Guide about How to save an image to the Gallery.
Related guide: How To Select An Image In Flutter