Imagepicker Widget in Flutter – Gallery Made easy
Imagepicker widget in Flutter makes the life so much easy by bridging Photo gallery in Flutter. In this article we will read more about using the ImagePicker Plugin/Widget to create a good gallery like app.
Even before we jump into that, we will be requiring the one important plugin – image_picker
dependencies: image_picker: ^0.6.1+4
This will also require you to add an import statement in the main.dart(or whichever is the main file).
Once these two are added, incase the application has to be used for IOS, make sure to add the following changes in info.plist file.
- NSPhotoLibraryUsageDescription – describe why your app needs permission for the photo library. This is called Privacy – Photo Library Usage Description in the visual editor.
- NSCameraUsageDescription – describe why your app needs access to the camera. This is called Privacy – Camera Usage Description in the visual editor.
- NSMicrophoneUsageDescription – describe why your app needs access to the microphone, if you intend to record videos. This is called Privacy – Microphone Usage Description in the visual editor.
Image Picker Widget – Basics
To make use of this ImagePicker widget, just call the class ImagePicker. There are two possibilities from this class.
- Choose an Image or Choose a Video
- Choose one of the above from a Gallery or a Camera Source directly
The above are possible through the method callbacks.
- ImagePicker.pickImage() with source as ImageSource.gallery or ImageSource.camera
- or ImagePicker.pickVideo() with the sources as mentioned above.
Both the calls above mentioned are async calls(Read more about FutureBuilder Widget and Asynchronous operations). Hence, it requires to setState() on the image/video that is selected.
The ImagePicker.<source call> returns a file location of the image/video. It is upto us to load the Image using the Image.file() call.
All of this are pieced together in the below example code. To know more about it read it in the next section.
ImagePicker Widget – Example Application
The below example app creates a Image Picker button which lets you to choose either a Image from gallery or directly from the Camera.
The next section contains the app images. Also find code explanation below.
ImagePicker Widget – Conclusion
The Image Picker Widget is a useful/handy plugin to create faster access to Gallery or Camera source directly. Eventhough the Widget itself cannot be customised, the already available Plugin supports both the IOS and Android alike without any additional changes! Its definitely a win-win situation!
If you require additional customisation, you might have to create the entire logic from scratch at this moment – Sad face 🙁