Instagram Assets Picker
An image picker based on Instagram picker UI. It is using the powerful flutter_wechat_assets_picker package to handle the picker and a custom version of image_crop for crop.
๐ Features
- โ Instagram layout
- Scroll behaviors, animation
- Preview, select, unselect action logic
- โ Theme and language customization
- โ Multiple images pick (with maximum limit)
- โ Restore state of picker after pop
- โ Change aspect ratio from 1:1 to 4:5
- โ Crop all images at once and receive a stream with a progress value
- โ Videos are not supported
๐ธ Screenshots
๐ Installation
Add this package to the pubspec.yaml
insta_assets_picker: ^1.2.2
โผ๏ธ DO NOT SKIP THIS PART
Since this package is a custom delegate of flutter_wechat_assets_picker
you MUST follow this package setup recommendation : installation guide.
๐ Usage
For more details check out the example.
Future<List<AssetEntity>?> callPicker() => InstaAssetPicker.pickAssets( context, title: 'Select images', maxAssets: 10, onCompleted: (Stream<InstaAssetsExportDetails> stream) { // TODO : handle crop stream result // i.e : display it using a StreamBuilder // - in the same page (closeOnComplete=true) // - send it to another page (closeOnComplete=false) // or use `stream.listen` to handle the data manually in your state manager // - ... }, );
Fields in InstaAssetsExportDetails
:
NameTypeDescriptioncroppedFilesList<File>
List of all cropped filesselectedAssetsList<AssetEntity>
Selected assets without cropaspectRatiodouble
Selected aspect ratio (1 or 4/5)progressdouble
Progress indicator of the exportation (between 0 and 1)
Picker configuration
Please follow flutter_wechat_assets_picker
documentation : AssetPickerConfig
Localizations
Please follow flutter_wechat_assets_picker
documentation : Localizations
Theme customization
Most of the components of the picker can be customized using theme.
// set picker theme based on app theme primary color final theme = InstaAssetPicker.themeData(Theme.of(context).primaryColor); InstaAssetPicker.pickAssets( context, title: 'Select images', pickerTheme: theme.copyWith( canvasColor: Colors.black, // body background color splashColor: Color.grey, // ontap splash color colorScheme: theme.colorScheme.copyWith( background: Colors.black87, // albums list background color ), appBarTheme: theme.appBarTheme.copyWith( backgroundColor: Colors.black, // app bar background color titleTextStyle: Theme.of(context) .appBarTheme .titleTextStyle ?.copyWith(color: Colors.white), // change app bar title text style to be like app theme ), ), onCompleted: (_) {}, );
โจ Credit
This package is based on flutter_wechat_assets_picker by AlexV525 and image_crop by lykhonis.