java - 罗盘针绘制在错误的位置

Question

我正在用java开发指南针。首先，我为我的指南针创建了一个 UI 原型(prototype)，并创建了它的工作 SSCCE，您可以在其中单击面板，指针会指向另一个方向，相差约 15 度。这是代码:

public class TestFrame extends JFrame {

    public TestFrame() {
        initComponents();
    }

    public void initComponents() {
        setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        setLocation(new Point((int) (Toolkit.getDefaultToolkit().getScreenSize().width / 2) - 400, (int) (Toolkit.getDefaultToolkit().getScreenSize().height / 2) - 250));
        setSize(500, 500);
        setVisible(true);
        CompassPanel c = new CompassPanel();
        add(c, BorderLayout.CENTER);

    }

    public class CompassPanel extends JPanel {
        Image bufImage;
        Graphics bufG;
        private int circleX, circleY, circleRadius;
        private int[] xPoints, yPoints;
        private double rotationAngle = Math.toRadians(0);

        public CompassPanel() {
            setVisible(true);

            addMouseListener(new MouseListener() {
                @Override
                public void mouseReleased(MouseEvent e) {
                }

                @Override
                public void mousePressed(MouseEvent e) {
                }

                @Override
                public void mouseExited(MouseEvent e) {
                }

                @Override
                public void mouseEntered(MouseEvent e) {
                }

                @Override
                public void mouseClicked(MouseEvent e) {
                    rotationAngle = rotationAngle + Math.toRadians(15);
                    repaint();
                }
            });

        }

        @Override
        public void paint(Graphics g) {
            super.paint(g);
            Graphics2D g2d = (Graphics2D) g;
            g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
            circleRadius = (int) (getWidth() * 0.7);
            circleX = 50;
            circleY = 50;

            g2d.setColor(Color.BLACK);
            for (int angle = 0; angle <= 360; angle += 5) {
                double sin = Math.sin(Math.toRadians(angle));
                double cos = Math.cos(Math.toRadians(angle));
                int x1 = (int) ((circleX + circleRadius / 2) - cos  * (circleRadius * 0.37) - sin * (circleRadius * 0.37));
                int y1 = (int) ((circleY + circleRadius / 2) + sin  * (circleRadius * 0.37) - cos * (circleRadius * 0.37));
                g2d.setColor(Color.BLACK);
                g2d.drawLine(x1, y1, (circleX + circleRadius / 2), (circleY + circleRadius / 2));
            }

            g2d.setFont(new Font("Arial", Font.BOLD, 11));
            g2d.drawString("WEST", circleX - 45, circleY + circleRadius / 2 + 4);
            g2d.drawString("EAST", circleX + circleRadius + 13, circleY + circleRadius / 2 + 4);
            g2d.drawString("NORTH", circleX + circleRadius / 2 - 14, circleY - 15);
            g2d.drawString("SOUTH", circleX + circleRadius / 2 - 14, circleY + circleRadius + 25);
            g2d.setColor(Color.WHITE);
            g2d.fillOval(circleX, circleY, circleRadius, circleRadius);
            g2d.setColor(Color.BLACK);
            g2d.drawOval(circleX, circleY, circleRadius, circleRadius);

            xPoints = new int[] { (int) (circleX + circleRadius / 2),
                    (int) (circleX + circleRadius * 0.25),
                    (int) (circleX + circleRadius / 2),
                    (int) (circleX + circleRadius * 0.75) };

            yPoints = new int[] { (int) (circleY + 30),
                    (int) (circleY + circleRadius * 0.85),
                    (int) (circleY + circleRadius * 0.6),
                    (int) (circleY + circleRadius * 0.85) };

            Polygon fillPoly = new Polygon(xPoints, yPoints, 4);
            Polygon outerPoly = new Polygon(xPoints, yPoints, 4);

            int rotationX = circleX + (circleRadius / 2);
            int rotationY = circleX + (circleRadius / 2);

            g2d.setColor(Color.green);
            g2d.fillOval(rotationX, rotationY, 5, 5);

            AffineTransform a = g2d.getTransform().getRotateInstance(rotationAngle, rotationX, rotationY);
            g2d.setTransform(a);

            g2d.setColor(Color.RED);
            g2d.fillPolygon(fillPoly);

            g2d.setColor(Color.black);
            g2d.draw(outerPoly);
        }

        @Override
        public void update(Graphics g) {
            int w = this.getSize().width;
            int h = this.getSize().height;

            if (bufImage == null) {
                bufImage = this.createImage(w, h);
                bufG = bufImage.getGraphics();
            }

            bufG.setColor(this.getBackground());
            bufG.fillRect(0, 0, w, h);
            bufG.setColor(this.getForeground());

            paint(bufG);
            g.drawImage(bufImage, 0, 0, this);
        }

        public void setRotationAngle(int angle) {
            rotationAngle = angle;
        }
    }

    public static void main(String[] args) {
        new TestFrame();
    }
}

当我在应用程序中实现此面板时，不会像 SSCCE 中那样绘制针。它被画得稍高一些，位于其应有位置的左侧。当我单击面板并旋转针时，旋转工作正常并且针被绘制在其所属的位置。

我将这样的面板添加到我的应用程序中。 SensorPanel 是 TabbedPane 中的 JPanel。

public JPanel createSensorPanel(){
    sensorPanel = new JPanel(new MigLayout("fill, insets 3"));
    CompassPanel compassPanel = new CompassPanel();
    sensorPanel.add(compassPanel, "wrap");
    return sensorPanel;
}

为什么针的多边形没有绘制在SSCCE中绘制的位置？

编辑:

这是问题的图片。

Answer 1

如果您仔细观察图像上发生的情况，您就会发现仿射变换就是问题所在。

看起来仿射变换与顶级父组件相关，而不是与当前子组件相关(请参阅 java Affine Transform correct order )。

快速但肮脏的解决方案是在翻译 parent 时翻译箭头(基于 this answer )

AffineTransform a = g2d.getTransform().
    getRotateInstance(rotationAngle, rotationX, rotationY)
    .translate(parent.getX(), parent.getY()) // use instance of real parent instead
    .translate(tabpane.getX(), tabpane.getY()); // use instance of JTabbedPane instead

但更方便的是一些常见的解决方案，例如 this one .