flutter 动画示例
import 'package:flutter/material.dart'; import 'state/animationcs.dart'; void main() => runApp(new MainApp()); class MainApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( // title: 'Main App', theme: ThemeData( primarySwatch: Colors.blue, ), home: AnimationCs(), ); } }
import 'package:flutter/material.dart'; class AnimationCs extends StatefulWidget { @override _AnimationCsState createState() => new _AnimationCsState(); } class _AnimationCsState extends State<AnimationCs> with SingleTickerProviderStateMixin { AnimationController _controller; Animation<double> _bigerAnimation; Animation<double> _bigerToCurveAnimation; @override Widget build(BuildContext context) { return new Scaffold( body: new Container( child: new Center( // child: new Text(_controller.value.toString().substring(0, 3)), child: ListView(children: <Widget>[ new Text((_bigerAnimation.value*100).round().toString()), new Text((_bigerToCurveAnimation.value*100).round().toString()) ], ), ), ), ); } @override void initState() { super.initState(); _controller = new AnimationController( duration: const Duration(seconds: 10), vsync: this, ) ..addListener(() { setState(() {}); }) ..addStatusListener((AnimationStatus status) { if (status == AnimationStatus.completed) { print('AnimationStatus.completed'); _controller.reverse(); } else if (status == AnimationStatus.dismissed) { print('AnimationStatus.dismissed'); _controller.forward(); } else {} }); ///主要是拿到 不同方式产生的 value 用于产生不同的ui效果, 这个 Tween 可用于 0.0-1.0 之间的分段用 _bigerAnimation = new Tween(begin: 0.0, end: 1.0).animate(_controller); _bigerToCurveAnimation = new CurveTween(curve: Curves.elasticInOut).animate(_bigerAnimation); _controller.forward(); } @override void dispose() { _controller.dispose(); super.dispose(); } }
直接 AS 创建个 flutter 项目 放入这两个文件玩玩
参考 : https://www.didierboelens.com/2018/06/animations-in-flutter---easy-guide---tutorial/
参考自己 : https://www.cnblogs.com/LiuPan2016/p/8989823.html
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 地球OL攻略 —— 某应届生求职总结
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· 提示词工程——AI应用必不可少的技术
· .NET周刊【3月第1期 2025-03-02】