如何用动画翻译

Question

我正在使用Animator软件包移动容器。我要实现的是将容器从Alignment.bottomCenter移动到Alignment.topCenter，但是我只能使用偏移量。有没有使用对齐方式的方法？

                   Animator(
                          triggerOnInit: _logoMovesUp,
                          tween: Tween<Offset>(
                         //HERE I WANT TO USE THE ALIGNMENT
                              begin: Offset(0.0, 0.0), end: Offset(0.0, -100.0)),
                          duration: Duration(seconds: 1),
                          builder: (anim) => Transform.translate(
                                offset: anim.value,
                                child: Container(
                                    alignment: Alignment.bottomCenter,
                                    child: Container(Text('Test')),
                              ))

Answer 1

是的，您可以使用AnimatedAlign。像这样：

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  Alignment _alignment = Alignment.bottomCenter;

  animate() {
    setState(() {
      if (_alignment == Alignment.bottomCenter) {
        _alignment = Alignment.topCenter;
      } else {
        _alignment = Alignment.bottomCenter;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Animation'),
      ),
      floatingActionButton: FloatingActionButton.extended(
        onPressed: animate,
        label: Text('Animate'),
      ),
      body: Stack(
        children: <Widget>[
          AnimatedAlign(
            alignment: _alignment,
            duration: Duration(milliseconds: 350),
            curve: Curves.easeIn,
            child: Container(
              color: Colors.orange,
              child: Text('Test'),
            ),
          ),
        ],
      ),
    );
  }
}