1

我有一个一般性问题(我知道我应该提出带有问题的特定代码,但在我的情况下,问题具有更一般的性质)。

在处理中,假设我制作了一个椭圆:

ellipse(30, 30, 10, 10);

现在,有没有办法获得这个椭圆在画布上的像素?原因是有一种方法可以创建用户与鼠标的交互(例如)。因此,当有人在椭圆上单击鼠标时,就会发生一些事情。

我想把所有东西都变成对象并使用构造函数以某种方式存储形状的位置,但这说起来容易做起来难,尤其是对于更复杂的形状。这就是我感兴趣的。计算椭圆的位置是一回事,但更复杂的形状呢?有图书馆吗?

4

3 回答 3

3

使用数学公式比逐像素检查鼠标位置更好(它更快,并且涉及的代码更少)。

对于一个完美的圆,您可以使用毕达哥拉斯定理计算欧几里得距离。假设您的圆以位置 ( circleX, circleY) 为中心,并且半径(而不是直径)为circleR。您可以像这样检查鼠标是否在圆圈上:

if(sq(mouseX-circleX)+sq(mouseY-circleY) <= sq(circleR)) {
    // mouse is over circle
} else {
    // mouse is not over circle
}

这种方法基本上想象一个直角三角形,其中斜边(最长边)从圆心到鼠标位置。它使用毕达哥拉斯定理来计算斜边的长度,如果它小于圆的半径,则鼠标在圆内。(不过,它包含了一个轻微的优化——它比较平方以避免做平方根,因为这可能相对较慢。)

于 2013-10-30T16:50:18.467 回答
3

查看几何库。它有一种方法可以检查鼠标是否在任何 SVG 形状内。我不记得我的头顶,但它的工作原理就像你制作一个形状:

myShape = RG.loadShape("shape.svg");

还有一点:

RPoint p = new RPoint(mouseX, mouseY);

布尔函数 contains() 将告诉您该点是否在形状内:

myShape.contains(p);
于 2013-10-30T18:26:06.870 回答
0

我也想到了我原来的数学答案的替代方案。如果您能够承受两次绘制所有 UI 元素的内存和处理能力,那么您可以通过使用辅助缓冲区获得良好的结果。

原理包括拥有一个离屏图形缓冲区(例如使用 PGraphics)。它必须与主显示器的尺寸完全相同,并且禁用了抗锯齿功能。将所有交互式 UI 元素(按钮等)绘制到此缓冲区。但是,不要以正常方式绘制它们,而是给每个人一个独特的颜色,用于填充和描边(不要添加任何文本或图像......只是纯色)。例如,一个按钮可能完全是红色的,而另一个按钮可能是完全绿色的。只要每个项目都有独特的颜色,任何其他 RGB 值都可以。确保背景也具有独特的颜色。

用户永远不会看到该缓冲区,因此不要将其绘制到屏幕上(除非您正在调试或其他什么)。当您想检测鼠标在哪个项目上时,只需在该屏幕外缓冲区上查找鼠标位置即可。获取该位置的像素颜色,并将其与 UI 元素匹配。

完成所有这些后,继续将所有内容正常绘制到主显示器。

值得注意的是,如果您的 UI 元素从不(或很少)移动,则可以大大减少这种方法的处理时间。您只需要在出现/消失、动画或更改大小/位置时重新绘制辅助缓冲区。

于 2013-10-31T11:14:02.997 回答