I'm creating a menu for my game and I'm having a bit of a problem scaling my graphics when I re-size my JFrame. When the JFrame is scaled in a 4:3 ratio everything looks fine. But when the scale is not 4:3 the images starts to overlap each other. I do the calculations is my paintComponent.
import java.awt.Graphics;
import java.awt.Image;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import javax.imageio.ImageIO;
import javax.swing.JFrame;
import javax.swing.JPanel;
public class Driver extends JPanel
{
private static final long serialVersionUID = 1L;
BufferedImage buff;
Image images[] = new Image[6];
JFrame jf;
public static void main(String[] args)
{
Driver me = new Driver();
me.start();
}
public void start()
{
try
{
images[0] = ImageIO.read(new File("res/Background.png"));
images[1] = ImageIO.read(new File("res/1.png"));
images[2] = ImageIO.read(new File("res/2.png"));
images[3] = ImageIO.read(new File("res/3.png"));
images[4] = ImageIO.read(new File("res/4.png"));
}
catch (IOException e)
{
e.printStackTrace();
}
jf = new JFrame();
jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
jf.setBounds(100, 100, 816, 638);
jf.add(this);
jf.setVisible(true);
}
public void paintComponent(Graphics g)
{
buff = new BufferedImage(jf.getWidth(), jf.getHeight(), BufferedImage.TYPE_INT_RGB);
Graphics bbg = buff.getGraphics();
bbg.drawImage(images[ 0 ], 0, 0, this.getWidth(), this.getHeight(), this);
int width = ( this.getWidth() / 8 ) * 6;
int height = ( this.getWidth() / 15 ) * 2;
int x = (this.getWidth() - width) / 2;
int y = (this.getHeight() / 15) * 3;
bbg.drawImage(images[ 1 ], x, y, width, height, this);
width = ( this.getWidth() / 8 ) * 6;
height = ( this.getWidth() / 15 ) * 2;
x = (this.getWidth() - width) / 2;
y = (this.getHeight() / 15) * 6;
bbg.drawImage(images[ 2 ], x, y, width, height, this);
width = ( this.getWidth() / 8 ) * 6;
height = ( this.getWidth() / 15 ) * 2;
x = (this.getWidth() - width) / 2;
y = (this.getHeight() / 15) * 9;
bbg.drawImage(images[ 3 ], x, y, width, height, this);
width = ( this.getWidth() / 8 ) * 6;
height = ( this.getWidth() / 15 ) * 2;
x = (this.getWidth() - width) / 2;
y = (this.getHeight() / 15) * 12;
bbg.drawImage(images[ 4 ], x, y, width, height, this);
g.drawImage(buff, 0, 0, this);
}
}
<img alt="IMG example" src="https://lh3.googleusercontent.com/-Hsni_fqQqP8/U19U3vHhYwI/AAAAAAAAANg/AkLrkHjzxZY/s816/Game.png" />
<img alt="IMG example" src="https://lh3.googleusercontent.com/-Er2g8Bglu2o/U19VDF4vwZI/AAAAAAAAANs/e4H9k_22-C4/s1491/Game2.png" />