Перемещение виджета во флаттере - PullRequest
0 голосов
/ 06 мая 2020

Я пытаюсь создать экран, на котором изображение перемещается в указанное c местоположение, щелкнув кнопку. Я нашел анимацию AnimatedAligned, однако этот класс, похоже, не позволяет вернуть виджет в исходное место. Любой гуру знает, какую анимацию можно использовать в этом случае?

1 Ответ

1 голос
/ 06 мая 2020

Проверьте это ...

class SlideTransitionHome extends StatefulWidget {
  @override
  _SlideTransitionHomeState createState() => _SlideTransitionHomeState();
}

class _SlideTransitionHomeState extends State<SlideTransitionHome>
    with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Tween<Offset> controllerTween = Tween<Offset>(begin: Offset.zero, end: Offset(1,1));

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(vsync: this, duration: Duration(seconds: 1));
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Center(
          child: SlideTransition(
            position: _controller.drive(controllerTween),
            child: Container(
              decoration: BoxDecoration(
                color: Colors.pink,
                borderRadius: BorderRadius.circular(10),
              ),
              width: 100,
              height: 100,
            ),
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: (){
          _controller.isDismissed ? _controller.forward() : _controller.reverse();
        },
      ),
    );
  }
}

Результат:

enter image description here

ОБНОВЛЕНИЕ: Если вы хотите, чтобы анимация отображалась в центре верха, используйте это как анимацию движения.

  Tween<Offset> controllerTween = Tween<Offset>(begin: Offset.zero, end: Offset(0,-2.55));

Результат:

enter image description here

...