# Thread: How Do You Rotate A 2D Image?

1. Member
Join Date
May 2013
Posts
10
Rep Power
0

## How Do You Rotate A 2D Image?

Hello, I have this slight predicament. I am stuck trying to rotate a 2D image clockwise and anti-clockwise, i have tried AffineTransform but that got me nowhere. I will thank anyone who can come up with a simple, yet effective way of rotating the image. The image that i would like to rotate is drawn using a *public void paint(Graphics g)*, bear in mind that i only want to rotate one image and not the background and foreground as well.

If possible I would like to be able to control the rotation of the image using the W and S buttons on the keyboard. (I have a action listener already set up).

Thank you for reading my post and i would love it if anyone could help!

2. Moderator
Join Date
Apr 2009
Posts
13,329
Rep Power
23

## Re: How Do You Rotate A 2D Image?

What code haveyou tried already that didn't work?

3. Member
Join Date
May 2013
Posts
10
Rep Power
0

## Re: How Do You Rotate A 2D Image?

Originally Posted by Tolls
What code haveyou tried already that didn't work?
public void paint1(Graphics g) {
Graphics2D g2 = (Graphics2D)g;
AffineTransform at;

at = new AffineTransform();
at.setToRotation(Math.PI / 4.0);
g2.setTransform(at);
g2.drawImage(plane, x, y, this);
}

