优化 SlideTransition 案例代码

lib/views/widgets/StatefulWidget/SlideTransition/node1_base.dart

@@ -5,7 +5,7 @@ import 'package:flutter/material.dart';
 /// 说明:
 //    {
 //      "widgetId": 112,
-//      "name": 'SlideTransition基本使用',
+//      "name": 'SlideTransition 基本使用',
 //      "priority": 1,
 //      "subtitle":
 //          "【child】 : 孩子组件   【Widget】\n"
@@ -20,12 +20,20 @@ class CustomSlideTransition extends StatefulWidget {
 class _CustomSlideTransitionState extends State<CustomSlideTransition>
     with SingleTickerProviderStateMixin {
   AnimationController _ctrl;
+  Animation<Offset> animation;
 
   @override
   void initState() {
-    _ctrl = AnimationController(vsync: this, duration: Duration(seconds: 1));
-    _ctrl.forward();
     super.initState();
+    _ctrl = AnimationController(
+      vsync: this,
+      duration: const Duration(seconds: 2),
+    )..forward();
+
+    animation = Tween<Offset>(
+      begin: Offset.zero,
+      end: Offset(0.5, 0.5),
+    ).animate(_ctrl);
   }
 
   @override
@@ -39,18 +47,29 @@ class _CustomSlideTransitionState extends State<CustomSlideTransition>
     return GestureDetector(
         onTap: () => _ctrl.forward(from: 0),
         child: Container(
-          width: MediaQuery.of(context).size.width,
+          width: 200,
           color: Colors.grey.withAlpha(33),
           height: 100,
-          child: SlideTransition(
-            textDirection: TextDirection.ltr,
-            position: Tween<Offset>(
-              begin: Offset.zero,
-              end: Offset(0.2, 0.2),
-            ).animate(_ctrl),
-            child: Container(
-                child: Icon(Icons.android, color: Colors.green, size: 60)),
+          child: Stack(
+            fit: StackFit.expand,
+            children: [
+              SlideTransition(
+                textDirection: TextDirection.ltr,
+                position: animation,
+                child: _buildChild(),
+              ),
+              SlideTransition(
+                textDirection: TextDirection.rtl,
+                position: animation,
+                child: _buildChild(),
+              ),
+            ],
           ),
         ));
   }
+  Widget _buildChild() => const Icon(
+    Icons.accessible_forward_sharp,
+    color: Colors.green,
+    size: 25,
+  );
 }