add animations basics 1-6 (#120)

* add basics * web: update dependencies * TransferableTypeData added (#116) * Updating index with new samples (#121) * use arrow functions * remove newline * use verbs: random*() -> generate*() * remove <Widget>[] type annotation on lists * use raised button * _route() => _createRoute() * add parameter names to pageBuilder * use the text theme's display1 for large text * dispose animation controllers before calling super() * remove local var * use raised buttons instead of material buttons * web: updated dependencies * Added new test scripts (#122) * add carousel, card_swipe, and focus_image samples (#119) * add carousel, card_swipe, and focus_image samples * fix image assets * fix more asset images * add repeating animation * fix import * add copyright headers * remove Center widget * imageAssetName * use ClipRect, refactor _SwipeableCardState * use offset.zero * add comments * remove reference to coverflow package * change spread to toList() * refactor coverflow sample don't set width and height use const data -> images * return widget directly, fix formatting * inline transitionsBuilder * image -> imageAssetName * _rectTween() => _createTween() * _expandToPageRoute -> _createRoute * move non-updating widgets out of AnimatedBuilder * code review updates to animations demos
2025-11-09 22:38:42 +00:00 · 2019-07-29 09:23:04 -07:00
parent 4966440a29
commit 734b961c57
8 changed files with 350 additions and 3 deletions
--- a/animations/lib/src/basics/05_custom_tween.dart
+++ b/animations/lib/src/basics/05_custom_tween.dart
@@ -0,0 +1,98 @@
+import 'package:flutter/material.dart';
+
+class TypewriterTween extends Tween<String> {
+  TypewriterTween({String begin = '', String end})
+      : super(begin: begin, end: end);
+
+  String lerp(double t) {
+    var cutoff = (end.length * t).round();
+    return end.substring(0, cutoff);
+  }
+}
+
+class CustomTweenDemo extends StatefulWidget {
+  static const String routeName = '/basics/custom_tweens';
+
+  _CustomTweenDemoState createState() => _CustomTweenDemoState();
+}
+
+class _CustomTweenDemoState extends State<CustomTweenDemo>
+    with SingleTickerProviderStateMixin {
+  static const Duration _duration = Duration(seconds: 3);
+  static const String message = loremIpsum;
+  AnimationController controller;
+  Animation<String> animation;
+
+  void initState() {
+    super.initState();
+
+    controller = AnimationController(vsync: this, duration: _duration)
+      ..addListener(() {
+        // Marks the widget tree as dirty
+        setState(() {});
+      });
+    animation = TypewriterTween(end: message).animate(controller);
+  }
+
+  void dispose() {
+    controller.dispose();
+    super.dispose();
+  }
+
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        actions: [
+          RaisedButton(
+            child: Text(
+              controller.status == AnimationStatus.completed
+                  ? 'Delete Essay'
+                  : 'Write Essay',
+            ),
+            onPressed: () {
+              if (controller.status == AnimationStatus.completed) {
+                controller.reverse();
+              } else {
+                controller.forward();
+              }
+            },
+          ),
+        ],
+      ),
+      body: SafeArea(
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.end,
+          crossAxisAlignment: CrossAxisAlignment.stretch,
+          children: [
+            Padding(
+              padding: EdgeInsets.all(8.0),
+              child: Card(
+                child: Container(
+                  padding: EdgeInsets.all(8.0),
+                  child: Text('${animation.value}',
+                      style:
+                          TextStyle(fontSize: 16, fontFamily: 'SpecialElite')),
+                ),
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+const String loremIpsum = '''
+Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium
+doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore
+veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim
+ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia
+consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque
+porro quisquam est, qui dolorem ipsum, quia dolor sit amet consectetur
+adipisci[ng] velit, sed quia non-numquam [do] eius modi tempora inci[di]dunt, ut
+labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam,
+quis nostrum[d] exercitationem ullam corporis suscipit laboriosam, nisi ut
+aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit, qui in
+ea voluptate velit esse, quam nihil molestiae consequatur, vel illum, qui
+dolorem eum fugiat, quo voluptas nulla pariatur?
+''';