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


相关推荐
赵财猫._.9 分钟前
【Flutter x 鸿蒙】第二篇:理解Flutter on HarmonyOS的架构设计
flutter·华为·harmonyos
解局易否结局26 分钟前
Flutter 从入门到工程化:构建高可用跨平台应用的完整路径
flutter
晚霞的不甘40 分钟前
实战进阶:构建高性能、高可用的 Flutter + OpenHarmony 车载 HMI 系统
开发语言·javascript·flutter
解局易否结局44 分钟前
Flutter 性能优化实战:从卡顿排查到极致体验
flutter·性能优化
renxhui1 小时前
Flutter: Dio + Retrofit 入门(面向 Android 开发者)
flutter
伐尘1 小时前
【MySQL】MySQL 有效利用 profile 分析 SQL 语句的执行过程
android·sql·mysql
Haha_bj1 小时前
七、Kotlin——扩展(Extensions)
android·kotlin
urkay-1 小时前
Android getDrawingCache 过时废弃
android·java·开发语言·kotlin·iphone·androidx
技术摆渡人2 小时前
Android 14系统深度分析
android·linux·驱动开发
晚霞的不甘2 小时前
社区、标准与未来:共建 Flutter 与 OpenHarmony 融合生态的可持续发展路径
安全·flutter·ui·架构