如何根据某些InteractiveViewer缩放和翻译rect小部件?

我绘制了一个位图,并将其包裹在交互式查看器中。 而且它可以很好地缩放和翻译。

现在我想对它进行正面或贴纸式的观察, 如何使用interactiveViewer缩放或翻译它?

谢谢!

/**/ 编辑: 我曾尝试将rect小部件添加到InteractiveViewer中。 但它会产生另一个问题,就像这个问题一样: https://github.com/flutter/flutter/issues/72978

所以我尝试了一个新的: 我用容器创建rect,并检测手势回调。 将rect放在InteractiveViewer之外。 当我拖动直角时。我可以调整矩形的大小。 但现在我缩放了interactive Viewer,rect不会一起缩放。

child: InteractiveViewer(
                        key: _targetKey,
                        boundaryMargin: EdgeInsets.symmetric(
                          horizontal: 512,
                          vertical: 512,
                        ),
                        minScale: 0.5,
                        maxScale: 10,
                        child: Stack(
                          children: [
CustomPaint(
                                          foregroundPainter:
                                              WaterRipplePainter(
                                                  _controllerRipple.value,
                                                  provider.item4,
                                                  originPoint),
                                          painter: ImagePainter(
                                            provider.item1,
                                            provider.item2,
                                            provider.item3,
                                          ),
                                        );
                          ],
                        ),
                      )
// The Rect is use Containers with other 9 corner balls
stack(
  children: <Widget>[
    Positioned(
      top: top,
      left: left,
      child: Container(
        height: height,
        width: width,
        color: Colors.red[100],
        child: widget.child,
      ),
    ),
    // top left
    Positioned(
      top: top - ballDiameter / 2,
      left: left - ballDiameter / 2,
      child: ManipulatingBall(
        onDrag: (dx, dy) {
          var mid = (dx + dy) / 2;
          var newHeight = height - 2 * mid;
          var newWidth = width - 2 * mid;

          setState(() {
            height = newHeight > 0 ? newHeight : 0;
            width = newWidth > 0 ? newWidth : 0;
            top = top + mid;
            left = left + mid;
          });
        },
      ),
    ),
    // top middle
    Positioned(
      top: top - ballDiameter / 2,
      left: left + width / 2 - ballDiameter / 2,
      child: ManipulatingBall(
        onDrag: (dx, dy) {
          var newHeight = height - dy;

          setState(() {
            height = newHeight > 0 ? newHeight : 0;
            top = top + dy;
          });
        },
      ),
    ),
    // top right
    Positioned(