Блог

Итак, у меня есть изображение в интерактивном средстве просмотра. Я хочу сбрасывать панорамирование и масштабирование каждый раз, когда пользователь заканчивает его изменять. Я успешно могу это сделать, используя TransformationController onInteractionEnd обратный вызов and . Однако, конечно, сброс происходит очень резко, поэтому я хотел бы анимировать его, чтобы обеспечить плавный переход. У меня нет опыта работы с анимацией флаттера, и это лучшее, что я мог придумать.

 class _PhotoZoom extends State<PhotoZoom> with TickerProviderStateMixin {
  
  TransformationController transformationController =
      new TransformationController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          Center(
            child: InteractiveViewer(
              transformationController: transformationController,
              child: Image.network(imageUrl),
              onInteractionEnd: (ScaleEndDetails details) {
                _resetPanZoom();
              },
            ),
          ),
        ],
      ),
    );
  }

  _resetPanZoom() {
    AnimationController animationController =
        AnimationController(duration: const Duration(seconds: 2), vsync: this);

    Animation<Matrix4> animation = Matrix4Tween(
            begin: transformationController.value, end: Matrix4.identity())
        .animate(animationController);

    transformationController.value = animation.value;
  }
}

 

То, что я пытаюсь сделать, это плавно изменить измененную Matrix4 переменную контроллера Matrix4.identity() , которая приведет к возврату изображения к исходному панорамированию и масштабированию. Но да, это не работает, поскольку я, вероятно, делаю что-то не так. Каков был бы правильный способ сделать это?