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),
      ),
    );
  }
}


相关推荐
律宏阔1 小时前
Flutter Riverpod 3:统一打印 Provider 错误与自动重试日志
前端·flutter
春猿火1 小时前
某市-2026【网安·论道】misc-afterimage_note-wp
android
m0_738185822 小时前
Flutter 鸿蒙化实战:flutter_exif_plugin 适配 OpenHarmony,图片 EXIF 读写
flutter·华为·harmonyos·鸿蒙
恋猫de小郭3 小时前
Shopify 回应为什么从 RN 回到原生,为什么不用 KMP ?
android·前端·flutter
fundroid4 小时前
Android AI 开发,真正拉开差距的是工程闭环
android·ai·大模型·agent
脚踏实地,坚持不懈!4 小时前
Android 面试题全解(结合 AOSP 源码 · 截至 Android 17 / API 37)
android
换元不配限5 小时前
Android 架构演进实战:MVC → MVP → MVVM → MVI
android·架构·mvc·mvvm·mvp·mvi
mmsx7 小时前
Android Dialog 插槽模式:用一套壳统一全应用的弹窗风格
android·java·dialog·开发语言
事圆则缓7 小时前
Flutter 状态管理框架对比(五):GetX 的响应式、依赖注册与生命周期
前端·javascript·flutter
码上有光7 小时前
Linux:进程间通信——匿名管道通信、命名管道通信
android·java·linux·linux通信·匿名通信·命名通信