Dart实战：用 AnimationController 和 Tween 创建动画 Widget

要在Dart中创建一个动画Widget，你可以使用`AnimationController`和`Tween`。以下是一个简单的示例，展示了如何创建一个在0到1之间变化的动画： ```dart import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar(title: Text('动画示例')), body: Center(child: AnimatedBox()), ), ); } } class AnimatedBox extends StatefulWidget { @override _AnimatedBoxState createState() => _AnimatedBoxState(); } class _AnimatedBoxState extends State<AnimatedBox> with SingleTickerProviderStateMixin { AnimationController _controller; Animation<double> _animation; @override void initState() { super.initState(); _controller = AnimationController( duration: const Duration(seconds: 2), vsync: this, )..repeat(reverse: true); _animation = Tween<double>(begin: 0, end: 1).animate(_controller); } @override void dispose() { _controller.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return FadeTransition( opacity: _animation, child: Container( width: 100, height: 100, color: Colors.blue, ), ); } } ``` 在这个示例中，我们创建了一个名为`AnimatedBox`的自定义`StatefulWidget`。在`_AnimatedBoxState`类中，我们初始化了一个`AnimationController`和一个`Tween`。`AnimationController`用于控制动画的播放，而`Tween`定义了动画的起始值和结束值。 我们在`build`方法中使用`FadeTransition`来应用动画。`FadeTransition`会根据`_animation`的值改变其子部件的透明度。当动画值从0变为1时，部件会从不透明变为完全透明；当动画值从1变为0时，部件会从完全透明变为不透明。通过调用`_controller.repeat(reverse: true)`，我们使动画无限循环地播放。 ######[AI写代码神器 | 592点数解答 | 2024-07-12 09:30:25]