[animations] Set FadeScaleTransitionConfiguration to configuration default value (#136)

* Set showModal configuration default FadeScaleTransitionConfiguration

Co-Authored-By: Shi-Hao Hong <[email protected]>

Author: mono0926

packages/animations/example/lib/fade_scale_transition.dart

@@ -85,7 +85,6 @@ class _FadeScaleTransitionDemoState extends State<FadeScaleTransitionDemo>
                   onPressed: () {
                     showModal<void>(
                       context: context,
-                      configuration: const FadeScaleTransitionConfiguration(),
                       builder: (BuildContext context) {
                         return _ExampleAlertDialog();
                       },

packages/animations/lib/src/modal.dart

@@ -4,6 +4,8 @@
 
 import 'package:flutter/material.dart';
 
+import 'fade_scale_transition.dart';
+
 /// Signature for a function that creates a widget that builds a
 /// transition.
 ///
@@ -26,7 +28,8 @@ typedef _ModalTransitionBuilder = Widget Function(
 /// The `configuration` argument is used to determine characteristics of the
 /// modal route that will be displayed, such as the enter and exit
 /// transitions, the duration of the transitions, and modal barrier
-/// properties.
+/// properties. By default, `configuration` is
+/// [FadeScaleTransitionConfiguration].
 ///
 /// The `useRootNavigator` argument is used to determine whether to push the
 /// modal to the [Navigator] furthest from or nearest to the given `context`.
@@ -45,7 +48,7 @@ typedef _ModalTransitionBuilder = Widget Function(
 /// the modal's characteristics.
 Future<T> showModal<T>({
   @required BuildContext context,
-  @required ModalConfiguration configuration,
+  ModalConfiguration configuration = const FadeScaleTransitionConfiguration(),
   bool useRootNavigator = true,
   WidgetBuilder builder,
 }) {

packages/animations/test/modal_test.dart

@@ -153,6 +153,185 @@ void main() {
     },
   );
 
+  testWidgets(
+    'showModal builds a new route with specified barrier properties '
+    'with default configuration(FadeScaleTransitionConfiguration)',
+    (WidgetTester tester) async {
+      await tester.pumpWidget(
+        MaterialApp(
+          home: Scaffold(
+            body: Builder(builder: (BuildContext context) {
+              return Center(
+                child: RaisedButton(
+                  onPressed: () {
+                    showModal<void>(
+                      context: context,
+                      builder: (BuildContext context) {
+                        return const _FlutterLogoModal();
+                      },
+                    );
+                  },
+                  child: const Icon(Icons.add),
+                ),
+              );
+            }),
+          ),
+        ),
+      );
+      await tester.tap(find.byType(RaisedButton));
+      await tester.pumpAndSettle();
+
+      // New route containing _FlutterLogoModal is present.
+      expect(find.byType(_FlutterLogoModal), findsOneWidget);
+      final ModalBarrier topModalBarrier = tester.widget<ModalBarrier>(
+        find.byType(ModalBarrier).at(1),
+      );
+
+      // Verify new route's modal barrier properties are correct.
+      expect(topModalBarrier.color, Colors.black54);
+      expect(topModalBarrier.barrierSemanticsDismissible, true);
+      expect(topModalBarrier.semanticsLabel, 'Dismiss');
+    },
+  );
+
+  testWidgets(
+    'showModal forwards animation '
+    'with default configuration(FadeScaleTransitionConfiguration)',
+    (WidgetTester tester) async {
+      final GlobalKey key = GlobalKey();
+      await tester.pumpWidget(
+        MaterialApp(
+          home: Scaffold(
+            body: Builder(builder: (BuildContext context) {
+              return Center(
+                child: RaisedButton(
+                  onPressed: () {
+                    showModal<void>(
+                      context: context,
+                      builder: (BuildContext context) {
+                        return _FlutterLogoModal(key: key);
+                      },
+                    );
+                  },
+                  child: const Icon(Icons.add),
+                ),
+              );
+            }),
+          ),
+        ),
+      );
+
+      // Start forwards animation
+      await tester.tap(find.byType(RaisedButton));
+      await tester.pump();
+
+      // Opacity duration: First 30% of 150ms, linear transition
+      double topFadeTransitionOpacity = _getOpacity(key, tester);
+      double topScale = _getScale(key, tester);
+      expect(topFadeTransitionOpacity, 0.0);
+      expect(topScale, 0.80);
+
+      // 3/10 * 150ms = 45ms (total opacity animation duration)
+      // 1/2 * 45ms = ~23ms elapsed for halfway point of opacity
+      // animation
+      await tester.pump(const Duration(milliseconds: 23));
+      topFadeTransitionOpacity = _getOpacity(key, tester);
+      expect(topFadeTransitionOpacity, closeTo(0.5, 0.05));
+      topScale = _getScale(key, tester);
+      expect(topScale, greaterThan(0.80));
+      expect(topScale, lessThan(1.0));
+
+      // End of opacity animation.
+      await tester.pump(const Duration(milliseconds: 22));
+      topFadeTransitionOpacity = _getOpacity(key, tester);
+      expect(topFadeTransitionOpacity, 1.0);
+      topScale = _getScale(key, tester);
+      expect(topScale, greaterThan(0.80));
+      expect(topScale, lessThan(1.0));
+
+      // 100ms into the animation
+      await tester.pump(const Duration(milliseconds: 55));
+      topScale = _getScale(key, tester);
+      expect(topScale, greaterThan(0.80));
+      expect(topScale, lessThan(1.0));
+
+      // Get to the end of the animation
+      await tester.pump(const Duration(milliseconds: 50));
+      topScale = _getScale(key, tester);
+      expect(topScale, 1.0);
+
+      await tester.pump(const Duration(milliseconds: 1));
+      expect(find.byType(_FlutterLogoModal), findsOneWidget);
+    },
+  );
+
+  testWidgets(
+    'showModal reverse animation '
+    'with default configuration(FadeScaleTransitionConfiguration)',
+    (WidgetTester tester) async {
+      final GlobalKey key = GlobalKey();
+      await tester.pumpWidget(
+        MaterialApp(
+          home: Scaffold(
+            body: Builder(builder: (BuildContext context) {
+              return Center(
+                child: RaisedButton(
+                  onPressed: () {
+                    showModal<void>(
+                      context: context,
+                      builder: (BuildContext context) {
+                        return _FlutterLogoModal(key: key);
+                      },
+                    );
+                  },
+                  child: const Icon(Icons.add),
+                ),
+              );
+            }),
+          ),
+        ),
+      );
+
+      // Start forwards animation
+      await tester.tap(find.byType(RaisedButton));
+      await tester.pumpAndSettle();
+      expect(find.byType(_FlutterLogoModal), findsOneWidget);
+
+      // Tap on modal barrier to start reverse animation.
+      await tester.tapAt(Offset.zero);
+      await tester.pump();
+
+      // Opacity duration: Linear transition throughout 75ms
+      // No scale animations on exit transition.
+      double topFadeTransitionOpacity = _getOpacity(key, tester);
+      double topScale = _getScale(key, tester);
+      expect(topFadeTransitionOpacity, 1.0);
+      expect(topScale, 1.0);
+
+      await tester.pump(const Duration(milliseconds: 25));
+      topFadeTransitionOpacity = _getOpacity(key, tester);
+      topScale = _getScale(key, tester);
+      expect(topFadeTransitionOpacity, closeTo(0.66, 0.05));
+      expect(topScale, 1.0);
+
+      await tester.pump(const Duration(milliseconds: 25));
+      topFadeTransitionOpacity = _getOpacity(key, tester);
+      topScale = _getScale(key, tester);
+      expect(topFadeTransitionOpacity, closeTo(0.33, 0.05));
+      expect(topScale, 1.0);
+
+      // End of opacity animation
+      await tester.pump(const Duration(milliseconds: 25));
+      topFadeTransitionOpacity = _getOpacity(key, tester);
+      expect(topFadeTransitionOpacity, 0.0);
+      topScale = _getScale(key, tester);
+      expect(topScale, 1.0);
+
+      await tester.pump(const Duration(milliseconds: 1));
+      expect(find.byType(_FlutterLogoModal), findsNothing);
+    },
+  );
+
   testWidgets(
     'State is not lost when transitioning',
     (WidgetTester tester) async {
@@ -290,6 +469,17 @@ double _getOpacity(GlobalKey key, WidgetTester tester) {
   });
 }
 
+double _getScale(GlobalKey key, WidgetTester tester) {
+  final Finder finder = find.ancestor(
+    of: find.byKey(key),
+    matching: find.byType(ScaleTransition),
+  );
+  return tester.widgetList(finder).fold<double>(1.0, (double a, Widget widget) {
+    final ScaleTransition transition = widget;
+    return a * transition.scale.value;
+  });
+}
+
 class _FlutterLogoModal extends StatefulWidget {
   const _FlutterLogoModal({
     Key key,