0

我有 2 个屏幕。

在第一个屏幕中,我从网上加载了一张图片,并让我的用户在图片上绘制了一个矩形。我在. onPanStart_ 我正在保存开始和结束偏移值。onPanUpdateGestureDetector

final taggableImage = GestureDetector(
  onPanStart: (DragStartDetails details){
    provider.updateRectangleStart(details.localPosition);
  },
  onPanUpdate: (DragUpdateDetails details ){
    provider.updateRectangleEnd(details.localPosition);
  },
  child: CustomPaint(
    foregroundPainter: provider.drawRect,
    child: image,
  ),
);

在第一个屏幕上绘制矩形的屏幕截图: 在此处输入图像描述

现在我想在一个新屏幕中再次加载图像,并将矩形从我之前保存的偏移值重新绘制到图像上。但矩形总是出现在错误的位置,有时甚至出现在图像之外。

这是我从保存的偏移值中重绘矩形的方法。

final image = CustomPaint(
  foregroundPainter:  DrawRectangleService(provider.selectedDetection?.detectionRect ?? Rect.zero),
  child: FittedBox(
    fit: BoxFit.fill,
    child: CachedNetworkImage(
      placeholder: (context, url) => loadingWidget("Loading image"),
      imageUrl: imageURL,
    ),
  ),
);

重绘矩形时的屏幕截图 在此处输入图像描述 问题:如何使用我在第一个屏幕上保存的偏移值在第二个屏幕的图像上重绘矩形。

4

1 回答 1

0

将坐标转换为双倍,在 0 到 1 的范围内,将宽度和高度除以 Image 小部件的原始宽度和高度,在新屏幕上将它们与 Image 小部件的新宽度和高度相乘。

于 2020-11-28T07:05:38.797 回答