The problem with this is that it rotates everything, not just my plane.png picture :(
Last edited by boxing_rex; 05-10-2013 at 04:28 PM.

4. ## Re: How Do You Rotate A 2D Image?

Set the transformation, draw your Image rotated and finally set the inverse transformation and do the rest of your drawing.

kind regards,

Jos

5. Member
Join Date
May 2013
Posts
10
Rep Power
0

## Re: How Do You Rotate A 2D Image?

How do I do that, sorry im kinda new to java :(

6. ## Re: How Do You Rotate A 2D Image?

Originally Posted by boxing_rex
How do I do that, sorry im kinda new to java :(
Rotating over and angle 'a' is the inverse of rotating over an angle '-a'.

kind regards,

Jos

7. Member
Join Date
May 2013
Posts
10
Rep Power
0

## Re: How Do You Rotate A 2D Image?

Jos-

Could you give me an example.. i just started yesterday

(Sorry for any inconvenience)

8. ## Re: How Do You Rotate A 2D Image?

First set the rotation: g2.rotate(theta);
Then draw your image on the Graphics2D surface g2
Finally rotate back: g2.rotate(-theta);

kind regards,

Jos

9. Member
Join Date
May 2013
Posts
10
Rep Power
0

10. ## Re: How Do You Rotate A 2D Image?

Originally Posted by boxing_rex
'theta' is the angle of rotation; you fill in the actual value; you don't do maths do you?

kind regards,

Jos

11. Member
Join Date
May 2013
Posts
10
Rep Power
0

## Re: How Do You Rotate A 2D Image?

Nope, and thanks alot !, how would i get this to work with my W and S keys, would i have to make an int and then replace the theta with the int name, then just increase / decrease the int in the button listeners ?

heres my code: (d is a "public Graphics d" variable);

public void paint(Graphics g) {

d.clearRect(0, 0, WIDTH * SCALE, HEIGHT * SCALE);
d.drawImage(background, 0, 0, this);
d.rotate(45);
d.drawImage(plane, x, y, this);
d.rotate(-45);
d.drawImage(foreground, 0, 0, this);
g.drawImage(offscreen, 0, 0, this);
}
Last edited by boxing_rex; 05-11-2013 at 10:26 AM.

12. ## Re: How Do You Rotate A 2D Image?

The rotate( ... ) method is defined in the Graphics2D class (it's a subclass of the Graphics class). You did it correct in your previous examples, but now you forgot the correct cast ...

kind regards,

Jos

ps. and please do read the API documentation for the Graphics and Graphics2D classes; programming without knowledge is doomed to fail.
Last edited by JosAH; 05-11-2013 at 10:37 AM.

13. Member
Join Date
May 2013
Posts
10
Rep Power
0

## Re: How Do You Rotate A 2D Image?

Thanks, but it still turns the whole frame(background,foreground and the plane) how do i get it to just turn the plane and nothing else?

14. ## Re: How Do You Rotate A 2D Image?

It can't turn a JFrame; you have to show us some of the (relevant) code.

kind regards,

Jos

15. Member
Join Date
May 2013
Posts
10
Rep Power
0

## Re: How Do You Rotate A 2D Image?

Ok :)

Frame Class :
import java.awt.Graphics;
import java.awt.Graphics2D;

import javax.swing.*;

public class Frame extends GameLoop {
private static final long serialVersionUID = 1L;
public int WIDTH = 80;
public int HEIGHT = 60;
public int SCALE = 10;

public Frame() {
setTitle("Operation: Sky Hawk");
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
setSize(WIDTH * SCALE, HEIGHT * SCALE);
setVisible(true);
setLocationRelativeTo(null);
setResizable(false);

th.start();
offscreen = createImage(WIDTH * SCALE, HEIGHT * SCALE);
d = offscreen.getGraphics();
}

public void paint(Graphics g) {
Graphics2D g2 = (Graphics2D)g;

d.clearRect(0, 0, WIDTH * SCALE, HEIGHT * SCALE);
d.drawImage(background, 0, 0, this);
g2.rotate(45);
d.drawImage(plane, x, y, this);
g2.rotate(-45);
d.drawImage(foreground, 0, 0, this);
g.drawImage(offscreen, 0, 0, this);
}

public void update(Graphics g) {
paint(g);
}

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

GameLoop Class:

import java.awt.*;
import java.awt.event.*;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;

import javax.imageio.ImageIO;
import javax.swing.JFrame;

public class GameLoop extends JFrame implements Runnable, KeyListener {

private static final long serialVersionUID = 1L;

public int x, y;
public int accel;
public int speed = 2;
public int counter;

public BufferedImage background, foreground, f1, f2, f3, f4, plane;
public Image offscreen;
public Graphics d;

public boolean up, down, left, right, fire;

public double counter2 = 4;

public void run() {
x = 100;
y = 512;
try {
} catch (IOException e1) {
e1.printStackTrace();
}
plane = f1;
while (true) {
counter++;
if (accel <= 0) {
accel = 0;
}
if (accel >= 150) {
accel = 150;
}
System.out.println(accel);
if (counter >= 15)
counter = 0;
if (counter <= 5 && fire == true)
plane = f1;
if (counter >= 5 && counter <= 10 && fire == true)
plane = f2;
if (counter <= 10 && counter >= 5 && fire == true)
plane = f3;
if (counter >= 10 && counter <= 15 && fire == true)
plane = f4;

if (left == true) {
x += speed;
if (accel <= 80) {
y++;
}
}
if (right == true) {
x += accel / 17;
if (accel >= 80) {
y--;
}
}
if (up == true) {
}
if (down == true) {
}

if (y >= 512)
y = 512;
repaint();
try {
} catch (InterruptedException e) {
e.printStackTrace();
}

}
}

public void keyPressed(KeyEvent e) {
System.out.println(accel);
if (e.getKeyCode() == KeyEvent.VK_A) {
left = true;
accel--;
}
if (e.getKeyCode() == KeyEvent.VK_D) {
right = true;
accel++;
}
if (e.getKeyCode() == KeyEvent.VK_W) {
up = true;
}
if (e.getKeyCode() == KeyEvent.VK_S) {
down = true;
}
if (e.getKeyCode() == KeyEvent.VK_SPACE) {
fire = true;
}
}

public void keyReleased(KeyEvent e) {
if (e.getKeyCode() == KeyEvent.VK_A)
left = false;
plane = f1;
if (e.getKeyCode() == KeyEvent.VK_D)
right = false;
plane = f1;
if (e.getKeyCode() == KeyEvent.VK_W)
up = false;
plane = f1;
if (e.getKeyCode() == KeyEvent.VK_S)
down = false;
plane = f1;
if (e.getKeyCode() == KeyEvent.VK_SPACE)
fire = false;
plane = f1;

}

public void keyTyped(KeyEvent e) {

}

}

Probably not the best code you have seen :D

16. ## Re: How Do You Rotate A 2D Image?

What's that stuff about rotating on g2 and drawing on d?

kind regards,

Jos

17. Member
Join Date
May 2013
Posts
10
Rep Power
0

## Re: How Do You Rotate A 2D Image?

if i draw the plane on g2 i doesnt show up, so i drew it on d to see if it would make a difference.

18. Member
Join Date
May 2013
Posts
10
Rep Power
0

## Re: How Do You Rotate A 2D Image?

I tried drawing it on g2, and it wouldn't show... got any ideas on how to fix it ?
Last edited by boxing_rex; 05-11-2013 at 08:50 PM.