Skip to content
This repository has been archived by the owner on Feb 22, 2023. It is now read-only.

[image_picker] Add web support to the example app. #2816

Merged
merged 5 commits into from
Jun 5, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions packages/image_picker/image_picker/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
## 0.6.7+1

* Add web support to the example app.

## 0.6.7

* Utilize the new platform_interface package.
Expand Down
16 changes: 13 additions & 3 deletions packages/image_picker/image_picker/example/lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,11 @@ class _MyHomePageState extends State<MyHomePage> {
Future<void> _playVideo(PickedFile file) async {
if (file != null && mounted) {
await _disposeVideoController();
_controller = VideoPlayerController.file(File(file.path));
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);
Expand Down Expand Up @@ -139,7 +143,13 @@ class _MyHomePageState extends State<MyHomePage> {
return retrieveError;
}
if (_imageFile != null) {
return Image.file(File(_imageFile.path));
if (kIsWeb) {
// Why network?
// See https://pub.dev/packages/image_picker#getting-ready-for-the-web-platform
return Image.network(_imageFile.path);
ditman marked this conversation as resolved.
Show resolved Hide resolved
} else {
return Image.file(File(_imageFile.path));
}
} else if (_pickImageError != null) {
return Text(
'Pick image error: $_pickImageError',
Expand Down Expand Up @@ -180,7 +190,7 @@ class _MyHomePageState extends State<MyHomePage> {
title: Text(widget.title),
),
body: Center(
child: defaultTargetPlatform == TargetPlatform.android
child: !kIsWeb && defaultTargetPlatform == TargetPlatform.android
? FutureBuilder<void>(
future: retrieveLostData(),
builder: (BuildContext context, AsyncSnapshot<void> snapshot) {
Expand Down
1 change: 1 addition & 0 deletions packages/image_picker/image_picker/example/pubspec.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ dependencies:
flutter_plugin_android_lifecycle: ^1.0.2
image_picker:
path: ../
image_picker_for_web: ^0.1.0

dev_dependencies:
flutter_driver:
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
33 changes: 33 additions & 0 deletions packages/image_picker/image_picker/example/web/index.html
Original file line number Diff line number Diff line change
@@ -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>
23 changes: 23 additions & 0 deletions packages/image_picker/image_picker/example/web/manifest.json
Original file line number Diff line number Diff line change
@@ -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"
}
]
}
2 changes: 1 addition & 1 deletion packages/image_picker/image_picker/pubspec.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ name: image_picker
description: Flutter plugin for selecting images from the Android and iOS image
library, and taking new pictures with the camera.
homepage: https://github.com/flutter/plugins/tree/master/packages/image_picker/image_picker
version: 0.6.7
version: 0.6.7+1

flutter:
plugin:
Expand Down