Flutter:AnimatedPadding动态修改padding

html 复制代码
// 默认top为10,点击后修改为100,此时方块会向下移动
padding: EdgeInsets.fromLTRB(left, top, right, bottom),
js 复制代码
class _MyHomePageState extends State<MyHomePage> {
  bool flag = true;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('标题'),
      ),
      body: AnimatedPadding(
        curve: Curves.easeIn, // 动画属性
        duration: Duration(milliseconds: 500),
        // 默认
        padding: EdgeInsets.fromLTRB(10, flag ?10 : 100, 0, 0),
        child: Container(
          width: 100,
          height: 100,
          color: Colors.red,
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: (){
          flag = !flag;
          setState(() {});
        },
        child: const Icon(Icons.add),
      ),
    );
  }
}


相关推荐
三少爷的鞋2 小时前
从 MVVM 到 MVI:为什么说 MVVM 的 UI 状态像“网”,而 MVI 像“一条线”?
android
牛马1112 小时前
Flutter CustomPainter
flutter
蜡台3 小时前
Flutter 安装配置
android·java·flutter·环境变量
加农炮手Jinx3 小时前
Flutter 组件 ubuntu_service 适配鸿蒙 HarmonyOS 实战:底层系统服务治理,构建鸿蒙 Linux 子系统与守护进程交互架构
flutter·harmonyos·鸿蒙·openharmony·ubuntu_service
里欧跑得慢3 小时前
Flutter 三方库 mobx_codegen — 自动化驱动的高性能响应式状态管理(适配鸿蒙 HarmonyOS Next ohos)
flutter·自动化·harmonyos
王码码20353 小时前
Flutter 三方库 login_client 的鸿蒙化适配指南 - 打造工业级安全登录、OAuth2 自动化鉴权、鸿蒙级身份守门员
flutter·harmonyos·鸿蒙·openharmony·login_client
加农炮手Jinx3 小时前
Flutter 三方库 cloudflare 鸿蒙云边协同分发流适配精讲:直连全球高速存储网关阵列无缝吞吐海量动静态画像资源,构筑大吞吐业务级网络负载安全分流-适配鸿蒙 HarmonyOS ohos
网络·flutter·harmonyos
阿乐艾官3 小时前
【HBase列式存储数据库】
android·数据库·hbase
yoyo_zzm4 小时前
MySQL的索引
android·数据库·mysql
Okailon5 小时前
PHP面向对象模块 jc-simple-footer 的技术详解
android·php·开源软件·家谱软件