Using JSlider to Scale Drawing - java

First question ever here. I'm trying to scale a custom drawing with JSlider. However, it doesn't do anything and I cannot for the life of me figure out why. My code grabs a custom shape and draws it fine initially, but it won't scale.
class DrawFrame extends JFrame {
private int CarWidth = 50;
private CarShape shape = new CarShape(150, 150, CarWidth);
public DrawFrame()
{
setTitle("Draw a Car");
setSize(400, 400);
JSlider slider = new JSlider(JSlider.VERTICAL, 1, 100, 50);
slider.setMajorTickSpacing(5);
slider.setPaintTicks(true);
slider.addChangeListener((new ChangeListener() {
public void stateChanged(ChangeEvent e) {
JSlider source = (JSlider) e.getSource();
int x = (int)source.getValue();
CarWidth = x;
repaint();
}
}));
add(slider, BorderLayout.WEST);
add(shape);
}
}
public class CarShape extends JPanel {
private int x;
private int y;
private int width;
public CarShape(int x, int y, int width)
{
this.x = x;
this.y = y;
this.width = width;
}
public void update(int x){
x = width;
}
public void paintComponent(Graphics g)
{
super.paintComponent(g);
Graphics2D g2 = (Graphics2D) g;
Rectangle2D.Double body
= new Rectangle2D.Double(x, y + width / 6,
width - 1, width / 6);
Ellipse2D.Double frontTire
= new Ellipse2D.Double(x + width / 6, y + width / 3,
width / 6, width / 6);
Ellipse2D.Double rearTire
= new Ellipse2D.Double(x + width * 2 / 3, y + width / 3,
width / 6, width / 6);
// The bottom of the front windshield
Point2D.Double r1
= new Point2D.Double(x + width / 6, y + width / 6);
// The front of the roof
Point2D.Double r2
= new Point2D.Double(x + width / 3, y);
// The rear of the roof
Point2D.Double r3
= new Point2D.Double(x + width * 2 / 3, y);
// The bottom of the rear windshield
Point2D.Double r4
= new Point2D.Double(x + width * 5 / 6, y + width / 6);
Line2D.Double frontWindshield
= new Line2D.Double(r1, r2);
Line2D.Double roofTop
= new Line2D.Double(r2, r3);
Line2D.Double rearWindshield
= new Line2D.Double(r3, r4);
g2.draw(body);
g2.draw(frontTire);
g2.draw(rearTire);
g2.draw(frontWindshield);
g2.draw(roofTop);
g2.draw(rearWindshield);
}
}
public class SliderTester {
public static void main(String[] args)
{
DrawFrame frame = new DrawFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);
}
}

Every time the change listener is called, it creates a new CarShape object, but this has no effect on the CarShape object that is displayed. Better perhaps would be to resize the visualized object... OK, did you just change the code on me or am I imagining things?
Now you're changing CarWidth (which should be re-named carWidth), but that's not going to change the state of the visualized CarShape object. Instead give your CarShape class a setCarWidth(int width) method, one that changes its state, and then call that method within your stateChange method.
e.g.,
import java.awt.*;
import java.awt.geom.*;
import javax.swing.*;
import javax.swing.event.*;
#SuppressWarnings("serial")
class DrawFrame extends JFrame {
private int carWidth = 50;
private CarShape shape = new CarShape(150, 150, carWidth);
public DrawFrame() {
setTitle("Draw a Car");
setSize(400, 400);
JSlider slider = new JSlider(JSlider.VERTICAL, 1, 100, 50);
slider.setMajorTickSpacing(5);
slider.setPaintTicks(true);
slider.addChangeListener((new ChangeListener() {
public void stateChanged(ChangeEvent e) {
JSlider source = (JSlider) e.getSource();
carWidth = (int) source.getValue();
shape.setCarWidth(carWidth);
repaint();
}
}));
add(slider, BorderLayout.WEST);
add(shape);
}
}
#SuppressWarnings("serial")
class CarShape extends JPanel {
private int x;
private int y;
private int width;
public CarShape(int x, int y, int width) {
this.x = x;
this.y = y;
this.width = width;
}
public void setCarWidth(int w) {
this.width = w;
}
// this method is just messed up -- you're setting the parameter!
public void update(int x) {
x = width; // no!!!
}
public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D) g;
Rectangle2D.Double body = new Rectangle2D.Double(x, y + width / 6,
width - 1, width / 6);
Ellipse2D.Double frontTire = new Ellipse2D.Double(x + width / 6, y
+ width / 3, width / 6, width / 6);
Ellipse2D.Double rearTire = new Ellipse2D.Double(x + width * 2 / 3, y
+ width / 3, width / 6, width / 6);
// The bottom of the front windshield
Point2D.Double r1 = new Point2D.Double(x + width / 6, y + width / 6);
// The front of the roof
Point2D.Double r2 = new Point2D.Double(x + width / 3, y);
// The rear of the roof
Point2D.Double r3 = new Point2D.Double(x + width * 2 / 3, y);
// The bottom of the rear windshield
Point2D.Double r4 = new Point2D.Double(x + width * 5 / 6, y + width / 6);
Line2D.Double frontWindshield = new Line2D.Double(r1, r2);
Line2D.Double roofTop = new Line2D.Double(r2, r3);
Line2D.Double rearWindshield = new Line2D.Double(r3, r4);
g2.draw(body);
g2.draw(frontTire);
g2.draw(rearTire);
g2.draw(frontWindshield);
g2.draw(roofTop);
g2.draw(rearWindshield);
}
}
public class SliderTester {
public static void main(String[] args) {
DrawFrame frame = new DrawFrame();
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);
}
}

