Question

我有一张我在画画之前旋转的图像。图像旋转六角形的角度。换句话说，图像基本上“突出显示”六边形的各个边缘。我需要检测鼠标是否在此旋转图像内被单击。在未旋转的图像中检测鼠标单击非常简单，但我不知道如何检测旋转点内的点击。有没有办法在旋转后获取图像角点，这样我就可以在图像顶部放置一个不可见的多边形并使用Polygon.contains（）？

                    Image highlightEdge = new Image("assets/img/highlightEdge.png");
                    if(angle == 90){
                        highlightEdge.setCenterOfRotation(highlightEdge.getWidth(), 0);
                        highlightEdge.rotate(new Float(angle));
                        highlightEdge.draw(testPoint.x - 56, testPoint.y);
                    } else if(angle == 210) {
                        highlightEdge.setCenterOfRotation(0, 0);
                        highlightEdge.rotate(new Float(angle));
                        highlightEdge.draw(lastSettlement.x - 72, lastSettlement.y - 32);
                    } else if( angle == 330){
                        highlightEdge.setCenterOfRotation(0, 0);
                        highlightEdge.rotate(new Float(angle));
                        highlightEdge.draw(lastSettlement.x - 8, lastSettlement.y - 32);
                    } else if(angle == 30){
                        highlightEdge.setCenterOfRotation(0, 0);
                        highlightEdge.rotate(new Float(angle));
                        highlightEdge.draw(lastSettlement.x-8, lastSettlement.y);
                    } else if(angle == 150){
                        highlightEdge.setCenterOfRotation(0, 0);
                        highlightEdge.rotate(new Float(angle));
                        highlightEdge.draw(lastSettlement.x-72, lastSettlement.y);
                    } else {
                        highlightEdge.setCenterOfRotation(0, 0);
                        highlightEdge.rotate(new Float(angle));
                        highlightEdge.draw(lastSettlement.x-40, lastSettlement.y - 48);
                    }

Answer 1

您可以创建Shape以与Image的形状完全匹配，然后使用其方法contains来检测鼠标是否在内部被点击。

要考虑Image的轮播，您可以将相应的轮播Transform应用于Shape。

我创建了执行此操作的方法shapeFromImage;它会收到Image及其位置，并返回相应的Shape：

/**
 * Returns the Shape of an Image considering its rotation
 * @param image
 * @param x the x position of the Image
 * @param y the y position of the Image
 */
public static Shape shapeFromImage(Image image, float x, float y) {

    // create a rectangle with same position and size of the image
    Shape imageShape = new Rectangle(x, y, image.getWidth(), image.getHeight());

    // get the rotation angle of the image
    float angle = image.getRotation();

    // if the image is rotated, we also need to rotate our shape 
    if (angle != 0.f) {

        // convert the rotation angle in radians to use in Transform 
        float angleInRadians = (float) Math.toRadians(angle);

        // get the point of rotation to use in Transform.
        // image.getCenterOfRotation returns a point relative to the image.
        // for Transform we need an absolute point, so we add the image position to it
        float rotationX = image.getCenterOfRotationX() + x;
        float rotationY = image.getCenterOfRotationY() + y;

        // create the rotation Transform to match the image rotation
        Transform rotationTransform = Transform.createRotateTransform(angleInRadians, rotationX, rotationY);

        // apply the rotation Transform to our shape
        imageShape = imageShape.transform(rotationTransform);

    }

    return imageShape;
}

在您的示例中，您可以像这样使用它：

float positionX;
float positionY;

if (angle == 90) {
    highlightEdge.setCenterOfRotation(highlightEdge.getWidth(), 0);
    highlightEdge.rotate(new Float(angle));

    positionX = testPoint.x - 56;
    positionY = testPoint.y;

    highlightEdge.draw(positionX, positionY);
} 

...

// you can now use this Shape to use its method "contains"
imageShape = shapeFromImage(highlightEdge, positionX, positionY);

如何在Slick2D中检测到旋转图像上的单击？

1 个答案: