Merge pull request #45 from fujidaiti/v1.0.0-rc.2

v1.0.0-rc.2

example/lib/main.dart

@@ -3,6 +3,7 @@ import 'package:example/src/animation_example.dart';
 import 'package:example/src/complex_example/complex_example.dart';
 import 'package:example/src/custom_snap_insets_example.dart';
 import 'package:example/src/gutter_example.dart';
+import 'package:example/src/hero_animation_example.dart';
 import 'package:example/src/modal_dialog_example.dart';
 import 'package:example/src/overshoot_effect_example.dart';
 import 'package:example/src/simple_example.dart';
@@ -70,9 +71,13 @@ class Home extends StatelessWidget {
           onTap: () => pushRoute(const ViewportConfigurationExample()),
         ),
         ListTile(
-          title: const Text("Animation Example"),
+          title: const Text("Viewport Inset Animation Example"),
           onTap: () => pushRoute(const AnimationExample()),
         ),
+        ListTile(
+          title: const Text("Hero Animation Example"),
+          onTap: () => pushRoute(const HeroAnimationExample()),
+        ),
         ListTile(
           title: const Text("Complex Example"),
           onTap: () => pushRoute(const ComplexExample()),

example/lib/src/common.dart

@@ -20,16 +20,18 @@ class ExampleListView extends StatefulWidget {
 
 class _ExampleListViewState extends State<ExampleListView> {
   final Color color = Color.fromARGB(
-    220,
+    255,
     Random().nextInt(155) + 100,
     Random().nextInt(155) + 100,
     Random().nextInt(155) + 100,
   );
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return Card(
       color: color,
+      margin: EdgeInsets.zero,
+      shape: const RoundedRectangleBorder(),
       child: ListView.builder(
         padding: widget.padding ?? EdgeInsets.zero,
         controller: widget.controller,

example/lib/src/complex_example/album_details.dart

@@ -7,12 +7,9 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:flutter_slidable/flutter_slidable.dart';
 
 void showAlbumDetailsDialog(BuildContext context, int index) {
-  showModalExprollable(
-    context,
-    useSafeArea: false,
-    useRootNavigator: false,
-    builder: (context) => AlbumDetailsDialog(
-      index: index,
+  Navigator.of(context).push(
+    ModalExprollableRouteBuilder(
+      pageBuilder: (_, __, ___) => AlbumDetailsDialog(index: index),
     ),
   );
 }

example/lib/src/hero_animation_example.dart

@@ -0,0 +1,141 @@
+import 'package:example/src/common.dart';
+import 'package:exprollable_page_view/exprollable_page_view.dart';
+import 'package:flutter/material.dart';
+
+const colors = [
+  Colors.red,
+  Colors.green,
+  Colors.blue,
+  Colors.amber,
+  Colors.black,
+  Colors.cyan,
+  Colors.blueGrey,
+  Colors.deepOrange,
+  Colors.purple,
+  Colors.indigo,
+  Colors.lime,
+  ...Colors.accents,
+];
+
+class HeroAnimationExample extends StatelessWidget {
+  const HeroAnimationExample({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      bottomNavigationBar: const ExampleBottomAppBar(),
+      body: GridView.builder(
+        itemCount: colors.length,
+        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+          crossAxisCount: 3,
+        ),
+        itemBuilder: (_, index) => Center(
+          child: HeroFlutterLogo(
+            color: colors[index],
+            tag: index,
+            size: 100,
+            onTap: () => showDetailsPage(context, index),
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+void showDetailsPage(BuildContext context, int page) =>
+    Navigator.of(context, rootNavigator: true).push(
+      // You can use `ModalExprollableRouteBuilder` like regular `PageRouteBuilder`.
+      // See [https://docs.flutter.dev/ui/animations/hero-animations#radial-hero-animations].
+      ModalExprollableRouteBuilder(
+        // This is the only required paramter.
+        pageBuilder: (context, _, __) {
+          return PageConfiguration(
+            initialPage: page,
+            viewportConfiguration: ViewportConfiguration(
+              extendPage: true,
+              overshootEffect: true,
+            ),
+            child: ExprollablePageView(
+              itemCount: colors.length,
+              itemBuilder: (context, page) {
+                return PageGutter(
+                  gutterWidth: 12,
+                  child: DetailsPage(page: page),
+                );
+              },
+            ),
+          );
+        },
+        // Increase the transition durations and take a closer look at what's going on!
+        transitionDuration: const Duration(milliseconds: 500),
+        reverseTransitionDuration: const Duration(milliseconds: 300),
+        // The next two lines are not required, but are recommended for better performance.
+        backgroundColor: Colors.white,
+        opaque: true,
+      ),
+    );
+
+class DetailsPage extends StatelessWidget {
+  const DetailsPage({
+    super.key,
+    required this.page,
+  });
+
+  final int page;
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      margin: EdgeInsets.zero,
+      shape: RoundedRectangleBorder(
+        borderRadius: BorderRadius.vertical(
+          top: Radius.circular(20),
+        ),
+      ),
+      child: SingleChildScrollView(
+        physics: AlwaysScrollableScrollPhysics(),
+        controller: PageContentScrollController.of(context),
+        child: Padding(
+          padding: EdgeInsets.all(16),
+          child: HeroFlutterLogo(
+            color: colors[page],
+            tag: page,
+            size: 400,
+            onTap: () => Navigator.of(context).pop(),
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+class HeroFlutterLogo extends StatelessWidget {
+  const HeroFlutterLogo({
+    super.key,
+    required this.color,
+    required this.tag,
+    required this.size,
+    required this.onTap,
+  });
+
+  final int tag;
+  final Color color;
+  final double size;
+  final VoidCallback onTap;
+
+  @override
+  Widget build(BuildContext context) {
+    return Hero(
+      tag: tag,
+      child: Material(
+        color: color,
+        child: InkWell(
+          onTap: onTap,
+          child: FlutterLogo(
+            size: size,
+          ),
+        ),
+      ),
+    );
+  }
+}

example/lib/src/modal_dialog_example.dart

@@ -57,10 +57,10 @@ class _MyDialog extends StatefulWidget {
     required BuildContext context,
     required bool enableOvershootEffect,
   }) =>
-      showModalExprollable(
-        context,
-        useSafeArea: false,
-        builder: (context) => _MyDialog(enableOvershootEffect),
+      Navigator.of(context).push(
+        ModalExprollableRouteBuilder(
+          pageBuilder: (context, _, __) => _MyDialog(enableOvershootEffect),
+        ),
       );
 }
 

package/CHANGELOG.md

@@ -1,45 +1,55 @@
 # Changelog
 
-## 1.0.0-rc.1 17-05-2023
+## 1.0.0-rc.2 Jun 17, 2023
+
+- `PageConfiguration` has been added for implicit definition of page controllers (issue #41)
+- The limitations of the overshoot effect have been removed
+- `ModalExprollableRouteBuilder` has been introduced to support hero animations (issue #36)
+  - Accordingly, `ModalExprollable` and `showModalExprollable` is now marked as deprecated
+- Fixed issue #39
+
+See the migration guide in the README for more information.
+
+## 1.0.0-rc.1 May 17, 2023
 
 This version contains some breaking changes (see the migraiton guide in README).
 
 - The behavior of the viewport is now more customizable (#24)
 - Terminology was reorganized and some classes and properties were renamed accordingly
 - Some improvements in the documents
 
-## 1.0.0-beta.8 05-05-2023
+## 1.0.0-beta.8 May 5, 2023
 
 - Fix #25, #26
 - Improve the documents
 
-## 1.0.0-beta.7 30-04-2023
+## 1.0.0-beta.7 Apr 30, 2023
 
 - Fix #20
 - Add a convenience constructor `ExprollablePageController.withAdditionalSnapOffsets` (proposed in #21)
 - Improve the documents
 
-## 1.0.0-beta.6 19-04-2023
+## 1.0.0-beta.6 Apr 19, 2023
 
 - Fix #17
 
-## 1.0.0-beta.5 18-04-2023
+## 1.0.0-beta.5 Apr 18, 2023
 
 - Add doc comments for public APIs
 
-## 1.0.0-beta.4 16-04-2023
+## 1.0.0-beta.4 Apr 16, 2023
 
 - Minor bug fixes
 
-## 1.0.0-beta.3 14-04-2023
+## 1.0.0-beta.3 Apr 14, 2023
 
 - Add utility callbacks (`onViewportChanged`, `onPageChanged`)
 - Add detailed documentation to README
 
-## 1.0.0-beta.2 13-04-2023
+## 1.0.0-beta.2 Apr 13, 2023
 
 - Fix issues (#1, #2, #3)
 
-## 1.0.0-beta 11-04-2023
+## 1.0.0-beta Apr 11, 2023
 
 The preview version. Not yet well documented.