Question

我有一个图像，具体地说，它是从Image.asset（..）加载的。

它包装在扩展小部件中，并具有自己的上下文。

我可以单击它，并获得我单击的本地位置（图像/上下文的本地x / y）。

从那时起，我要做的就是获取一些信息（特别是颜色和Alpha /不透明度，但是颜色是关键）。我真的只想要那个上下文的图像信息，并且能够明确地说“我需要字节＃”或“我需要来自X和Y的像素信息”。我觉得它已经存在于Flutter中，因为在许多（大多数？）其他具有丰富UI的平台中，它微不足道。

我错过了一些简单的东西吗？或者在这个平台上，这比我在精神上允许的难吗？

还是应该加载html库并在其中执行所需的操作？

谢谢！

（从历史的角度来看，我精通iOS开发，C＃和.Net，HTML和画布工作以及许多其他平台，这些年来我想不起来了，等等，但是对于Flutter来说还很陌生，因为我们正在对我们在Trigger中使用的应用进行紧急重写，这已经表现不佳了。谢谢：)

Answer 1

我不知道您是否还在寻找解决方案。

我刚刚为您制作了this prototype，希望已经很明确了。

Here's a video的结果。

顺便说一句，图片库有很多方法可以解决您需要的内容...万一需要，像素值可以作为List访问，因此您可以解决KML颜色并将列表视为网格（以行，列的数学运算来查找索引）。

警告：该库使用其他颜色格式（#AABBGGRR），但可以轻松转换。

更新：

我根据注释中提到的限制制作了v2，但更改了original snippet以显示两种方法。这个会生成您想要的任何小部件的快照（因此需要进行变换/着色/盒装配件/您在屏幕上呈现的所有内容）。

如果您不必经常对小部件进行动画处理或使之无效，则可以为您提供多种功能。

检查demo in youtube。

Answer 2

我想添加一个答案，此答案仅在 2020年9月之后提供。

如果您需要读取小部件树中的图像的图像像素，则可以使用https://pub.dev/packages/image_pixels包中的ImagePixels小部件（注意：我是该包的作者）。

注意，您不需要从Image.asset()手动预加载它。您只需要提供imageProvider。您需要根据GestureDetector给出的绝对位置来计算自己的相对位置：

// Some (x, y) position you got from the GestureDetector.
var x = 50;
var y = 25;

@override
Widget build(BuildContext context) {
    return ImagePixels(
              imageProvider: imageProvider,
              builder: (context, img) =>
                  double xRelative = ... // Calculate from x and img.width;
                  double yRelative = ... // Calculate from y and img.width;
                  Text(
                     "Pixel color is: ${img.pixelColorAt(xRelative, yRelative)}.");
              );
}

获取我点击的像素

2 个答案: