指南针针在错误的位置绘制

Question

我正在研究java中的指南针。首先，我为我的指南针创建了一个UI原型，并创建了一个工作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是JPanel中的TabbedPane。

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

为什么针的Polygon没有在SSCCE中绘制的位置绘制？

编辑：

这是问题的图片。

Answer 1

如果你仔细观察你的图像上发生的事情，你会看到，仿射变换就是问题所在。

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

快速而肮脏的解决方案是在父母翻译时翻译箭头（基于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。