Flutter开发——动画核心类Tween

最新推荐文章于 2024-05-22 23:31:29 发布

原创

最新推荐文章于 2024-05-22 23:31:29 发布 · 465 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#flutter #android

文章介绍了Flutter中Tween类在创建动画时的作用，它允许自定义动画的取值范围，例如用于颜色、大小等变化。通过Tween和AnimationController可以实现动画的控制，如放大-缩小的循环动画。此外，使用CurvedAnimation和不同的Curves可以创建非线性动画效果，如弹跳动画。

Tween是继承Animatable的，一般情况动画的取值范围都是(0.0,1.0)，但是有些动画比如平移值、透明度、颜色值、大小值等，用（0.0,1.0）这个取值范围就不适用了。这时候就可以用Tween来指定范围。代码示例：

final Tween tween = Tween(begin:0.0,end:100.0);

Tween类是有一个泛型的，所以并不一定要是double类型。如果需要定义一个颜色变化的动画，可以通过ColorTween来实现，代码如下：

final Tween colorTween = ColorTween(begin:Colors.red,end:Colors.bule);

在动画的执行过程中，往往还需要获取动画的状态。但是Tween不会存储任何状态，需要调用evaluate()方法来获取动画的值。Tween还提供了animate()用于传入一个控制器对象。下面是使用Tween实现的一个放大–>缩小无线循环的动画：

import 'package:flutter/material.dart';

class TweenPage extends StatefulWidget {
   
   
  final String title;
  const TweenPage({
   
   Key? key, required this.title}) : super(key: key);

  @override
  State<TweenPage> createState() => _TweenPageState();
}

class _TweenPageState extends State<TweenPage>
    with SingleTickerProviderStateMixin {
   
   
  Animation<double>? _animation;
  AnimationController? _animationController;

  @override
  void initState() {