Flutter AnimatedPadding


简介

属于Flutter动画成员的一部分

基本用法

动画版本的Padding

  • 在给定的时间内,自动完成转换缩进到给定的padding值
  • 通过设置curve 来指定动画的运行速率动画

实例演示

import 'package:flutter/material.dart';

class AnimatedPaddingDemo extends StatefulWidget {
  _AnimatedPaddingDemoState createState() => _AnimatedPaddingDemoState();
}

class _AnimatedPaddingDemoState extends State<AnimatedPaddingDemo> {
  double paddingValue;

  void initState() {
    super.initState();
    paddingValue = 10.0;
  }

  _changePadding() {
    if (paddingValue == 10.0) {
      setState(() {
        paddingValue = 100.0;
      });
    } else {
      setState(() {
        paddingValue = 10.0;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        AnimatedPadding(
          padding: EdgeInsets.symmetric(
              horizontal: paddingValue, vertical: paddingValue),
          duration: const Duration(milliseconds: 100),
          curve: Curves.easeInOut,
          child: Container(
            height: 200.0,
            color: Colors.blueAccent,
          ),
        ),
        RaisedButton(
          onPressed: _changePadding,
          child: Text('change padding'),
        )
      ],
    );
  }
}