Introduction: Using Java to Rotate an Object to Face the Mouse
If you have ever used Java's 2D API you probably have wanted to know how to make a character face your mouse. So you got on google and looked it up and guess what? THERE ARE NO RELEVANT RESULTS! Ah. So I spent an hour figuring out how to use trig to do just this in Java.
Step 1: Build a Simple Game
Ok simply use Java to make a JFrame called mainFrame. I made it its own class but you dont have to. Next make a Paint class. It should read-
import java.awt.*;
import javax.swing.*;
import java.awt.image.*;
import javax.imageio.*;
import java.io.*;
public class Paint extends JPanel {
@Override
public void paintComponent(Graphics g) {
Graphics2D g2 = (Graphics2D)g;
g2.setColor(Color.WHITE);
g2.fillRect(0, 0, this.getSize().width, this.getSize().height);
g2.drawImage(getBaseImage(), 235, 200,null);
g2.setColor(Color.black);
g2.drawLine(250, 215,(int)mainFrame.littleX+250, (int)mainFrame.littleY+215);
}
public BufferedImage getBaseImage(){
BufferedImage Img = null;
try {
Img = ImageIO.read(new File("/*PICTURE FILE-NAME*/"));
} catch (IOException e) {
System.err.println(e);
}
return Img;
}
//this method is optional and just adds a pic to the file
}
Create a global variable that reads-
public static javax.swing.JPanel jPanel1;
Next, on the mainFrame add the JPanel and make it the same size as the JFrame.
Set it equal to new Paint();
ie... jPanel1=new Paint();
(this code won't work quite yet so don't panic if you get a ton of errors)
import java.awt.*;
import javax.swing.*;
import java.awt.image.*;
import javax.imageio.*;
import java.io.*;
public class Paint extends JPanel {
@Override
public void paintComponent(Graphics g) {
Graphics2D g2 = (Graphics2D)g;
g2.setColor(Color.WHITE);
g2.fillRect(0, 0, this.getSize().width, this.getSize().height);
g2.drawImage(getBaseImage(), 235, 200,null);
g2.setColor(Color.black);
g2.drawLine(250, 215,(int)mainFrame.littleX+250, (int)mainFrame.littleY+215);
}
public BufferedImage getBaseImage(){
BufferedImage Img = null;
try {
Img = ImageIO.read(new File("/*PICTURE FILE-NAME*/"));
} catch (IOException e) {
System.err.println(e);
}
return Img;
}
//this method is optional and just adds a pic to the file
}
Create a global variable that reads-
public static javax.swing.JPanel jPanel1;
Next, on the mainFrame add the JPanel and make it the same size as the JFrame.
Set it equal to new Paint();
ie... jPanel1=new Paint();
(this code won't work quite yet so don't panic if you get a ton of errors)
Step 2: Add the Trig Code
Now we must add a mouse motion listener. When the mouse is moved you want it to store the mouse x in int mX, same with mouse y in mY.
private void jPanel1MouseMoved(java.awt.event.MouseEvent evt) {
// TODO add your handling code here:
mX=evt.getX();//mouse X
mY=evt.getY();//mouse Y
now we add the trig-
private void jPanel1MouseMoved(java.awt.event.MouseEvent evt) {
// TODO add your handling code here:
mX=evt.getX();//mouse X
mY=evt.getY();//mouse Y
double Xd =(mX-250); //Get x distance from gun to mouse
double Yd =mY-215; //Get y distance from gun to mouse
double radAngle = Math.atan(Yd/Xd); //Use atan to calculate the angle
if(mX>=250){
littleY= Math.sin(radAngle)*15;
littleX=Math.cos(radAngle)*15;
}else{
littleY= Math.sin(radAngle)*-15;
littleX=Math.cos(radAngle)*-15;
}
paint.repaint();
}
wow. Now it should be fairly simple to change the line to something like a picture. Good luck.
private void jPanel1MouseMoved(java.awt.event.MouseEvent evt) {
// TODO add your handling code here:
mX=evt.getX();//mouse X
mY=evt.getY();//mouse Y
now we add the trig-
private void jPanel1MouseMoved(java.awt.event.MouseEvent evt) {
// TODO add your handling code here:
mX=evt.getX();//mouse X
mY=evt.getY();//mouse Y
double Xd =(mX-250); //Get x distance from gun to mouse
double Yd =mY-215; //Get y distance from gun to mouse
double radAngle = Math.atan(Yd/Xd); //Use atan to calculate the angle
if(mX>=250){
littleY= Math.sin(radAngle)*15;
littleX=Math.cos(radAngle)*15;
}else{
littleY= Math.sin(radAngle)*-15;
littleX=Math.cos(radAngle)*-15;
}
paint.repaint();
}
wow. Now it should be fairly simple to change the line to something like a picture. Good luck.