Merge pull request FlutterOpen#38 from FlutterOpen/dev

add the AnimatedModalBarrier.

Author: nb312

lib/const/page_item_const.dart

@@ -227,4 +227,9 @@ const PAGE_ITEMS = [
     "img": PageImage.FLUTTER_OPEN,
     "click": PageName.ANIM_LIST,
   },
+  {
+    "title": PageName.ANIM_MODAL_BARRIER,
+    "img": PageImage.FLUTTER_OPEN,
+    "click": PageName.ANIM_MODAL_BARRIER,
+  },
 ];

lib/const/page_name_const.dart

@@ -50,4 +50,5 @@ class PageName {
   static const ANIM_ROTATION = "RotationTransition";
   static const ANIM_DEFAULT_TEXT = "DefaultText";
   static const ANIM_LIST = "AnimationList";
+  static const ANIM_MODAL_BARRIER = "AnimatedModalBarrier";
 }

lib/main.dart

@@ -64,6 +64,7 @@ class FlutterOpenApp extends StatelessWidget {
         PageName.ANIM_ROTATION: (context) => RotationPage(),
         PageName.ANIM_DEFAULT_TEXT: (context) => DefaultTextPage(),
         PageName.ANIM_LIST: (context) => AnimListPage(),
+        PageName.ANIM_MODAL_BARRIER: (context) => AnimatedModalPage(),
       },
     );
   }

lib/page/anim/AnimatedModalPage.dart

@@ -0,0 +1,66 @@
+///
+/// Created by NieBin on 2019/6/10
+/// Github: https://github.com/nb312
+/// Email: [email protected]
+///
+import "package:flutter/material.dart";
+import 'package:flutter_widgets/const/_const.dart';
+
+class AnimatedModalPage extends StatefulWidget {
+  @override
+  _AnimatedModalState createState() => _AnimatedModalState();
+}
+
+class _AnimatedModalState extends State<AnimatedModalPage>
+    with SingleTickerProviderStateMixin {
+  Animation<Color> _animation;
+  AnimationController _controller;
+  bool _isClick = false;
+
+  Widget _modalBarrier() => Container(
+        constraints: BoxConstraints.expand(height: 100, width: 100),
+        child: Stack(
+          children: <Widget>[
+            AnimatedModalBarrier(
+              color: _animation,
+            ),
+            Text("Click Me finsih this page!")
+          ],
+        ),
+      );
+
+  @override
+  void initState() {
+    _controller = AnimationController(
+      vsync: this,
+      duration: Duration(seconds: 2),
+    );
+    CurvedAnimation curve =
+        CurvedAnimation(parent: _controller, curve: Curves.easeIn);
+    _animation = Tween(begin: BLUE_DEEP, end: RED_LIGHT).animate(curve);
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+        appBar: AppBar(
+          title: Text(""),
+        ),
+        body: Column(
+          children: <Widget>[
+            _modalBarrier(),
+            FloatingActionButton(
+              child: Text("Click"),
+              onPressed: () {
+                setState(() {
+                  _isClick = !_isClick;
+                });
+                _controller.reset();
+                _controller.forward();
+              },
+            )
+          ],
+        ));
+  }
+}

lib/page/anim/_anim.dart

@@ -11,3 +11,4 @@ export 'PositionTransitionPage.dart';
 export 'RotationPage.dart';
 export 'DefaultTextPage.dart';
 export 'AnimListPage.dart';
+export 'AnimatedModalPage.dart';