Add hero animation

SinaSys · Jun 9, 2022 · 75d7266 · 75d7266
1 parent 36b7145
commit 75d7266
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 17 deletions.
diff --git a/lib/src/view/screen/office_furniture_detail_screen.dart b/lib/src/view/screen/office_furniture_detail_screen.dart
@@ -15,8 +15,9 @@ import 'home_screen.dart';
 
 class OfficeFurnitureDetailScreen extends StatelessWidget {
   final Furniture furniture;
+  final int index;
 
-  const OfficeFurnitureDetailScreen({Key? key, required this.furniture})
+  const OfficeFurnitureDetailScreen({Key? key, required this.furniture,required this.index})
       : super(key: key);
 
   PreferredSizeWidget _appBar(BuildContext context) {
@@ -99,9 +100,12 @@ class OfficeFurnitureDetailScreen extends StatelessWidget {
                 padding: const EdgeInsets.only(left: 15),
                 child: ClipRRect(
                   borderRadius: BorderRadius.circular(20),
-                  child: Image.asset(
-                    furniture.images[index],
-                    fit: BoxFit.fill,
+                  child: Hero(
+                    tag: index,
+                    child: Image.asset(
+                      furniture.images[index],
+                      fit: BoxFit.fill,
+                    ),
                   ),
                 ),
               );
@@ -123,7 +127,8 @@ class OfficeFurnitureDetailScreen extends StatelessWidget {
             ),
           ),
         ],
-      ).fadeAnimation(0.2),
+     // ).fadeAnimation(0.2),
+      ),
     );
   }
 

diff --git a/lib/src/view/screen/office_furniture_list_screen.dart b/lib/src/view/screen/office_furniture_list_screen.dart
@@ -52,14 +52,13 @@ class OfficeFurnitureListScreen extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-
-    Future<Widget?> _navigate(Furniture furniture) {
+    Future<Widget?> _navigate(Furniture furniture, int index) {
       return Navigator.push(
         context,
-        MaterialPageRoute(
-          builder: (_) {
-            return OfficeFurnitureDetailScreen(furniture: furniture);
-          },
+        PageRouteBuilder(
+          transitionDuration: const Duration(seconds: 1),
+          pageBuilder: (_, __, ___) =>
+              OfficeFurnitureDetailScreen(furniture: furniture, index: index),
         ),
       );
     }

diff --git a/lib/src/view/widget/furniture_list_view.dart b/lib/src/view/widget/furniture_list_view.dart
@@ -6,7 +6,7 @@ import '../../model/furniture.dart';
 
 class FurnitureListView extends StatelessWidget {
   final bool isHorizontal;
-  final Function(Furniture furniture)? onTap;
+  final Function(Furniture furniture,int index)? onTap;
   final List<Furniture> furnitureList;
 
   const FurnitureListView(
@@ -37,12 +37,14 @@ class FurnitureListView extends StatelessWidget {
     ).fadeAnimation(0.4);
   }
 
-  Widget _listViewItem(Furniture furniture) {
+  Widget _listViewItem(Furniture furniture,int index) {
     Widget widget;
     widget = isHorizontal == true
         ? Column(
             children: [
-              _furnitureImage(furniture.images[0]),
+              Hero(
+                tag: index,
+                  child: _furnitureImage(furniture.images[0])),
               const SizedBox(height: 10),
               Text(furniture.title.addOverFlow, style: h4Style).fadeAnimation(0.8),
               _furnitureScore(furniture),
@@ -76,7 +78,7 @@ class FurnitureListView extends StatelessWidget {
           );
 
     return GestureDetector(
-      onTap: () => onTap?.call(furniture) ,
+      onTap: () => onTap?.call(furniture,index) ,
       child: widget,
     );
   }
@@ -91,7 +93,7 @@ class FurnitureListView extends StatelessWidget {
               itemCount: furnitureList.length,
               itemBuilder: (_, index) {
                 Furniture furniture = furnitureList[index];
-                return _listViewItem(furniture);
+                return _listViewItem(furniture,index);
               },
               separatorBuilder: (BuildContext context, int index) {
                 return const Padding(
@@ -108,7 +110,7 @@ class FurnitureListView extends StatelessWidget {
                 Furniture furniture = furnitureList.reversed.toList()[index];
                 return Padding(
                   padding: const EdgeInsets.only(bottom: 15, top: 10),
-                  child: _listViewItem(furniture),
+                  child: _listViewItem(furniture,index),
                 );
               },
             ),