updating example and adding method

packages/image_picker/image_picker/CHANGELOG.md

@@ -1,3 +1,7 @@
+## 0.6.7
+
+* Utilize the new platform_interface package.
+
 ## 0.6.6+2
 
 * Update lower bound of dart dependency to 2.1.0.

packages/image_picker/image_picker/example/lib/main.dart

@@ -7,6 +7,7 @@
 import 'dart:async';
 import 'dart:io';
 
+import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/src/widgets/basic.dart';
 import 'package:flutter/src/widgets/container.dart';
@@ -37,20 +38,25 @@ class MyHomePage extends StatefulWidget {
 }
 
 class _MyHomePageState extends State<MyHomePage> {
-  File _imageFile;
+  PickedFile _imageFile;
   dynamic _pickImageError;
-  bool isVideo = false;
+  RetrieveType mediaSource = RetrieveType.video;
   VideoPlayerController _controller;
   String _retrieveDataError;
 
+  final ImagePicker _picker = ImagePicker();
   final TextEditingController maxWidthController = TextEditingController();
   final TextEditingController maxHeightController = TextEditingController();
   final TextEditingController qualityController = TextEditingController();
 
-  Future<void> _playVideo(File file) async {
+  Future<void> _playVideo(PickedFile file) async {
     if (file != null && mounted) {
       await _disposeVideoController();
-      _controller = VideoPlayerController.file(file);
+      if (kIsWeb) {
+        _controller = VideoPlayerController.network(file.path);
+      } else {
+        _controller = VideoPlayerController.file(File(file.path));
+      }
       await _controller.setVolume(1.0);
       await _controller.initialize();
       await _controller.setLooping(true);
@@ -63,24 +69,32 @@ class _MyHomePageState extends State<MyHomePage> {
     if (_controller != null) {
       await _controller.setVolume(0.0);
     }
-    if (isVideo) {
-      final File file = await ImagePicker.pickVideo(
-          source: source, maxDuration: const Duration(seconds: 10));
-      await _playVideo(file);
-    } else {
-      await _displayPickImageDialog(context,
-          (double maxWidth, double maxHeight, int quality) async {
-        try {
-          _imageFile = await ImagePicker.pickImage(
+    switch (mediaSource) {
+      case RetrieveType.image:
+        await _displayPickImageDialog(context,
+            (double maxWidth, double maxHeight, int quality) async {
+          try {
+            final pickedFile = await _picker.getImage(
               source: source,
               maxWidth: maxWidth,
               maxHeight: maxHeight,
-              imageQuality: quality);
-          setState(() {});
-        } catch (e) {
-          _pickImageError = e;
-        }
-      });
+              imageQuality: quality,
+            );
+            setState(() {
+              _imageFile = pickedFile;
+            });
+          } catch (e) {
+            setState(() {
+              _pickImageError = e;
+            });
+          }
+        });
+        break;
+      case RetrieveType.video:
+        final PickedFile file = await _picker.getVideo(
+            source: source, maxDuration: const Duration(seconds: 10));
+        await _playVideo(file);
+        break;
     }
   }
 
@@ -132,7 +146,13 @@ class _MyHomePageState extends State<MyHomePage> {
       return retrieveError;
     }
     if (_imageFile != null) {
-      return Image.file(_imageFile);
+      if (kIsWeb) {
+        return Image.network(_imageFile.path);
+        // Or from memory...
+      } else {
+        // This would also work from memory as well...
+        return Image.file(File(_imageFile.path));
+      }
     } else if (_pickImageError != null) {
       return Text(
         'Pick image error: $_pickImageError',
@@ -147,16 +167,16 @@ class _MyHomePageState extends State<MyHomePage> {
   }
 
   Future<void> retrieveLostData() async {
-    final LostDataResponse response = await ImagePicker.retrieveLostData();
+    final LostData response = await _picker.getLostData();
     if (response.isEmpty) {
       return;
     }
     if (response.file != null) {
       if (response.type == RetrieveType.video) {
-        isVideo = true;
+        mediaSource = RetrieveType.video;
         await _playVideo(response.file);
       } else {
-        isVideo = false;
+        mediaSource = RetrieveType.image;
         setState(() {
           _imageFile = response.file;
         });
@@ -171,9 +191,18 @@ class _MyHomePageState extends State<MyHomePage> {
     return Scaffold(
       appBar: AppBar(
         title: Text(widget.title),
+        actions: [
+          IconButton(
+            onPressed: () {
+              _onImageButtonPressed(ImageSource.gallery, context: context);
+            },
+            tooltip: 'Pick Media',
+            icon: const Icon(Icons.add),
+          ),
+        ],
       ),
       body: Center(
-        child: Platform.isAndroid
+        child: !kIsWeb && defaultTargetPlatform == TargetPlatform.android
             ? FutureBuilder<void>(
                 future: retrieveLostData(),
                 builder: (BuildContext context, AsyncSnapshot<void> snapshot) {
@@ -185,7 +214,9 @@ class _MyHomePageState extends State<MyHomePage> {
                         textAlign: TextAlign.center,
                       );
                     case ConnectionState.done:
-                      return isVideo ? _previewVideo() : _previewImage();
+                      return mediaSource == RetrieveType.video
+                          ? _previewVideo()
+                          : _previewImage();
                     default:
                       if (snapshot.hasError) {
                         return Text(
@@ -201,25 +232,30 @@ class _MyHomePageState extends State<MyHomePage> {
                   }
                 },
               )
-            : (isVideo ? _previewVideo() : _previewImage()),
+            : (mediaSource == RetrieveType.video
+                ? _previewVideo()
+                : _previewImage()),
       ),
       floatingActionButton: Column(
         mainAxisAlignment: MainAxisAlignment.end,
         children: <Widget>[
-          FloatingActionButton(
-            onPressed: () {
-              isVideo = false;
-              _onImageButtonPressed(ImageSource.gallery, context: context);
-            },
-            heroTag: 'image0',
-            tooltip: 'Pick Image from gallery',
-            child: const Icon(Icons.photo_library),
+          Padding(
+            padding: const EdgeInsets.only(top: 0.0),
+            child: FloatingActionButton(
+              onPressed: () {
+                mediaSource = RetrieveType.image;
+                _onImageButtonPressed(ImageSource.gallery, context: context);
+              },
+              heroTag: 'image0',
+              tooltip: 'Pick Image from gallery',
+              child: const Icon(Icons.photo_library),
+            ),
           ),
           Padding(
             padding: const EdgeInsets.only(top: 16.0),
             child: FloatingActionButton(
               onPressed: () {
-                isVideo = false;
+                mediaSource = RetrieveType.image;
                 _onImageButtonPressed(ImageSource.camera, context: context);
               },
               heroTag: 'image1',
@@ -232,7 +268,7 @@ class _MyHomePageState extends State<MyHomePage> {
             child: FloatingActionButton(
               backgroundColor: Colors.red,
               onPressed: () {
-                isVideo = true;
+                mediaSource = RetrieveType.video;
                 _onImageButtonPressed(ImageSource.gallery);
               },
               heroTag: 'video0',
@@ -245,7 +281,7 @@ class _MyHomePageState extends State<MyHomePage> {
             child: FloatingActionButton(
               backgroundColor: Colors.red,
               onPressed: () {
-                isVideo = true;
+                mediaSource = RetrieveType.video;
                 _onImageButtonPressed(ImageSource.camera);
               },
               heroTag: 'video1',

packages/image_picker/image_picker/example/pubspec.yaml

@@ -6,9 +6,9 @@ dependencies:
   video_player: ^0.10.3
   flutter:
     sdk: flutter
+  flutter_plugin_android_lifecycle: ^1.0.2
   image_picker:
     path: ../
-  flutter_plugin_android_lifecycle: ^1.0.2
 
 dev_dependencies:
   flutter_driver:

packages/image_picker/image_picker/example/web/index.html

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
+  <meta name="description" content="An example of the image_picker on the web.">
+
+  <!-- iOS meta tags & icons -->
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
+  <meta name="apple-mobile-web-app-title" content="example">
+  <link rel="apple-touch-icon" href="icons/Icon-192.png">
+
+  <!-- Favicon -->
+  <link rel="shortcut icon" type="image/png" href="favicon.png"/>
+
+  <title>url_launcher web example</title>
+  <link rel="manifest" href="manifest.json">
+</head>
+<body>
+  <!-- This script installs service_worker.js to provide PWA functionality to
+       application. For more information, see:
+       https://developers.google.com/web/fundamentals/primers/service-workers -->
+  <!-- <script>
+    if ('serviceWorker' in navigator) {
+      window.addEventListener('load', function () {
+        navigator.serviceWorker.register('flutter_service_worker.js');
+      });
+    }
+  </script> -->
+  <script src="main.dart.js" type="application/javascript"></script>
+</body>
+</html>

packages/image_picker/image_picker/example/web/manifest.json

@@ -0,0 +1,23 @@
+{
+    "name": "image_picker example",
+    "short_name": "image_picker",
+    "start_url": ".",
+    "display": "minimal-ui",
+    "background_color": "#0175C2",
+    "theme_color": "#0175C2",
+    "description": "An example of the image_picker on the web.",
+    "orientation": "portrait-primary",
+    "prefer_related_applications": false,
+    "icons": [
+        {
+            "src": "icons/Icon-192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/Icon-512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ]
+}