当前位置: 首页 > article >正文

Flutter:TweenAnimationBuilder自定义隐式动画

1、修改组件的大小触发:自定义动画

class _MyHomePageState extends State<MyHomePage>{
  bool flag = true;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('标题'),
      ),
      body: Column(
        children: [
          Container(
            child: TweenAnimationBuilder(
                // 当改变Tween的end参数时,Icon就会触发动画,size接收double类型begin和end要加.0
                tween: Tween(begin: 60.0,end: flag ? 100.0 : 200.0),
                duration: const Duration(milliseconds: 500),
                builder: ((context,value,child){
                  // 当更改flag时,会把end的值,赋值给value,Icon就会执行这个动画
                  // size接收double类型,但是value是Object类型,需要用 as double 转换一下
                  return Icon(Icons.star,size: value as double);
                })
            ),
          ),
          ElevatedButton(onPressed: (){
            setState(() {
              flag = !flag;
            });
          }, child: const Text('修改Icon大小')),
        ],
      ),
    );
  }
}

在这里插入图片描述

2、组件透明度变化触发:自定义动画

body: Column(
 children: [
   Container(
     child: TweenAnimationBuilder(
       // 当改变Tween的end参数时,就会触发动画
       tween: Tween(begin: 1.0,end: flag ? 1.0 : 0.0),
       duration: const Duration(milliseconds: 500),
       builder: ((context,value,child){
         return Opacity(
           opacity: value as double,
           child: Container(
             width: 200,
             height: 200,
             color: Colors.red,
           ),
         );
       }),
     ),
   ),
   ElevatedButton(onPressed: (){
     setState(() {
       flag = !flag;
     });
   }, child: const Text('修改Opacity')),
 ],
),

在这里插入图片描述


http://www.kler.cn/a/403361.html

相关文章:

  • 2024年亚太数学建模竞赛问题C宠物产业及相关产业发展分析与对策
  • 4.langchain中的prompt模板 (partially format prompt templates)
  • ZYNQ-7020嵌入式系统学习笔记(1)——使用ARM核配置UART发送Helloworld
  • 【国产MCU系列】-GD32F470-内部集成电路总线接口(I2C)
  • 硬件知识 cadence16.6 原理图输出为pdf 网络名下划线偏移 (ORCAD)
  • Linux驱动开发(9):pinctrl子系统和gpio子系统--led实验
  • Telegram bot Mini-App开发实践---Telegram简单介绍与初始化小程序获取window.Telegram.WebApp对象并解析
  • 解读缓存问题的技术旅程
  • 利用Python爬虫获取淘宝店铺详情
  • windows 操作系统下载 Android源码教程
  • k8s error uploading crisocket处理过程
  • 从机器人到高速线,线缆行业如何提升竞争力
  • 提取repo的仓库和工作树(无效)
  • [Unity]游戏开发基础2- 从草图到最小可用产品:视频游戏创作阶段详解
  • .gitignore文件
  • AWTK-WIDGET-WEB-VIEW 实现笔记 (4) - Ubuntu
  • 一学就废|Python基础碎片,列表(List)
  • 【Tealscale + Headscale + 自建服务器】异地组网笔记
  • ESP32-S3模组上跑通esp32-camera(21)
  • 2024/11/17周报
  • 网络属性及相关配置常用命令-下篇
  • 腾讯:将LLM排序能力迁移至BERT
  • cesium for unity的使用
  • Flink整合Hudi及使用
  • 视频修复技术和实时在线处理
  • 用Python爬虫“偷窥”1688搜索词推荐:一场数据的奇妙冒险