Related

Rotating a triangle around its axis

I have got a circle and a triangle inside. I need this figure to rotate around its axis and each time it rotates on a certain angle, it should be painted, overall to get something kind of 'ornament'(on the screen below). I've been trying with Graphics2D, but it went bad. How can I do that?
Code:
import org.omg.CORBA.TIMEOUT;
import javax.swing.*;
import java.awt.*;
import java.awt.Graphics2D;
import java.awt.geom.AffineTransform;
public class Main extends JPanel {
public static void main(String[] args) {
JFrame frame = new JFrame("Laboratorna 1");
frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
frame.add(new Main());
frame.setSize(1200, 800);
frame.setVisible(true);
}
public void paintComponent(Graphics g){
int num_2 = 8;
int bigOval_h = 300, bigOval_w = 300;
g.setColor(Color.BLUE);
g.drawOval(0+500, 0, bigOval_h, bigOval_w);
g.drawLine(150+500, 0, 20+500, 225);
g.drawLine(150+500, 0, 280+500, 225);
g.drawLine(20+500, 225,280+500, 225);
g.setColor(Color.RED);
}
}
The trick is to perform an affine transform for each angle. In addition you have to define the pivot point for each transform which equals the center of the circle. The following modifications of the paintComponent-method should possibly do the job.
public void paintComponent(Graphics g){
int num_2 = 8;
int bigOval_h = 300, bigOval_w = 300;
g.setColor(Color.BLUE);
g.drawOval(0 + 500, 0, bigOval_h, bigOval_w);
// REMOVE -------------------------------------------
// g.drawLine(150+500, 0, 20+500, 225);
// g.drawLine(150+500, 0, 280+500, 225);
// g.drawLine(20+500, 225,280+500, 225);
// REMOVE -------------------------------------------
g.setColor(Color.RED);
// ADD -------------------------------------------------------------------
// Create, transform and draw the lines
Line2D lin1 = new Line2D.Float(150f + 500f, 0f, 20f + 500f, 225f);
Line2D lin2 = new Line2D.Float(150f + 500f, 0f, 280f + 500f, 225f);
Line2D lin3 = new Line2D.Float(20f + 500f, 225f, 280f + 500f, 225f);
double pivotX = 500.0 + bigOval_w / 2.0; // center of the circle (x)
double pivotY = 0.0 + bigOval_h / 2.0; // center of the circle (y)
for (int i = 0; i < num_2; i++) {
AffineTransform affineTransform = AffineTransform.getRotateInstance(Math.toRadians(360.0 / num_2 * i), pivotX, pivotY);
((Graphics2D)g).draw(affineTransform.createTransformedShape(lin1));
((Graphics2D)g).draw(affineTransform.createTransformedShape(lin2));
((Graphics2D)g).draw(affineTransform.createTransformedShape(lin3));
}
// ADD -------------------------------------------------------------------
}
The output is:
One way to define a polygon is radius, rotation, and number of sides. A triangle is a 3 sided polygon. So a triangle class can simply save radius and rotation and then compute the three vertices of the polygon for drawing around a center point.
public class Triangle {
private final int radius;
private final double rotation;
public Triangle(int radius, double rotation) {
this.radius = radius;
this.rotation = rotation;
}
public void paintComponent(Graphics2D g, Point center) {
int[] xVertices = new int[3];
int[] yVertices = new int[3];
xVertices[0] = (int) (center.getX() - (Math.cos(rotation) * radius));
yVertices[0] = (int) (center.getY() - (Math.sin(rotation) * radius));
xVertices[1] = (int) (center.getX() - (Math.cos(Math.PI * 0.66667 + rotation) * radius));
yVertices[1] = (int) (center.getY() - (Math.sin(Math.PI * 0.66667 + rotation) * radius));
xVertices[2] = (int) (center.getX() - (Math.cos(Math.PI * 1.33333 + rotation) * radius));
yVertices[2] = (int) (center.getY() - (Math.sin(Math.PI * 1.33333 + rotation) * radius));
Polygon polygon = new Polygon(xVertices, yVertices, 3);
g.setColor(Color.RED);
g.drawPolygon(polygon);
}
}
This would give two triangles rotated PI radians.
Triangle t = new Triangle(100, 0.0);
t.paintComponent((Graphics2D)g, new Point(250,250));
Triangle t2 = new Triangle(100, Math.PI);
t2.paintComponent((Graphics2D)g, new Point(250,250));

How to add Icon to JPanel

