From bc3e366d7aa7e4f7be7254307f553abecb2dbbbe Mon Sep 17 00:00:00 2001 From: yusufdag Date: Fri, 25 Jun 2021 09:27:37 +0200 Subject: [PATCH 01/10] Update the icon to represent single image --- packages/image_picker/image_picker/example/lib/main.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index 698de1d98898..7a8353c65c3d 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -243,7 +243,7 @@ class _MyHomePageState extends State { }, heroTag: 'image0', tooltip: 'Pick Image from gallery', - child: const Icon(Icons.photo_library), + child: const Icon(Icons.photo), ), ), Padding( From 94e5b6980b35b352fb707269bd03c7baa77ed355 Mon Sep 17 00:00:00 2001 From: yusufdag Date: Fri, 25 Jun 2021 09:58:51 +0200 Subject: [PATCH 02/10] Add a boolean to check multi-image and a list to save images --- packages/image_picker/image_picker/example/lib/main.dart | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index 7a8353c65c3d..2070f1a68938 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -37,8 +37,10 @@ class MyHomePage extends StatefulWidget { class _MyHomePageState extends State { PickedFile? _imageFile; + List? _imageFileList; dynamic _pickImageError; bool isVideo = false; + bool isMultiImage = false; VideoPlayerController? _controller; VideoPlayerController? _toBeDisposed; String? _retrieveDataError; From be4cdbf97a4ba00ba3b5e708a503c9a741eb1f90 Mon Sep 17 00:00:00 2001 From: yusufdag Date: Fri, 25 Jun 2021 10:42:12 +0200 Subject: [PATCH 03/10] Add a new FAB --- .../image_picker/example/lib/main.dart | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index 2070f1a68938..d044322391c1 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -241,6 +241,7 @@ class _MyHomePageState extends State { child: FloatingActionButton( onPressed: () { isVideo = false; + isMultiImage = false; _onImageButtonPressed(ImageSource.gallery, context: context); }, heroTag: 'image0', @@ -253,9 +254,23 @@ class _MyHomePageState extends State { child: FloatingActionButton( onPressed: () { isVideo = false; - _onImageButtonPressed(ImageSource.camera, context: context); + isMultiImage = true; + _onImageButtonPressed(ImageSource.gallery, context: context); }, heroTag: 'image1', + tooltip: 'Pick Multiple Image from gallery', + child: const Icon(Icons.photo_library), + ), + ), + Padding( + padding: const EdgeInsets.only(top: 16.0), + child: FloatingActionButton( + onPressed: () { + isVideo = false; + isMultiImage = false; + _onImageButtonPressed(ImageSource.camera, context: context); + }, + heroTag: 'image2', tooltip: 'Take a Photo', child: const Icon(Icons.camera_alt), ), @@ -266,6 +281,7 @@ class _MyHomePageState extends State { backgroundColor: Colors.red, onPressed: () { isVideo = true; + isMultiImage = false; _onImageButtonPressed(ImageSource.gallery); }, heroTag: 'video0', @@ -279,6 +295,7 @@ class _MyHomePageState extends State { backgroundColor: Colors.red, onPressed: () { isVideo = true; + isMultiImage = false; _onImageButtonPressed(ImageSource.camera); }, heroTag: 'video1', From 3eae21ae3a580c7dc7e1107bb261d0001eff6e1e Mon Sep 17 00:00:00 2001 From: yusufdag Date: Fri, 25 Jun 2021 10:43:39 +0200 Subject: [PATCH 04/10] Refactor the if statement to call getMultiImage method --- .../image_picker/example/lib/main.dart | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index d044322391c1..42b6ad0f5a85 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -83,6 +83,24 @@ class _MyHomePageState extends State { final PickedFile? file = await _picker.getVideo( source: source, maxDuration: const Duration(seconds: 10)); await _playVideo(file); + } else if (isMultiImage) { + await _displayPickImageDialog(context!, + (double? maxWidth, double? maxHeight, int? quality) async { + try { + final pickedFileList = await _picker.getMultiImage( + maxWidth: maxWidth, + maxHeight: maxHeight, + imageQuality: quality, + ); + setState(() { + _imageFileList = pickedFileList; + }); + } catch (e) { + setState(() { + _pickImageError = e; + }); + } + }); } else { await _displayPickImageDialog(context!, (double? maxWidth, double? maxHeight, int? quality) async { From ec1bbd70e939d268805bf2bf244b9a8eeb26527d Mon Sep 17 00:00:00 2001 From: yusufdag Date: Fri, 25 Jun 2021 10:44:05 +0200 Subject: [PATCH 05/10] Add _previewMultiImages method --- .../image_picker/example/lib/main.dart | 39 +++++++++++++++++++ 1 file changed, 39 insertions(+) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index 42b6ad0f5a85..631e1fd934c7 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -194,6 +194,45 @@ class _MyHomePageState extends State { } } + Widget _previewMultiImages() { + final Text? retrieveError = _getRetrieveErrorWidget(); + if (retrieveError != null) { + return retrieveError; + } + if (_imageFileList != null) { + if (kIsWeb) { + // Why network? + // See https://pub.dev/packages/image_picker#getting-ready-for-the-web-platform + return ListView.builder( + key: UniqueKey(), + itemBuilder: (context, index) { + return Image.network(_imageFileList![index].path); + }, + itemCount: _imageFileList!.length, + ); + } else { + return Semantics( + child: ListView.builder( + key: UniqueKey(), + itemBuilder: (context, index) { + return Image.file(File(_imageFileList![index].path)); + }, + itemCount: _imageFileList!.length, + ), + label: 'image_picker_example_picked_images'); + } + } else if (_pickImageError != null) { + return Text( + 'Pick image error: $_pickImageError', + textAlign: TextAlign.center, + ); + } else { + return const Text( + 'You have not yet picked an image.', + textAlign: TextAlign.center, + ); + } + } Future retrieveLostData() async { final LostData response = await _picker.getLostData(); if (response.isEmpty) { From c825f15db95ac14e7a157590346bce14f2eaa270 Mon Sep 17 00:00:00 2001 From: yusufdag Date: Fri, 25 Jun 2021 10:44:29 +0200 Subject: [PATCH 06/10] Add _handlePreview method --- .../image_picker/example/lib/main.dart | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index 631e1fd934c7..50b3e08d66e8 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -233,6 +233,17 @@ class _MyHomePageState extends State { ); } } + + Widget _handlePreview() { + if (isVideo) { + return _previewVideo(); + } else if (isMultiImage) { + return _previewMultiImages(); + } else { + return _previewImage(); + } + } + Future retrieveLostData() async { final LostData response = await _picker.getLostData(); if (response.isEmpty) { @@ -272,7 +283,7 @@ class _MyHomePageState extends State { textAlign: TextAlign.center, ); case ConnectionState.done: - return isVideo ? _previewVideo() : _previewImage(); + return _handlePreview(); default: if (snapshot.hasError) { return Text( @@ -288,7 +299,7 @@ class _MyHomePageState extends State { } }, ) - : (isVideo ? _previewVideo() : _previewImage()), + : _handlePreview(), ), floatingActionButton: Column( mainAxisAlignment: MainAxisAlignment.end, From a0ce8ac5000e1b001970eead773b594e62786f7f Mon Sep 17 00:00:00 2001 From: yusufdag Date: Fri, 25 Jun 2021 10:50:42 +0200 Subject: [PATCH 07/10] Update the version and CHANGELOG --- packages/image_picker/image_picker/CHANGELOG.md | 3 +++ packages/image_picker/image_picker/pubspec.yaml | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/image_picker/image_picker/CHANGELOG.md b/packages/image_picker/image_picker/CHANGELOG.md index 428203b0327a..8385aff7e48c 100644 --- a/packages/image_picker/image_picker/CHANGELOG.md +++ b/packages/image_picker/image_picker/CHANGELOG.md @@ -1,3 +1,6 @@ +## 0.8.1+2 + +* Update the example app to support the multi-image feature. ## 0.8.1+1 diff --git a/packages/image_picker/image_picker/pubspec.yaml b/packages/image_picker/image_picker/pubspec.yaml index e8fafb324e71..620d118142fb 100755 --- a/packages/image_picker/image_picker/pubspec.yaml +++ b/packages/image_picker/image_picker/pubspec.yaml @@ -3,7 +3,7 @@ description: Flutter plugin for selecting images from the Android and iOS image library, and taking new pictures with the camera. repository: https://github.com/flutter/plugins/tree/master/packages/image_picker/image_picker issue_tracker: https://github.com/flutter/flutter/issues?q=is%3Aissue+is%3Aopen+label%3A%22p%3A+image_picker%22 -version: 0.8.1+1 +version: 0.8.1+2 environment: sdk: ">=2.12.0 <3.0.0" From 83469f30db95736cd8aa0c697e2f07dca2ee8a5e Mon Sep 17 00:00:00 2001 From: yusufdag Date: Mon, 28 Jun 2021 08:40:04 +0200 Subject: [PATCH 08/10] Refactor for cleaner approach --- .../image_picker/example/lib/main.dart | 92 ++++++------------- 1 file changed, 30 insertions(+), 62 deletions(-) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index 50b3e08d66e8..a52185981cd2 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -36,11 +36,17 @@ class MyHomePage extends StatefulWidget { } class _MyHomePageState extends State { - PickedFile? _imageFile; + //PickedFile? _imageFile; List? _imageFileList; + + set _imageFile(PickedFile? value) { + _imageFileList = value == null ? null : [value]; + } + dynamic _pickImageError; bool isVideo = false; - bool isMultiImage = false; + + //bool isMultiImage = false; VideoPlayerController? _controller; VideoPlayerController? _toBeDisposed; String? _retrieveDataError; @@ -75,7 +81,7 @@ class _MyHomePageState extends State { } void _onImageButtonPressed(ImageSource source, - {BuildContext? context}) async { + {BuildContext? context, bool isMultiImage = false}) async { if (_controller != null) { await _controller!.setVolume(0.0); } @@ -166,61 +172,26 @@ class _MyHomePageState extends State { ); } - Widget _previewImage() { - final Text? retrieveError = _getRetrieveErrorWidget(); - if (retrieveError != null) { - return retrieveError; - } - if (_imageFile != null) { - if (kIsWeb) { - // Why network? - // See https://pub.dev/packages/image_picker#getting-ready-for-the-web-platform - return Image.network(_imageFile!.path); - } else { - return Semantics( - child: Image.file(File(_imageFile!.path)), - label: 'image_picker_example_picked_image'); - } - } else if (_pickImageError != null) { - return Text( - 'Pick image error: $_pickImageError', - textAlign: TextAlign.center, - ); - } else { - return const Text( - 'You have not yet picked an image.', - textAlign: TextAlign.center, - ); - } - } - - Widget _previewMultiImages() { + Widget _previewImages() { final Text? retrieveError = _getRetrieveErrorWidget(); if (retrieveError != null) { return retrieveError; } if (_imageFileList != null) { - if (kIsWeb) { - // Why network? - // See https://pub.dev/packages/image_picker#getting-ready-for-the-web-platform - return ListView.builder( - key: UniqueKey(), - itemBuilder: (context, index) { - return Image.network(_imageFileList![index].path); - }, - itemCount: _imageFileList!.length, - ); - } else { - return Semantics( - child: ListView.builder( - key: UniqueKey(), - itemBuilder: (context, index) { - return Image.file(File(_imageFileList![index].path)); - }, - itemCount: _imageFileList!.length, - ), - label: 'image_picker_example_picked_images'); - } + return Semantics( + child: ListView.builder( + key: UniqueKey(), + itemBuilder: (context, index) { + if (kIsWeb) { + // Why network? + // See https://pub.dev/packages/image_picker#getting-ready-for-the-web-platform + return Image.network(_imageFileList![index].path); + } + return Image.file(File(_imageFileList![index].path)); + }, + itemCount: _imageFileList!.length, + ), + label: 'image_picker_example_picked_images'); } else if (_pickImageError != null) { return Text( 'Pick image error: $_pickImageError', @@ -237,10 +208,8 @@ class _MyHomePageState extends State { Widget _handlePreview() { if (isVideo) { return _previewVideo(); - } else if (isMultiImage) { - return _previewMultiImages(); } else { - return _previewImage(); + return _previewImages(); } } @@ -309,7 +278,6 @@ class _MyHomePageState extends State { child: FloatingActionButton( onPressed: () { isVideo = false; - isMultiImage = false; _onImageButtonPressed(ImageSource.gallery, context: context); }, heroTag: 'image0', @@ -322,8 +290,11 @@ class _MyHomePageState extends State { child: FloatingActionButton( onPressed: () { isVideo = false; - isMultiImage = true; - _onImageButtonPressed(ImageSource.gallery, context: context); + _onImageButtonPressed( + ImageSource.gallery, + context: context, + isMultiImage: true, + ); }, heroTag: 'image1', tooltip: 'Pick Multiple Image from gallery', @@ -335,7 +306,6 @@ class _MyHomePageState extends State { child: FloatingActionButton( onPressed: () { isVideo = false; - isMultiImage = false; _onImageButtonPressed(ImageSource.camera, context: context); }, heroTag: 'image2', @@ -349,7 +319,6 @@ class _MyHomePageState extends State { backgroundColor: Colors.red, onPressed: () { isVideo = true; - isMultiImage = false; _onImageButtonPressed(ImageSource.gallery); }, heroTag: 'video0', @@ -363,7 +332,6 @@ class _MyHomePageState extends State { backgroundColor: Colors.red, onPressed: () { isVideo = true; - isMultiImage = false; _onImageButtonPressed(ImageSource.camera); }, heroTag: 'video1', From ba1e3236b4388758278c28aaf07a85bbaf990466 Mon Sep 17 00:00:00 2001 From: yusufdag Date: Mon, 28 Jun 2021 08:54:51 +0200 Subject: [PATCH 09/10] Remove the comments --- packages/image_picker/image_picker/example/lib/main.dart | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index a52185981cd2..ec8346dfc639 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -36,7 +36,6 @@ class MyHomePage extends StatefulWidget { } class _MyHomePageState extends State { - //PickedFile? _imageFile; List? _imageFileList; set _imageFile(PickedFile? value) { @@ -46,7 +45,6 @@ class _MyHomePageState extends State { dynamic _pickImageError; bool isVideo = false; - //bool isMultiImage = false; VideoPlayerController? _controller; VideoPlayerController? _toBeDisposed; String? _retrieveDataError; From 1f44b6c7f0f659a61e8edee90d36d13ba8a251ca Mon Sep 17 00:00:00 2001 From: yusufdag Date: Mon, 28 Jun 2021 09:49:38 +0200 Subject: [PATCH 10/10] Add label to each image --- .../image_picker/example/lib/main.dart | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/packages/image_picker/image_picker/example/lib/main.dart b/packages/image_picker/image_picker/example/lib/main.dart index ec8346dfc639..71388ef5db2f 100755 --- a/packages/image_picker/image_picker/example/lib/main.dart +++ b/packages/image_picker/image_picker/example/lib/main.dart @@ -180,12 +180,14 @@ class _MyHomePageState extends State { child: ListView.builder( key: UniqueKey(), itemBuilder: (context, index) { - if (kIsWeb) { - // Why network? - // See https://pub.dev/packages/image_picker#getting-ready-for-the-web-platform - return Image.network(_imageFileList![index].path); - } - return Image.file(File(_imageFileList![index].path)); + // Why network for web? + // See https://pub.dev/packages/image_picker#getting-ready-for-the-web-platform + return Semantics( + label: 'image_picker_example_picked_image', + child: kIsWeb + ? Image.network(_imageFileList![index].path) + : Image.file(File(_imageFileList![index].path)), + ); }, itemCount: _imageFileList!.length, ),