Add some animation

lib/main.dart

@@ -6,6 +6,7 @@ import 'package:myapp/models/photo.dart';
 import 'package:myapp/photo_loader.dart';
 import 'package:myapp/photo_provider.dart';
 import 'package:myapp/photo_sync_manager.dart';
+import 'package:myapp/ui/detail_page.dart';
 import 'package:provider/provider.dart';
 import 'package:myapp/ui/gallery_page.dart';
 
@@ -71,6 +72,28 @@ class MyApp2 extends StatelessWidget {
   }
 
   Widget _buildItem(BuildContext context, int index) {
-    return Image.file(File(photoLoader.getPhotos()[index].localPath));
+    var file = File(photoLoader.getPhotos()[index].localPath);
+    return GestureDetector(
+      onTap: () async {
+        routeToDetailPage(file, context);
+      },
+      child: Hero(
+        child: Image.file(file),
+        tag: 'photo_' + file.path,
+      ),
+    );
+  }
+
+  void routeToDetailPage(File file, BuildContext context) async {
+    final page = DetailPage(
+      file: file,
+    );
+    Navigator.of(context).push(
+      MaterialPageRoute(
+        builder: (BuildContext context) {
+          return page;
+        },
+      ),
+    );
   }
 }

lib/ui/detail_page.dart

@@ -1,13 +1,11 @@
 import 'dart:io';
 
 import 'package:flutter/material.dart';
-import 'package:photo_manager/photo_manager.dart';
 
 class DetailPage extends StatefulWidget {
   final File file;
-  final AssetEntity entity;
 
-  const DetailPage({Key key, this.file, this.entity}) : super(key: key);
+  const DetailPage({Key key, this.file}) : super(key: key);
 
   @override
   _DetailPageState createState() => _DetailPageState();
@@ -19,7 +17,6 @@ class _DetailPageState extends State<DetailPage> {
     return Scaffold(
       body: Center(
         child: Container(
-          color: Colors.black,
           child: _buildContent(),
         ),
       ),
@@ -27,34 +24,11 @@ class _DetailPageState extends State<DetailPage> {
   }
 
   Widget _buildContent() {
-    return buildImage();
-  }
-
-  Widget buildImage() {
-    return Image.file(
-      widget.file,
-      filterQuality: FilterQuality.low,
-    );
-  }
-
-  Widget buildInfoItem(String title, String info) {
-    return Padding(
-      padding: const EdgeInsets.all(8.0),
-      child: Row(
-        mainAxisSize: MainAxisSize.max,
-        children: <Widget>[
-          Container(
-            alignment: Alignment.centerLeft,
-            child: Text(
-              title.padLeft(10, " "),
-              textAlign: TextAlign.start,
-            ),
-            width: 88,
-          ),
-          Expanded(
-            child: Text(info.padLeft(40, " ")),
-          ),
-        ],
+    return Hero(
+      tag: 'photo_' + widget.file.path,
+      child: Image.file(
+        widget.file,
+        filterQuality: FilterQuality.low,
       ),
     );
   }

lib/ui/gallery_page.dart

@@ -91,7 +91,6 @@ class _GalleryPageState extends State<GalleryPage> {
     final originFile = await entity.originFile;
     final page = DetailPage(
       file: originFile,
-      entity: entity,
     );
     Navigator.of(context).push(
       MaterialPageRoute(