AnimatedAlign

Flutter 1.26.0-1.0.pre ,Dart 2.12.0 (build 2.12.0-141.0.dev)
简述：Align的动画版本，在给定的时间内，当alignment发生变化时，自动转换子部件的位置。

Flutter高仿抖音

属性	释义
alignment → AlignmentGeometry	对齐方式
child → Widget?	子部件
curve → Curve	动画曲线，默认是Curves.linear
duration → Duration	动画执行时间
heightFactor → double?	与Align用法相同，在AnimatedAlign父部件高度不指定的情况下起效果，AnimatedAlign高度为AnimatedAlign子部件的高度乘以heightFactor
widthFactor → double?	与Align用法相同，在AnimatedAlign父部件高度不指定的情况下起效果，AnimatedAlign宽度为AnimatedAlign子部件的高度乘以widthFactor
onEnd → VoidCallback?	动画结束时的回调

示例1 基本使用

Center(
      child: Container(
        color: Colors.red,
        width: 200,
        height: 200,
        child: AnimatedAlign(
          alignment: _selected ? Alignment.topRight:Alignment.bottomLeft,
          duration: Duration(seconds: 1),
          child: FlutterLogo(size: 50,),
          onEnd: (){
            showToast('动画结束');
          },
        ),
      ),
    );
  
复制代码

示例2 动画曲线动画

Center(
      child: Container(
        color: Colors.red,
        width: 200,
        height: 200,
        child: AnimatedAlign(
          alignment: _selected ? Alignment.topRight:Alignment.bottomLeft,
          duration: Duration(seconds: 1),
          curve: Curves.bounceOut,
          child: FlutterLogo(size: 50,),
          onEnd: (){
            showToast('动画结束');
          },
        ),
      ),
    );
复制代码