So this is going to be very basic, but I can't figure it out. I have a CarIcon, which implements an Icon interface and a Resizable interface (I'll be implementing that later) and I have everything set up, but I can't figure out how to add my icon in to the JPanel or JFrame from main. I mean, I don't have the Component and Graphics information in order to call paintIcon method in my CarIcon class, so what do I do?
Here's some relevant code:
CarIcon
import java.awt.*;
import java.awt.geom.*;
public class CarIcon implements Icon, Resizable{
private int width;
/**
* Construct a car of a given width.
* #param width: the width of the car
*/
public CarIcon(int aWidth){
width = aWidth;
}
public int getIconWidth(){
return width;
}
public int getIconHeight(){
return width/2;
}
public void paintIcon(Component c, Graphics g, int x, int y){
Graphics2D g2 = (Graphics2D) g;
Rectangle2D.Double body = new Rectangle2D.Double(x, y + width / 6, width -1, width / 6);
Ellipse2D.Double frontTire = new Ellipse2D.Double(x + width / 6, y + width / 3, width / 6, width /6);
Ellipse2D.Double rearTire = new Ellipse2D.Double(x + width * 2 / 3, y + width / 3, width / 6, width / 6);
// The bottom of the front windshield
Point2D.Double r1 = new Point2D.Double(x + width / 6, y + width / 6);
// The front of the roof
Point2D.Double r2 = new Point2D.Double(x + width / 3, y);
// The rear of the roof
Point2D.Double r3 = new Point2D.Double(x + width * 2 / 3, y);
// The bottom of the rear windshield
Point2D.Double r4 = new Point2D.Double(x + width * 5 /6, y + width / 6);
Line2D.Double frontWindshield = new Line2D.Double(r1, r2);
Line2D.Double roofTop = new Line2D.Double(r2, r3);
Line2D.Double rearWindshield = new Line2D.Double(r3, r4);
g2.fill(frontTire);
g2.fill(rearTire);
g2.setColor(Color.RED);
g2.fill(body);
g2.draw(frontWindshield);
g2.draw(roofTop);
g2.draw(rearWindshield);
}
#Override
public void resize(int y) {
// TODO Auto-generated method stub
width += y;
}
#Override
public void setIconWidth(int x) {
// TODO Auto-generated method stub
width = x;
}
}
SliderTester (main)
import javax.swing.JFrame;
import javax.swing.JPanel;
public class SliderTester extends JPanel{
private static final int DEFAULT_WIDTH = 400;
private static final int DEFAULT_HEIGHT = 200;
final static Icon myCar = new CarIcon(20);
final static JPanel panel = new JPanel();
public static void main(String[] args) {
// TODO Auto-generated method stub
JFrame frame = new JFrame();
frame.setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);
}
}
Thanks for your help in advance and Happy Easter!
The following won't work:
final static Icon myCar = new CarIcon(20);
final static JLabel label = new JLabel(myCar);
Compiler says "The constructor JLabel(Icon) is undefined"
Another edit:
Can there be something wrong with my Eclipse? Here is a screen shot where I take your code and paste it in my program and it throws an error:
Icons don't naturally go into JPanels, but they do naturally and easily go into JLabels, and then JLabels can easily go into a JPanel, and I think that this is exactly what you should do:
Create a JLabel with your Icon. You can do this either by passing the Icon into the JLabel's constructor or by calling setIcon(...) on the JLabel.
Add your JLabel to your JPanel using whatever appropriate layout manager you need
Add that JPanel to another JPanel or to a top level window or wherever it needs to go.
If you've implemented your Icon appropriately, you'd do something like:
JLabel myLabel = new JLabel(myIcon);
myPanel.add(myLabel);
Or for example with your code:
JLabel label = new JLabel(myCar);
panel.add(label);
JFrame frame = new JFrame();
frame.setSize(DEFAULT_WIDTH, DEFAULT_HEIGHT);
frame.add(panel);
Or more simply:
public static void main(String[] args) {
SwingUtilities.invokeLater(new Runnable() {
public void run() {
JLabel label = new JLabel(new CarIcon(40));
JPanel panel = new JPanel();
panel.add(label);
JOptionPane.showMessageDialog(null, panel);
}
});
}
Here's my whole test program:
import java.awt.*;
import java.awt.geom.*;
import javax.swing.*;
public class TestCarIcon {
public static void main(String[] args) {
SwingUtilities.invokeLater(new Runnable() {
public void run() {
JLabel label = new JLabel(new CarIcon(80));
JPanel panel = new JPanel();
panel.add(label);
JOptionPane.showMessageDialog(null, panel);
}
});
}
}
class CarIcon implements Icon, Resizable {
private int width;
/**
* Construct a car of a given width.
*
* #param width
* : the width of the car
*/
public CarIcon(int aWidth) {
width = aWidth;
}
public int getIconWidth() {
return width;
}
public int getIconHeight() {
return width / 2;
}
public void paintIcon(Component c, Graphics g, int x, int y) {
Graphics2D g2 = (Graphics2D) g;
// !! Added to smooth images
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
Rectangle2D.Double body = new Rectangle2D.Double(x, y + width / 6,
width - 1, width / 6);
Ellipse2D.Double frontTire = new Ellipse2D.Double(x + width / 6, y
+ width / 3, width / 6, width / 6);
Ellipse2D.Double rearTire = new Ellipse2D.Double(x + width * 2 / 3, y
+ width / 3, width / 6, width / 6);
// The bottom of the front windshield
Point2D.Double r1 = new Point2D.Double(x + width / 6, y + width / 6);
// The front of the roof
Point2D.Double r2 = new Point2D.Double(x + width / 3, y);
// The rear of the roof
Point2D.Double r3 = new Point2D.Double(x + width * 2 / 3, y);
// The bottom of the rear windshield
Point2D.Double r4 = new Point2D.Double(x + width * 5 / 6, y + width / 6);
Line2D.Double frontWindshield = new Line2D.Double(r1, r2);
Line2D.Double roofTop = new Line2D.Double(r2, r3);
Line2D.Double rearWindshield = new Line2D.Double(r3, r4);
g2.fill(frontTire);
g2.fill(rearTire);
g2.setColor(Color.RED);
g2.fill(body);
g2.draw(frontWindshield);
g2.draw(roofTop);
g2.draw(rearWindshield);
}
#Override
public void resize(int y) {
width += y;
}
#Override
public void setIconWidth(int x) {
width = x;
}
}
interface Resizable {
void resize(int y);
void setIconWidth(int x);
}
Which shows this:

