Add Images demo to the gallery app. (#13141)

dev/benchmarks/complex_layout/pubspec.yaml

@@ -11,7 +11,7 @@ dependencies:
   flutter_gallery_assets:
     git:
       url: https://flutter.googlesource.com/gallery-assets
-      ref: 6427f36af1bdb2fffaeda1c46d5e52d7b636c93d
+      ref: d318485f208376e06d7e330d9f191141d14722b8
 
 dev_dependencies:
   flutter_test:

examples/flutter_gallery/lib/demo/all.dart

@@ -7,6 +7,7 @@ export 'calculator_demo.dart';
 export 'colors_demo.dart';
 export 'contacts_demo.dart';
 export 'cupertino/cupertino.dart';
+export 'images_demo.dart';
 export 'material/material.dart';
 export 'pesto_demo.dart';
 export 'shrine_demo.dart';

examples/flutter_gallery/lib/demo/images_demo.dart

@@ -0,0 +1,28 @@
+import 'package:flutter/material.dart';
+
+import '../gallery/demo.dart';
+
+class ImagesDemo extends StatelessWidget {
+  static const String routeName = '/images';
+
+  @override
+  Widget build(BuildContext context) {
+    return new TabbedComponentDemoScaffold(
+      title: 'Animated images',
+      demos: <ComponentDemoTabData>[
+        new ComponentDemoTabData(
+          tabName: 'ANIMATED WEBP',
+          description: '',
+          exampleCodeTag: 'animated_image',
+          demoWidget: new Image.asset('packages/flutter_gallery_assets/animated_flutter_stickers.webp'),
+        ),
+        new ComponentDemoTabData(
+          tabName: 'ANIMATED GIF',
+          description: '',
+          exampleCodeTag: 'animated_image',
+          demoWidget: new Image.asset('packages/flutter_gallery_assets/animated_flutter_lgtm.gif'),
+        ),
+      ]
+    );
+  }
+}

examples/flutter_gallery/lib/gallery/example_code.dart

@@ -227,3 +227,12 @@ new GridView.count(
 // END
   }
 }
+
+
+class AnimatedImage {
+  void animatedImage() {
+// START animated_image
+new Image.network('https://example.com/animated-image.gif');
+// END
+  }
+}

examples/flutter_gallery/lib/gallery/item.dart

@@ -306,6 +306,14 @@ List<GalleryItem> _buildGalleryItems() {
       routeName: CupertinoSwitchDemo.routeName,
       buildRoute: (BuildContext context) => new CupertinoSwitchDemo(),
     ),
+    // Media
+    new GalleryItem(
+      title: 'Animated images',
+      subtitle: 'GIF and WebP animations',
+      category: 'Media',
+      routeName: ImagesDemo.routeName,
+      buildRoute: (BuildContext context) => new ImagesDemo(),
+    ),
     // Styles
     new GalleryItem(
       title: 'Colors',

examples/flutter_gallery/pubspec.yaml

@@ -12,7 +12,7 @@ dependencies:
   flutter_gallery_assets:
     git:
       url: https://flutter.googlesource.com/gallery-assets
-      ref: 6427f36af1bdb2fffaeda1c46d5e52d7b636c93d
+      ref: d318485f208376e06d7e330d9f191141d14722b8
 
 dev_dependencies:
   flutter_test:
@@ -67,6 +67,8 @@ flutter:
   uses-material-design: true
   assets:
     - lib/gallery/example_code.dart
+    - packages/flutter_gallery_assets/animated_flutter_lgtm.gif
+    - packages/flutter_gallery_assets/animated_flutter_stickers.webp
     - packages/flutter_gallery_assets/appbar_background.jpg
     - packages/flutter_gallery_assets/appbar/appbar_background_layer0.png
     - packages/flutter_gallery_assets/appbar/appbar_background_layer1.png

examples/flutter_gallery/test/live_smoketest.dart

@@ -100,6 +100,9 @@ const List<Demo> demos = const <Demo>[
   const Demo('Sliders'),
   const Demo('Switches'),
 
+  // Media
+  const Demo('Animated Images'),
+
   // Style
   const Demo('Colors'),
   const Demo('Typography'),

examples/flutter_gallery/test_driver/transitions_perf_test.dart

@@ -74,6 +74,9 @@ const List<Demo> demos = const <Demo>[
   const Demo('Sliders'),
   const Demo('Switches'),
 
+  // Media
+  const Demo('Animated Images'),
+
   // Style
   const Demo('Colors'),
   const Demo('Typography'),