Thread: Image rotation problem, plz help

1. Member
Join Date
Feb 2011
Posts
5
Rep Power
0

Image rotation problem, plz help

hey guys,

i have 2 problems with my rotating image, first when it rotates it is not a smooth rotation meaning the lines aren't very straight when the image is at an angle and 2nd when the image is rotated 180 degrees (pi radians) it has a vertical displacement by 1 pixel upwards i believe.

what i have is basically a stick rotating around the center of an oval, the stick rotates according to the mouse position. i set an anchor point for the rotation but i still have this vertical displacement at 180 deg, anything im doing wrong? here are my paint and MouseMoved methods, any help would be greatly appreciated, thx..

public void paintComponent(Graphics g){
super.paintComponent(g);
g.drawImage(Ball.i,cBall.x,cBall.y,null);
Graphics2D g2 = (Graphics2D)g;
g2.transform(AffineTransform.getRotateInstance(the ta, Ball.x+6, Ball.y+6));
g2.drawImage(cue,cuex,cuey,null);

}
public void mouseMoved(MouseEvent e) {
o =-e.getY()+ cBall.y+6 ;
a =-e.getX() + cBall.x+6 ;
theta = Math.atan2(o, a);
repaint();
}
Last edited by brigadier90; 02-23-2011 at 11:13 AM.

2. the lines aren't very straight when the image is at an angle
Cast the Graphics to Graphics2D and apply an appropriate RenderingHints.KEY_ANTIALIASING

when the image is rotated 180 degrees (pi radians) it has a vertical displacement by 1 pixel upwards i believe
For an odd pixel height, an even pixel height, or both?

And you can confirm this, no need to 'believe' -- just take two screenshots and compare them.

db

3. Member
Join Date
Feb 2011
Posts
5
Rep Power
0
its already cast to graphics2D, and i already tried that, this is the code i used:
...
Graphics2D g2 = (Graphics2D)g;
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASIN G,RenderingHints.VALUE_ANTIALIAS_ON);
g2.transform(AffineTransform.getRotateInstance(the ta, Ball.x+6, Ball.y+6));
g2.drawImage(cue,cuex,cuey,null);...

still not smooth.

as for the offset heres the full explanation:

the ball is 13 pixels in diameter and the cue is 3 pixels thick and initially the cue is is at y = ball.y + 5 (pointing at the center of the ball),and x =ball.x+6 when it rotates 180 degrees aropund the ball the cue is one or maybe more pixels higher on the screen, technically its lower cause of the inverted y axis on java but on the screen its higher, the anchor point for the rotation is at the center of the ball(ball.x+6, ball.y+6), but when it rotates there is an offset. i just cant seem to figure out why, if i knew the reason i could work around it but im inda stuck. any ideas?

thanks a lot for replying and taking time to see this.

4. I suggest you post an SSCCE so that members here can run the code and see your problem. Make sure the code doesn't depend on any image file or other resource that we won't have access to.

SSCCE : Java Glossary

db

5. Member
Join Date
Feb 2011
Posts
5
Rep Power
0
here is the SSCCE, instead of the images i drew and oval and a rect, the lines on the rect (stick) are straight now, but when i use the drawpic method the rendering hints dnt work.

Java Code:
```import java.awt.*;
import java.awt.event.*;
import java.awt.geom.AffineTransform;
import javax.swing.*;

public class SSCCE extends JPanel   {

public SSCCE(){

Handler handler = new Handler();
Ballx = 200;
Bally = 200;
stickx = Ballx+6;
sticky = Bally+5;

}

public void paintComponent(Graphics g){

super.paintComponent(g);
g.fillOval(Ballx, Bally, 13, 13);
Graphics2D g2 = (Graphics2D)g;
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
g2.transform(AffineTransform.getRotateInstance(theta, Ballx+6, Bally+6));
g2.setColor(Color.red);
g2.fillRect(stickx,sticky,200,3);
}

private class Handler implements MouseMotionListener{

public void mouseMoved(MouseEvent e) {
o =-e.getY()+ Bally+6  ;
a =-e.getX()  + Ballx+6  ;
theta = Math.atan2(o, a);
repaint();
}

public void mouseDragged(MouseEvent e) {}
}

double o; // used for stick rotation
double a; //used for stick rotation
double theta; // rotates stick
private int stickx;
private int sticky;
private int Ballx;
private int Bally;

public static void main(String args[]){
JFrame f = new JFrame("SSCCE");
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.setSize(500,500);
f.setVisible(true);
SSCCE s = new SSCCE();
}

}```
again thx for taking a look and thx in advance for any help.

6. Member
Join Date
Jan 2013
Posts
1
Rep Power
0

Re: Image rotation problem, plz help

Hello there!

This is my first post here.
I noticed that this is an old thread, but since I am working on something similar I thought I might share my work anyway .

Java Code:
```import java.awt.*;
import java.awt.event.*;
import java.awt.geom.AffineTransform;
import java.awt.geom.Rectangle2D;
import java.awt.image.BufferedImage;
import java.io.File;
import javax.imageio.ImageIO;
import javax.swing.*;

public class SSCCE extends JPanel {

public SSCCE() {
try {
} catch (Exception ex) {
ex.printStackTrace(System.out);
}
Handler handler = new Handler();
Ballx = 200;
Bally = 200;
ballW = 20;
ballH = 20;
ballHalfW = ballW/2;
ballHalfH = ballH/2;
stickWidth = 3;
stick = new Rectangle2D.Double(Ballx + ballHalfW - stickWidth/2, Bally + ballHalfH - stickWidth/2, 200, stickWidth);
}

@Override
public void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D) g;
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);

g.fillOval(Ballx, Bally, 20, 20);
g2.transform(AffineTransform.getRotateInstance(theta-Math.PI, Ballx + 10, Bally + 10));
g2.setColor(Color.red);
g2.fill(stick);
if(image!=null) {
g2.drawImage(image, null, (int)(stick.x + ballHalfW + 5), (int)(stick.y - image.getHeight()/2));
}
}

private class Handler implements MouseMotionListener {

@Override
public void mouseMoved(MouseEvent e) {
o = -e.getY() + Bally + 10;
a = -e.getX() + Ballx + 10;
System.out.println(o + " " + a);
theta = Math.atan2(o, a);
//stick.setRect(Ballx + ballHalfW - stickWidth/2, Bally + ballHalfH - stickWidth/2, 200, 3);
//no need for that since you are rotating the houl perspective anyway
repaint();
}

@Override
public void mouseDragged(MouseEvent e) {
}
}
BufferedImage image = null;
double o; // used for stick rotation
double a; //used for stick rotation
double theta; // rotates stick
double ballW, ballH;//width and height of the ball
double ballHalfW, ballHalfH;//half of the ball width and height for convenience and efficiency
final double stickWidth;//the width of the stick
private Rectangle2D.Double stick;//the actual stick
private int Ballx;
private int Bally;

public static void main(String args[]) {
JFrame f = new JFrame("SSCCE");
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f.setSize(500, 500);
SSCCE s = new SSCCE();
f.setVisible(true);
}
}```
The image used was:

Replace "Path_To_Stick.png" with your image location.

I hope this is what you were looking for and that it might help others.

Also please take note it is impossible to draw the image at double coordinates like this... so to do that you need to do something like this:

Java Code:
```TexturePaint texturePaint = new TexturePaint(image, stick);
g2.setPaint(texturePaint);
g2.fill(stick);```
I am also going to give everyone a tip! Please look into thumbnailator. It saves time and it is amaisingly convenient for image manipulation.
Last edited by Some1; 01-15-2013 at 01:15 AM.