Shapes and Segments in Java

I have a Shape. I'm basically trying to split an area into two areas using a segment as the bisection.
public Shape divide(Shape a, Point2D p1, Point2D p2) {
Shape str = new BasicStroke().createStrokedShape(new Line2D.Double(p1,p2));
Shape line = new Shape(str);
Shape temp = a;
line.intersect(temp);
temp.exclusiveOr(line);
// temp is the shape with the line intersecting it
AffineTransform t = new AffineTransform();
double angle = Math.atan2(p2.getY() - p1.getY(), p2.getX() - p1.getX());
t.rotate(angle, p1.getX(), p1.getY());
temp = temp.createTransformedArea(t);
return Shape ;
}
I want to bisect the shape into two using the segment, but not sure how to go about it, I was looking at the intersection methods:
http://docs.oracle.com/javase/7/docs/api/java/awt/geom/Area.html but still not sure how to get two Areas from one. I'm hoping to return something like:
return firstHalf secondHalf;
I'd do it something like this. Note the code has a bug for when the point that start out to the right and lower ends up to the left of the upper left point. Left as an exercise for the user.
import java.awt.*;
import java.awt.event.MouseAdapter;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.geom.*;
import java.awt.image.BufferedImage;
import javax.swing.*;
class SplitArea {
int s = 100;
JPanel gui = new JPanel(new BorderLayout());
BufferedImage[] images = new BufferedImage[4];
Point p1 = new Point(s / 4, s / 4);
Point p2 = new Point(s * 3 / 4, s * 3 / 4);
Ellipse2D ellipse = new Ellipse2D.Float(
s / 5, s / 5, s * 3 / 5, s * 3 / 5);
Rectangle2D bg = new Rectangle2D.Float(0, 0, s, s);
SplitArea() {
JToolBar tb = new JToolBar();
gui.add(tb, BorderLayout.PAGE_START);
final JToggleButton tob = new JToggleButton("Primary Point");
tb.add(tob);
JPanel view = new JPanel(new GridLayout(1, 0, 4, 4));
gui.add(view, BorderLayout.CENTER);
for (int ii = 0; ii < images.length; ii++) {
BufferedImage bi = new BufferedImage(
s, s, BufferedImage.TYPE_INT_RGB);
images[ii] = bi;
JLabel l = new JLabel(new ImageIcon(bi));
if (ii == 0) {
l.addMouseListener(new MouseAdapter() {
#Override
public void mouseClicked(MouseEvent e) {
if (tob.isSelected()) {
p1 = e.getPoint();
} else {
p2 = e.getPoint();
}
drawImages();
}
});
}
view.add(l);
}
drawImages();
}
public final void drawImages() {
Graphics2D g;
// image 0
g = images[0].createGraphics();
g.setColor(Color.BLACK);
g.fill(bg);
g.setColor(Color.CYAN);
g.fill(ellipse);
g.setColor(Color.WHITE);
g.draw(ellipse);
g.setColor(Color.red);
drawPoint(g, p1);
drawPoint(g, p2);
g.dispose();
int xDiff = p1.x - p2.x;
int yDiff = p1.y - p2.y;
Point2D xAxis;
Point2D xSAxis;
if (xDiff == 0) {
xAxis = new Point2D.Double(p1.x, 0);
xSAxis = new Point2D.Double(p1.x, s);
} else if (yDiff == 0) {
xAxis = new Point2D.Double(0, p1.y);
xSAxis = new Point2D.Double(s, p1.y);
} else {
System.out.println("Not vertical or horizontal!");
// will throw a NaN if line is vertical
double m = (double) yDiff / (double) xDiff;
System.out.println("m: " + m);
double b = (double) p1.y - (m * (double) p1.x);
System.out.println("b: " + b);
// crosses x axis at..
xAxis = new Point2D.Double(0d, b);
double pointS = (s - b) / m;
xSAxis = new Point2D.Double(pointS, s);
}
// image 1
g = images[1].createGraphics();
g.setColor(Color.BLACK);
g.fill(bg);
g.setColor(Color.CYAN);
g.fill(ellipse);
g.setColor(Color.WHITE);
g.draw(ellipse);
g.setColor(Color.YELLOW);
System.out.println(xAxis);
System.out.println(xSAxis);
g.drawLine(
(int) xAxis.getX(), (int) xAxis.getY(),
(int) xSAxis.getX(), (int) xSAxis.getY());
g.setColor(Color.red);
drawPoint(g, p1);
drawPoint(g, p2);
g.dispose();
// image 2
g = images[1].createGraphics();
g.setColor(Color.BLACK);
g.fill(bg);
g.setColor(Color.CYAN);
g.fill(ellipse);
g.setColor(Color.WHITE);
g.draw(ellipse);
g.setColor(Color.YELLOW);
System.out.println(xAxis);
System.out.println(xSAxis);
g.drawLine(
(int) xAxis.getX(), (int) xAxis.getY(),
(int) xSAxis.getX(), (int) xSAxis.getY());
g.setColor(Color.red);
drawPoint(g, p1);
drawPoint(g, p2);
g.dispose();
// split the regions
Rectangle2D.Double all = new Rectangle2D.Double(0, 0, s, s);
Area a1 = new Area(all);
Area a2 = new Area(all);
GeneralPath aPart = new GeneralPath();
aPart.moveTo(0, 0);
aPart.lineTo(0, s);
aPart.lineTo(xSAxis.getX(), xSAxis.getY());
aPart.lineTo(xAxis.getX(), xAxis.getY());
aPart.closePath();
a1.subtract(new Area(aPart));
a2.subtract(a1);
Area ellipsePartA = new Area(ellipse);
ellipsePartA.subtract(a1);
Area ellipsePartB = new Area(ellipse);
ellipsePartB.subtract(a2);
// image 3
g = images[2].createGraphics();
g.setColor(Color.BLACK);
g.fill(bg);
g.setColor(Color.CYAN);
g.fill(ellipsePartA);
g.setColor(Color.WHITE);
g.draw(ellipsePartA);
g.setColor(Color.red);
drawPoint(g, p1);
drawPoint(g, p2);
g.dispose();
// image 4
g = images[3].createGraphics();
g.setColor(Color.BLACK);
g.fill(bg);
g.setColor(Color.CYAN);
g.fill(ellipsePartB);
g.setColor(Color.WHITE);
g.draw(ellipsePartB);
g.setColor(Color.red);
drawPoint(g, p1);
drawPoint(g, p2);
g.dispose();
gui.repaint();
}
public final void drawPoint(Graphics g, Point2D p) {
g.setColor(new Color(255, 0, 0, 128));
int x = (int) p.getX();
int y = (int) p.getY();
g.drawLine(x - 1, y, x - 5, y);
g.drawLine(x + 1, y, x + 5, y);
g.drawLine(x, y - 1, x, y - 5);
g.drawLine(x, y + 1, x, y + 5);
}
public Area[] split(Area a, Point2D p1, Point2D p2) {
Shape str = new BasicStroke().createStrokedShape(new Line2D.Double(p1, p2));
Area line = new Area(str);
Area temp = a;
line.intersect(temp);
temp.exclusiveOr(line);
// temp is the shape with the line intersecting it
Area[] areas = {new Area(temp)};
return areas;
}
public JComponent getGui() {
return gui;
}
public static void main(String[] args) {
Runnable r = new Runnable() {
#Override
public void run() {
SplitArea sa = new SplitArea();
JOptionPane.showMessageDialog(null, sa.getGui());
}
};
// Swing GUIs should be created and updated on the EDT
// http://docs.oracle.com/javase/tutorial/uiswing/concurrency
SwingUtilities.invokeLater(r);
}
}
Here is another https://stackoverflow.com/help/mcve (I started this "yesterday" at ~3:00 am, obviously Andrew Thompson is in a different time zone ;-))
The basic idea here is as follows:
The two given points define a line. That is, an infinite line, and not only a line segment. The corner points of the bounding box of the object are projected on this line and its perpendicular. This gives (an upper bound of) the extent of the object along these lines. These upper bounds can be used to define the "minimum half-spaces" above and below the line that are required to cover the respective half of the object. These half-spaces can then be intersected with the object to obtain the desired results.
The split method in this example receives a Graphics2D parameter. This is only used for "debugging" - that is, to show the intermediate results (extents, half-spaces) that are computed, and a preview of the final results. This Graphics g parameter (and the corresponding debugging output) can simply be removed (but it might also help to show the idea of the approach).
import java.awt.Color;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Shape;
import java.awt.event.MouseEvent;
import java.awt.event.MouseMotionListener;
import java.awt.geom.AffineTransform;
import java.awt.geom.Area;
import java.awt.geom.Ellipse2D;
import java.awt.geom.Line2D;
import java.awt.geom.Path2D;
import java.awt.geom.Point2D;
import java.awt.geom.Rectangle2D;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;
public class ShapeSplit
{
public static void main(String[] args)
{
SwingUtilities.invokeLater(new Runnable()
{
#Override
public void run()
{
createAndShowGUI();
}
});
}
private static void createAndShowGUI()
{
JFrame f = new JFrame();
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.getContentPane().add(new ShapeSplitPanel());
f.setSize(1100,600);
f.setLocationRelativeTo(null);
f.setVisible(true);
}
}
class ShapeSplitPanel extends JPanel implements MouseMotionListener
{
private Shape inputShape = new Ellipse2D.Double(300,200,200,300);
private Point2D point0 = new Point2D.Double(200,300);
private Point2D point1 = new Point2D.Double(600,400);
ShapeSplitPanel()
{
addMouseMotionListener(this);
}
#Override
protected void paintComponent(Graphics gr)
{
super.paintComponent(gr);
Graphics2D g = (Graphics2D)gr;
g.setColor(Color.BLUE);
g.fill(inputShape);
g.setColor(Color.BLACK);
g.draw(new Line2D.Double(point0, point1));
g.fill(new Ellipse2D.Double(
point0.getX() - 3, point0.getY()-3, 6, 6));
g.fill(new Ellipse2D.Double(
point1.getX() - 3, point1.getY()-3, 6, 6));
split(new Area(inputShape), point0, point1, g);
}
private static Area[] split(Area a, Point2D p0, Point2D p1, Graphics2D g)
{
// Compute the direction of the line (L)
// and its perpendicular (P)
double dx = p1.getX() - p0.getX();
double dy = p1.getY() - p0.getY();
double length = Math.hypot(dx, dy);
double dirLx = dx / length;
double dirLy = dy / length;
double dirPx = -dirLy;
double dirPy = dirLx;
// Compute the minimum and maximum of all dot
// products that describe the distance of the
// projection of the corner points of the
// bounding box on on the line (L) and its
// perpendicular (P). These are upper limits
// for the extents of the object along these
// directions
double minDotL = Double.MAX_VALUE;
double maxDotL = -Double.MAX_VALUE;
double minDotP = Double.MAX_VALUE;
double maxDotP = -Double.MAX_VALUE;
Rectangle2D bounds = a.getBounds2D();
for (int i=0; i<4; i++)
{
Point2D corner = getCorner(bounds, i);
double pdx = corner.getX() - p0.getX();
double pdy = corner.getY() - p0.getY();
double dotL = dirLx * pdx + dirLy * pdy;
minDotL = Math.min(minDotL, dotL);
maxDotL = Math.max(maxDotL, dotL);
double dotP = dirPx * pdx + dirPy * pdy;
minDotP = Math.min(minDotP, dotP);
maxDotP = Math.max(maxDotP, dotP);
}
// Compute the start- and end points of
// the line segments describing the
// extent of the bounds along the line
// and the perpendicular
Point2D extentLmin = new Point2D.Double(
p0.getX() + minDotL * dirLx,
p0.getY() + minDotL * dirLy);
Point2D extentLmax = new Point2D.Double(
p0.getX() + maxDotL * dirLx,
p0.getY() + maxDotL * dirLy);
Point2D extentPmin = new Point2D.Double(
p0.getX() + minDotP * dirPx,
p0.getY() + minDotP * dirPy);
Point2D extentPmax = new Point2D.Double(
p0.getX() + maxDotP * dirPx,
p0.getY() + maxDotP * dirPy);
// Compute the two rectangles that cover
// each half of the object based on
// the given line
Path2D half0 = new Path2D.Double();
half0.moveTo(extentLmin.getX(), extentLmin.getY());
half0.lineTo(
extentLmin.getX() + minDotP * dirPx,
extentLmin.getY() + minDotP * dirPy);
half0.lineTo(
extentLmax.getX() + minDotP * dirPx,
extentLmax.getY() + minDotP * dirPy);
half0.lineTo(extentLmax.getX(), extentLmax.getY());
half0.closePath();
Path2D half1 = new Path2D.Double();
half1.moveTo(extentLmin.getX(), extentLmin.getY());
half1.lineTo(
extentLmin.getX() + maxDotP * dirPx,
extentLmin.getY() + maxDotP * dirPy);
half1.lineTo(
extentLmax.getX() + maxDotP * dirPx,
extentLmax.getY() + maxDotP * dirPy);
half1.lineTo(extentLmax.getX(), extentLmax.getY());
half1.closePath();
// Compute the resulting areas by intersecting
// the original area with both halves
Area a0 = new Area(a);
a0.intersect(new Area(half0));
Area a1 = new Area(a);
a1.intersect(new Area(half1));
// Debugging output
if (g != null)
{
g.setColor(Color.GRAY);
g.draw(bounds);
g.setColor(Color.RED);
g.draw(new Line2D.Double(extentLmin, extentLmax));
g.setColor(Color.GREEN);
g.draw(new Line2D.Double(extentPmin, extentPmax));
g.setColor(Color.YELLOW.darker());
g.draw(half0);
g.setColor(Color.MAGENTA);
g.draw(half1);
g.setColor(Color.BLUE);
g.fill(AffineTransform.getTranslateInstance(400, -20).
createTransformedShape(a0));
g.setColor(Color.BLUE);
g.fill(AffineTransform.getTranslateInstance(400, +20).
createTransformedShape(a1));
}
return new Area[] { a0, a1 };
}
private static Point2D getCorner(Rectangle2D r, int corner)
{
switch (corner)
{
case 0: return new Point2D.Double(r.getMinX(), r.getMinY());
case 1: return new Point2D.Double(r.getMinX(), r.getMaxY());
case 2: return new Point2D.Double(r.getMaxX(), r.getMaxY());
case 3: return new Point2D.Double(r.getMaxX(), r.getMinY());
}
return null;
}
#Override
public void mouseDragged(MouseEvent e)
{
point1.setLocation(e.getPoint());
repaint();
}
#Override
public void mouseMoved(MouseEvent e)
{
}
}
EDIT An aside: Technically, it could be easier (or even more elegant) to transform the original shape and the line so that the line matches the x-axis, then defining the half-spaces to be clipped against (which in this case could be simple Rectangle2Ds), and transforming the clipped results back into the original orientation. But I wanted to compute it "in-place", without having to create many transformed shapes.
EDIT2: Another snippet for the comment, to be inserted directly before the // Debugging output
AffineTransform t = new AffineTransform();
double angle = Math.atan2(p1.getY() - p0.getY(), p1.getX() - p0.getX());
t.rotate(-angle, p0.getX(), p0.getY());
a0 = a0.createTransformedArea(t);
a1 = a1.createTransformedArea(t);
EDIT3 The second approach, only the relevant method this time
private static Area[] split(Area a, Point2D p0, Point2D p1, Graphics2D g)
{
// Compute the angle of the line to the x-axis
double dx = p1.getX() - p0.getX();
double dy = p1.getY() - p0.getY();
double angleRadToX = Math.atan2(dy, dx);
// Align the area so that the line matches the x-axis
AffineTransform at = new AffineTransform();
at.rotate(-angleRadToX);
at.translate(-p0.getX(), -p0.getY());
Area aa = a.createTransformedArea(at);
// Compute the upper and lower halves that the area
// has to be intersected with
Rectangle2D bounds = aa.getBounds2D();
double half0minY = Math.min(0, bounds.getMinY());
double half0maxY = Math.min(0, bounds.getMaxY());
Rectangle2D half0 = new Rectangle2D.Double(
bounds.getX(), half0minY,
bounds.getWidth(), half0maxY-half0minY);
double half1minY = Math.max(0, bounds.getMinY());
double half1maxY = Math.max(0, bounds.getMaxY());
Rectangle2D half1 = new Rectangle2D.Double(
bounds.getX(), half1minY,
bounds.getWidth(), half1maxY-half1minY);
// Compute the resulting areas by intersecting
// the original area with both halves, and
// transform them back to their initial position
Area a0 = new Area(aa);
a0.intersect(new Area(half0));
Area a1 = new Area(aa);
a1.intersect(new Area(half1));
try
{
at.invert();
}
catch (NoninvertibleTransformException e)
{
// Always invertible
}
a0 = a0.createTransformedArea(at);
a1 = a1.createTransformedArea(at);
// Debugging output
if (g != null)
{
g.setColor(Color.GRAY);
g.draw(bounds);
g.setColor(Color.RED);
g.draw(aa);
g.setColor(Color.YELLOW.darker());
g.draw(half0);
g.setColor(Color.MAGENTA);
g.draw(half1);
g.setColor(Color.BLUE.darker());
g.fill(AffineTransform.getTranslateInstance(400, -20).
createTransformedShape(a0));
g.setColor(Color.BLUE.brighter());
g.fill(AffineTransform.getTranslateInstance(400, +20).
createTransformedShape(a1));
}
return new Area[] { a0, a1 };
}
Interesting question.
There are no methods that help you with this directly, but by calculating the bounding rectangle and intersecting with two opposing rectangles from your dividing line, you should be able to create such a method.
The general idea is to
Find the bounding rectangle of your original area: either getBounds() or getBounds2D().
Calculate two rectangles from your line that overlaps your area on both sides of the line. When doing this you will have to take several special cases into account (like is the line long enough, does it intersect the area at all, does the rectangles completely overlap each side of the original area, etc). The size of the rectangles should be decided by the bounding rectangle of your original area.
Get the two areas by intersecting each of the two rectangles with your original area, i.e. by using the intersect() method

