如何获取我单击的图像像素的颜色? [英] How to get the color of the image pixel on which I clicked?

问题描述

我有一个图像，具体来说，它是从 Image.asset() 加载的.

I have an image, specifically, it's loaded in from Image.asset().

它被包裹在一个扩展的小部件中，并且有自己的上下文.

It's wrapped in an extended widget, and has its own context.

我可以点击它，并获得我点击的本地位置(图像/上下文的 x/y 本地).

I can click on it, and get the local position on which I clicked (x/y local to the image/context).

从那时起我想做的就是获取一些信息(特别是颜色和 alpha/不透明度，但颜色是关键).我真的只想要那个上下文的图像信息，以及明确地说我需要字节#"的能力.或我需要来自 X 和 Y 的像素信息".我觉得这必须存在于 Flutter 中，因为它在许多(大多数?)其他具有丰富 UI 的平台中非常简单.

All I want to do from that point is get some information (specifically, color and alpha/opacity, but color is key). I really just want THAT context's image information, and the ability to definitively say "I need byte #" or "I need pixel info from X and Y". I feel like this HAS to exist in Flutter as it's pretty trivial in many (most?) other platforms with a rich UI.

我是否遗漏了一些简单的东西，或者在这个平台上这比我精神上允许的更难?

Am I missing something simple, or is this just harder in this platform than I'm mentally allowing for?

或者我应该加载 html 库并在其中执行我需要的操作?

Or should I load the html library and do what I need in there?

谢谢！

(从历史上看，我精通 iOS 开发、C# 和 .Net、HTML 和画布工作，以及我想记住的许多其他平台，等等，但对 Flutter 来说还很陌生，因为我们正在紧急重写我们在 Trigger 中的应用程序，该应用程序不再表现良好.谢谢.):)

(by way of history, I'm fluent in iOS dev, C# and .Net, HTML and canvas work, and a host of other platforms over more years than I want to remember, etc, but fairly new to Flutter because we're doing an emergency rewrite of an app we had in Trigger, which is not behaving well any more. Thanks.) :)

推荐答案

不知道你是否还在寻找解决方案.

I don't know if you are still looking for a solution.

我刚刚为您制作了这个原型...希望足够清楚.

I just made this prototype for you... hope is clear enough.

这是结果的视频.

顺便说一下，图像库有很多方法可以解决您的需要...以防万一，并且像素值可以作为列表访问，因此您可以解决 KML 颜色并将列表视为网格(行，列数学找到索引).

By the way, the image library has plenty of methods to workaround what you need... in case you need it, and pixel values are accessible as List, so you can workaround the KML colors and treat the list as a grid (rows, cols math to find the index).

警告:库使用不同的颜色格式 (#AABBGGRR)，但可以轻松转换.

Warning: the library uses a different color format (#AABBGGRR), but can be converted easily though.

更新:

我根据评论中指出的限制制作了 v2，但更改了原始代码段展示这两种方法.这会生成您想要的任何小部件的快照(因此它需要转换/着色/框配件/您在屏幕上呈现的任何内容).

I made a v2 based on the limitations noted in the comments, but change the original snippet to show both approaches. This one generates a snapshot of whatever widget you want (so it takes transforms/colorization/box fittings/whatever u have rendered on screen).

如果您不必经常为小部件设置动画或使其无效，则为您提供了很多多功能性.

Gives you a lot of versatility, if you don't have to animate or invalidate the widget often.

查看 YouTube 中的演示.

这篇关于如何获取我单击的图像像素的颜色?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！