问题
I'm trying to draw some rotatable arrows with Swing 2d, there are some sample code online, so I copied and combined them into one app, but there is something wrong with each of the 3 methods : 1st one doesn't rotate from it's center, the other 2 don't look correctly in the arrow head, can someone show me how to fix them ?
import java.awt.*;
import java.awt.geom.*;
import javax.swing.*;
import javax.swing.event.*;
public class Arrow_Test extends JPanel implements ChangeListener {
Path2D.Double arrow = createArrow();
double theta = 0;
public void stateChanged(ChangeEvent e) {
int value = ((JSlider) e.getSource()).getValue();
theta = Math.toRadians(value);
repaint();
}
protected void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D) g;
g2.setStroke(new BasicStroke(6));
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
RenderingHints.VALUE_ANTIALIAS_ON);
int cx = getWidth() / 2;
int cy = getHeight() / 2;
AffineTransform at = AffineTransform.getTranslateInstance(cx, cy);
at.rotate(theta);
at.scale(2.0, 2.0);
Shape shape = at.createTransformedShape(arrow);
g2.setPaint(Color.blue);
g2.draw(shape);
GeneralPath a = drawArrow(20, 20, 30, 20, 50, 13);
AffineTransform at1 = AffineTransform.getTranslateInstance(cx, cy);
at1.rotate(theta);
at1.scale(2.0, 2.0);
Shape shape1 = at1.createTransformedShape(a);
g2.setPaint(Color.blue);
g2.draw(shape1);
drawArrow(100, 100, 50, 0, g2);
}
private Path2D.Double createArrow() {
int length = 80;
int barb = 15;
double angle = Math.toRadians(20);
Path2D.Double path = new Path2D.Double();
path.moveTo(-length / 2, 0);
path.lineTo(length / 2, 0);
double x = length / 2 - barb * Math.cos(angle);
double y = barb * Math.sin(angle);
path.lineTo(x, y);
x = length / 2 - barb * Math.cos(-angle);
y = barb * Math.sin(-angle);
path.moveTo(length / 2, 0);
path.lineTo(x, y);
return path;
}
GeneralPath drawArrow(int x1, int y1, int x2, int y2, double length,
double width) {
double x, y;
length = 50;
width = 5;
Point2D start = new Point2D.Double(x1, y1);
Point2D end = new Point2D.Double(x2, y2);
Point2D base = new Point2D.Double();
Point2D back1 = new Point2D.Double();
Point2D back2 = new Point2D.Double();
length = Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1));
// Compute normalized line vector
x = (x2 - x1) / length;
y = (y2 - y1) / length;
// Compute points for arrow head
base.setLocation(x2 - x * length, y2 - y * length);
back1.setLocation(base.getX() - width * y, base.getY() + width * x);
back2.setLocation(base.getX() + length * y, base.getY() - width * x);
Line2D.Double l1 = new Line2D.Double(start, end);
Line2D.Double l2 = new Line2D.Double(end, back2);
Line2D.Double l3 = new Line2D.Double(end, back1);
GeneralPath c = new GeneralPath(GeneralPath.WIND_EVEN_ODD);
c.append(l1, true);
c.append(l2, true);
c.append(l3, true);
return c;
}
private void drawArrow(int x1, int y1, int x2, int y2, Graphics2D g2d) {
int x[] = { 0, 36, 0 };
int y[] = { -10, 0, 10 };
g2d.rotate(theta);
g2d.drawLine(x1 - 20, y1, x1 + 20, y1);
// will move the orgin
g2d.translate(x1, y1);
double angle = findLineAngle(x1 - 20, y1, x1 + 20, y1);
System.out.println("angle is===>" + angle);
g2d.rotate(angle);
g2d.fillPolygon(new Polygon(x, y, 3));
// /will restore orgin
g2d.translate(-x2, -y2);
g2d.rotate(-angle);
}
private double findLineAngle(int x1, int y1, int x2, int y2) {
if ((x2 - x1) == 0)
return Math.PI / 2;
return Math.atan((y2 - y1) / (x2 - x1));
}
private JSlider getSlider() {
JSlider slider = new JSlider(-180, 180, 0);
slider.addChangeListener(this);
return slider;
}
public static void main(String[] args) {
Arrow_Test test = new Arrow_Test();
JFrame f = new JFrame();
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.add(test);
f.add(test.getSlider(), "Last");
f.setSize(400, 400);
f.setLocationRelativeTo(null);
f.setVisible(true);
}
}
回答1:
I really don't want to get into "why", as your code is hard enough to read.
When rotating an object, you should specify a anchor (x/y) around which the rotation should take place. By default, this is the 0x0
position of the current context.
Why your "path" based arrows look...interesting, could have to do with the way they are created, but I didn't really play around with them.
The other thing you need to be careful is, transformations are compounding, this is a good and bad thing, you just need to be careful with them ;)
Lets start with a basic shape...
public class Arrow extends Path2D.Double {
public Arrow() {
moveTo(0, 10);
lineTo(36, 10);
moveTo(36 - 16, 0);
lineTo(36, 10);
moveTo(36 - 16, 20);
lineTo(36, 10);
}
}
Okay, nothing impressive, you could add width/height parameters to make the arrow appear the way you want, but this gets a basic start. I prefer to use Shape
based objects, they are just simpler to work with then the old Polygon
style API.
The Arrow
is basically three lines which meet at the middle of the vertical and the end of the horizontal. You might get a better result if the arrow head was a single line, but I'll leave that for you to play with
Next, we need to position and rotate the object (arrow
is an instance of Arrow
BTW)
double x = (getWidth() - arrow.getBounds().getWidth()) / 2d;
double y = (getHeight() - arrow.getBounds().getHeight()) / 2d;
AffineTransform at = new AffineTransform();
at.translate(x, y);
at.rotate(theta, arrow.getBounds().getWidth() / 2d, arrow.getBounds().getHeight() / 2d);
g2d.setTransform(at);
g2d.draw(arrow);
We apply a translation first, this makes it so that the Graphics
context's 0x0
position is now the x/y
position we specify. This makes it MUCH easier to calculate the anchor position around which the arrow should rotate...
And a runnable example to bind it all together
import java.awt.BasicStroke;
import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.RenderingHints;
import java.awt.geom.AffineTransform;
import java.awt.geom.Path2D;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JSlider;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;
import javax.swing.event.ChangeEvent;
import javax.swing.event.ChangeListener;
public class Arrow_Test extends JPanel implements ChangeListener {
double theta = 0;
Path2D arrow = new Arrow();
public void stateChanged(ChangeEvent e) {
int value = ((JSlider) e.getSource()).getValue();
theta = Math.toRadians(value);
repaint();
}
protected void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2d = (Graphics2D) g;
g2d.setRenderingHint(RenderingHints.KEY_ALPHA_INTERPOLATION, RenderingHints.VALUE_ALPHA_INTERPOLATION_QUALITY);
g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2d.setRenderingHint(RenderingHints.KEY_COLOR_RENDERING, RenderingHints.VALUE_COLOR_RENDER_QUALITY);
g2d.setRenderingHint(RenderingHints.KEY_DITHERING, RenderingHints.VALUE_DITHER_ENABLE);
g2d.setRenderingHint(RenderingHints.KEY_FRACTIONALMETRICS, RenderingHints.VALUE_FRACTIONALMETRICS_ON);
g2d.setRenderingHint(RenderingHints.KEY_INTERPOLATION, RenderingHints.VALUE_INTERPOLATION_BILINEAR);
g2d.setRenderingHint(RenderingHints.KEY_RENDERING, RenderingHints.VALUE_RENDER_QUALITY);
g2d.setRenderingHint(RenderingHints.KEY_STROKE_CONTROL, RenderingHints.VALUE_STROKE_PURE);
g2d.setStroke(new BasicStroke(4));
double x = (getWidth() - arrow.getBounds().getWidth()) / 2d;
double y = (getHeight() - arrow.getBounds().getHeight()) / 2d;
AffineTransform at = new AffineTransform();
at.translate(x, y);
at.rotate(theta, arrow.getBounds().getWidth() / 2d, arrow.getBounds().getHeight() / 2d);
g2d.setTransform(at);
g2d.draw(arrow);
g2d.dispose();
}
private JSlider getSlider() {
JSlider slider = new JSlider(-180, 180, 0);
slider.addChangeListener(this);
return slider;
}
public static void main(String[] args) {
EventQueue.invokeLater(new Runnable() {
@Override
public void run() {
try {
UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
} catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
ex.printStackTrace();
}
Arrow_Test test = new Arrow_Test();
JFrame f = new JFrame();
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.add(test);
f.add(test.getSlider(), "Last");
f.setSize(400, 400);
f.setLocationRelativeTo(null);
f.setVisible(true);
}
});
}
public class Arrow extends Path2D.Double {
public Arrow() {
moveTo(0, 10);
lineTo(36, 10);
moveTo(36 - 16, 0);
lineTo(36, 10);
moveTo(36 - 16, 20);
lineTo(36, 10);
}
}
}
来源:https://stackoverflow.com/questions/30991742/how-to-draw-2d-arrows-with-java-swing