Java Change shape of JPanel

I'm trying to do something which I'd think would be fairly easy but can't find a straight forward answer to. Basically I want to change a JPanel's default shape to a circular shape (or any other shape other than a rectangle).
You will need to provide your own custom painting routines.
The other problem you will have is getting the layout managers to work with it, but you can supply your own insets to provided an area within the panel that can safely used
You'll also want to make the component transparent, to allow the area outside the circle position of the component to be transparent.
Check out
Custom Painting
JCompnent#getInsets
You might need to also manipulate the clipping rectangle of the Graphics context. This is tricky and dangerous and if you can avoid it, I would.
Updated with example
public class CirclePaneTest {
public static void main(String[] args) {
new CirclePaneTest();
}
public CirclePaneTest() {
EventQueue.invokeLater(new Runnable() {
#Override
public void run() {
try {
UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
} catch (Exception ex) {
}
JFrame frame = new JFrame("Test");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.add(new TestPane());
frame.pack();
frame.setLocationRelativeTo(null);
frame.setVisible(true);
}
});
}
public class TestPane extends JPanel {
public TestPane() {
setBackground(Color.RED);
setLayout(new GridBagLayout());
CirclePane circlePane = new CirclePane();
JLabel label = new JLabel("This is a test");
label.setHorizontalAlignment(JLabel.CENTER);
label.setVerticalAlignment(JLabel.CENTER);
// This is a test to show the usable bounds
label.setBorder(new LineBorder(Color.RED));
circlePane.setLayout(new BorderLayout());
circlePane.add(label);
add(circlePane);
}
}
public class CirclePane extends JPanel {
public CirclePane() {
setOpaque(false);
}
#Override
public Dimension getPreferredSize() {
return new Dimension(200, 200);
}
protected int getRadius() {
// Determines the radius based on the smaller of the width
// or height, so we stay symmetrical
return Math.min(getWidth(), getHeight());
}
#Override
public Insets getInsets() {
int radius = getRadius();
int xOffset = (getWidth() - radius) / 2;
int yOffset = (getHeight() - radius) / 2;
// These are magic numbers, you might like to calculate
// your own values based on your needs
Insets insets = new Insets(
radius / 6,
radius / 6,
radius / 6,
radius / 6);
return insets;
}
#Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
int radius = getRadius();
int xOffset = (getWidth() - radius) / 2;
int yOffset = (getHeight() - radius) / 2;
Graphics2D g2d = (Graphics2D) g.create();
g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2d.setColor(getBackground());
g2d.fillOval(xOffset, yOffset, radius, radius);
g2d.setColor(Color.GRAY);
g2d.drawOval(xOffset, yOffset, radius, radius);
// This is test code to test the insets/usable area bounds...
// Insets insets = getInsets();
// g2d.drawRect(xOffset + insets.left,
// yOffset + insets.top,
// (xOffset + radius) - (insets.right + insets.left),
// (yOffset + radius) - (insets.bottom + insets.top));
g2d.dispose();
}
}
}
If you want only layout to be circle you can use circle layout:
class CircleLayout implements LayoutManager
{
public void addLayoutComponent(String name,
Component comp)
{}
public void removeLayoutComponent(Component comp)
{}
public void setSizes(Container parent)
{
if (sizesSet) return;
int n = parent.getComponentCount();
preferredWidth = 0;
preferredHeight = 0;
minWidth = 0;
minHeight = 0;
maxComponentWidth = 0;
maxComponentHeight = 0;
// compute the maximum component widths and heights
// and set the preferred size to the sum of
// the component sizes.
for (int i = 0; i < n; i++)
{
Component c = parent.getComponent(i);
if (c.isVisible())
{
Dimension d = c.getPreferredSize();
maxComponentWidth = Math.max(maxComponentWidth,
d.width);
maxComponentHeight = Math.max(maxComponentHeight,
d.height);
preferredWidth += d.width;
preferredHeight += d.height;
}
}
minWidth = preferredWidth / 2;
minHeight = preferredHeight / 2;
sizesSet = true;
}
public Dimension preferredLayoutSize(Container parent)
{
setSizes(parent);
Insets insets = parent.getInsets();
int width = preferredWidth + insets.left
+ insets.right;
int height = preferredHeight + insets.top
+ insets.bottom;
return new Dimension(width, height);
}
public Dimension minimumLayoutSize(Container parent)
{
setSizes(parent);
Insets insets = parent.getInsets();
int width = minWidth + insets.left + insets.right;
int height = minHeight + insets.top + insets.bottom;
return new Dimension(width, height);
}
public void layoutContainer(Container parent)
{
setSizes(parent);
// compute center of the circle
Insets insets = parent.getInsets();
int containerWidth = parent.getSize().width
- insets.left - insets.right;
int containerHeight = parent.getSize().height
- insets.top - insets.bottom;
int xcenter = insets.left + containerWidth / 2;
int ycenter = insets.top + containerHeight / 2;
// compute radius of the circle
int xradius = (containerWidth - maxComponentWidth) / 2;
int yradius = (containerHeight - maxComponentHeight) / 2;
int radius = Math.min(xradius, yradius);
// lay out components along the circle
int n = parent.getComponentCount();
for (int i = 0; i < n; i++)
{
Component c = parent.getComponent(i);
if (c.isVisible())
{
double angle = 2 * Math.PI * i / n;
// center point of component
int x = xcenter + (int)(Math.cos(angle) * radius);
int y = ycenter + (int)(Math.sin(angle) * radius);
// move component so that its center is (x, y)
// and its size is its preferred size
Dimension d = c.getPreferredSize();
c.setBounds(x - d.width / 2, y - d.height / 2,
d.width, d.height);
}
}
}
private int minWidth = 0;
private int minHeight = 0;
private int preferredWidth = 0;
private int preferredHeight = 0;
private boolean sizesSet = false;
private int maxComponentWidth = 0;
private int maxComponentHeight = 0;
}
You can use it like this:
class CircleLayoutFrame extends JFrame
{
public CircleLayoutFrame()
{
setTitle("CircleLayoutTest");
Container contentPane = getContentPane();
contentPane.setLayout(new CircleLayout());
contentPane.add(new JButton("Yellow"));
contentPane.add(new JButton("Blue"));
contentPane.add(new JButton("Red"));
contentPane.add(new JButton("Green"));
contentPane.add(new JButton("Orange"));
contentPane.add(new JButton("Fuchsia"));
contentPane.add(new JButton("Indigo"));
}
}
Read this article: http://docs.oracle.com/javase/tutorial/uiswing/misc/trans_shaped_windows.html
It shows in details how to create oval transparent windows. From the code [see How to Implement a Shaped Window section]:
Translucency:
TranslucentWindowDemo tw = new TranslucentWindowDemo();
// Set the window to 55% opaque (45% translucent).
tw.setOpacity(0.55f);
Oval:
Oval:addComponentListener(new ComponentAdapter() {
// Give the window an elliptical shape.
// If the window is resized, the shape is recalculated here.
#Override
public void componentResized(ComponentEvent e) {
setShape(new Ellipse2D.Double(0,0,getWidth(),getHeight()));
}
});
setUndecorated(true);
setSize(300,200);
Demo:
public ShapedWindowDemo() {
super("ShapedWindow");
setLayout(new GridBagLayout());
// It is best practice to set the window's shape in
// the componentResized method. Then, if the window
// changes size, the shape will be correctly recalculated.
addComponentListener(new ComponentAdapter() {
// Give the window an elliptical shape.
// If the window is resized, the shape is recalculated here.
#Override
public void componentResized(ComponentEvent e) {
setShape(new Ellipse2D.Double(0,0,getWidth(),getHeight()));
}
});
setUndecorated(true);
setSize(300,200);
setLocationRelativeTo(null);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
add(new JButton("I am a Button"));
}

Compass needle is drawn at wrong position

I am working on a compass in java. First I created a UI prototyp for my compass and created a working SSCCE of it, where you can click on the panel and the needle is pointed to another direction, which differs about 15 degree. This is the code:
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();
}
}
When I implement this panel into my application, the needle is not drawn as it is in the SSCCE. It is drawn a bit higher and on the left of the position it is meant to be. When I click on the panel and rotate the needle, the rotation works fine and the needle is painted where it belongs.
I add the panel like this to my application. The sensorPanel is a JPanel in a TabbedPane.
public JPanel createSensorPanel(){
sensorPanel = new JPanel(new MigLayout("fill, insets 3"));
CompassPanel compassPanel = new CompassPanel();
sensorPanel.add(compassPanel, "wrap");
return sensorPanel;
}
Why is the Polygon of the needle not drawn at the position it is drawn in the SSCCE?
EDIT:
Here is a picture of the problem.
If you look closer what's going on on your image, than you'll see, that affine transform is the problem.
Looks like that affine transforms are related to top parent not the current child component (see java Affine Transform correct order).
The quick and dirty solution would be to translate the arrow as the parents are translated (based on 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
But much more convenient would be some common solution, something like this one.

Categories