Flutter MatrixGestureDetector - 最小和最大比例

Question

我的问题基本上重复了之前提出的问题：

我有一个 MatrixGestureDetector：

  MatrixGestureDetector(
    onMatrixUpdate: (m, tm, sm, rm) {
      setState(() {
        transform = m;
      });
    },
    child: Transform(
      transform: transform,
      child: Image.asset("assets/maps/map.gif"),
    ),
  ),

图片可以无限放大缩小，但是我想限制最小和最大比例

上面 link 中建议的解决方案对我来说不正确。规模确实是有限的，但是当它达到极限时，手势就开始被错误地处理了。当您在达到限制时尝试放大或缩小时，图片开始快速移动。

这个问题有什么解决办法吗？也许还有其他软件包可以解决我的问题？由于此处描述的原因，PhotoViev 没有让我满意：

Answer 1

Flutter 发布了一个新版本 (1.20)，它附带了一个名为 InteractiveViewer 的新小部件。

您可以使用 InteractiveViewer 通过设置 minScale 和 maxScale 来实现您想要的效果。

This release introduces a new widget, the InteractiveViewer. The InteractiveViewer is designed for building common kinds of interactivity into your app, like pan, zoom, and drag ’n’ drop

在此处阅读有关该版本的更多信息：Flutter 1.20 Release notes

我添加了一个演示：

注意：只有升级到最新的 Flutter version (1.20)

才能使用此小部件

class ZoomImage extends StatelessWidget {

  final transformationController = TransformationController();
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: InteractiveViewer(
        transformationController: transformationController,
        onInteractionEnd: (details) {
          setState(() {
            // unzoom when interaction has ended
            transformationController.toScene(Offset.zero);
          });
        },
        // set the boundary margin for the image 
        boundaryMargin: EdgeInsets.all(20.0),
        // set min scale here
        minScale: 0.1,
        // set maximum scall here
        maxScale: 1.6,
        child: ClipRRect(
          borderRadius: BorderRadius.circular(18.0),
          child: Image.asset('assets/maps/map.gif'),
        ),
      ),
    );
  }
}

Flutter MatrixGestureDetector - 最小和最大比例

Flutter MatrixGestureDetector - Minimum and maximum scale

scale

zooming

dart

flutter