在颤抖中裁剪图像

发布于 2025-01-26 08:47:15 字数 1642 浏览 3 评论 0原文

因此，我一直在努力根据自己的扑朔迷离的需求裁剪图像。

问题声明：我有一个屏幕，在那个屏幕中，我在设备摄像头在后台运行时显示框架。现在，我想要的是，每当用户单击照片时，只应保留框架内部图像的区域，应裁剪静止。

到目前为止，我做了什么？

添加了一个软件包图像3.1.3
编写代码以获取我的框架的Y坐标。
使用来自图像软件包的计算出的X，Y坐标和CopyCrop方法来裁剪单击图像。

现在的问题是，我不知道CopyCrop是如何工作的，而现在的代码并没有给我带来预期的结果。

final GlobalKey _key = GlobalKey();
void _getOffset(GlobalKey key) {
    RenderBox? box = key.currentContext?.findRenderObject() as RenderBox?;
    Offset? position = box?.localToGlobal(Offset.zero);
    if (position != null) {
      setState(() {
        _x = position.dx;
        _y = position.dy;
      });
    }
  }

我将此_key分配给我的image.file（srctoframeimage），上面的函数得出10，289.125

这是x的偏移，而289.125是y的偏移。我使用了此教程也是如此。

使用图像软件包裁剪我的图像的代码：

var bytes = await File(pictureFile!.path).readAsBytes();
img.Image src = img.decodeImage(bytes)!;
img.Image destImage = img.copyCrop(
   src, _x!.toInt(), _y!.toInt(), src.width, src.height);
var jpg = img.encodeJpg(destImage);
await File(pictureFile!.path).writeAsBytes(jpg);
bloc.addFrontImage(File(pictureFile!.path));

现在，有人可以告诉我如何有效地做到这一点？现在，它确实裁剪了我的形象，但不是我想要的。如果有人能告诉我CopyCrop如何工作以及我们传递到的所有这些不同参数的含义是什么，那将是非常好的。

任何帮助将不胜感激。

编辑：

现在，如您所见，我只希望在被捕获和休息后保留此框架之间的图像。

原文

So I've been trying really hard to crop an image according to my needs in flutter.

Problem statement:
I have a screen and in that screen I show a frame while the device camera is run on the background. Now, what I want is that whenever the user clicks a photo, only the area of that image inside the frame should be kept and rest should be cropped.

What I have done so far?

Added a package image 3.1.3
Wrote code to fetch x,y coordinates of my frame.
Using the calculated x,y coordinates and copyCrop method from the Image package to crop the clicked image.

Now the problem is that I do not know how copyCrop works and the code right now does not give me the expected results.

final GlobalKey _key = GlobalKey();
void _getOffset(GlobalKey key) {
    RenderBox? box = key.currentContext?.findRenderObject() as RenderBox?;
    Offset? position = box?.localToGlobal(Offset.zero);
    if (position != null) {
      setState(() {
        _x = position.dx;
        _y = position.dy;
      });
    }
  }

I assign this _key to my Image.file(srcToFrameImage) and the function above yields 10, 289.125

Here 10 is the offset from x and 289.125 is the offset from y. I used this tutorial for the same.

Code to crop my image using the Image package:

var bytes = await File(pictureFile!.path).readAsBytes();
img.Image src = img.decodeImage(bytes)!;
img.Image destImage = img.copyCrop(
   src, _x!.toInt(), _y!.toInt(), src.width, src.height);
var jpg = img.encodeJpg(destImage);
await File(pictureFile!.path).writeAsBytes(jpg);
bloc.addFrontImage(File(pictureFile!.path));

Now, can anyone tell me how i can do this effectively? Right now, it does crop my image but not as I want it to be. It would be really great if someone could tell me how does copyCrop work and what is the meaning of all these different parameters that we pass into it.

Any help would be appreciated.

Edit: