JPanel上的缩放图形调整大小 [英] Scale graphics on JPanel resize

问题描述

我正在为我的游戏创建一个菜单，当我重新调整JFrame的大小时，我在缩放图形方面遇到了一些问题。当JFrame以4：3的比例缩放时，一切看起来都很好。但是当比例不是4：3时，图像开始彼此重叠。我做的计算是我的paintComponent。

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"));	// 900x900
			
			images[1] = ImageIO.read(new File("res/1.png"));			// 500x100
			images[2] = ImageIO.read(new File("res/2.png"));			// 500x100
			images[3] = ImageIO.read(new File("res/3.png"));			// 500x100
			images[4] = ImageIO.read(new File("res/4.png"));			// 500x100
		}
		catch (IOException e)
		{
			e.printStackTrace();
		}
		
		jf = new JFrame();
		
		jf.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		jf.setBounds(100, 100, 816, 638);								// JPanel start dimention 800x600
		//jf.setBounds(100, 100, 1040, 806);
		//jf.setBounds(100, 100, 1168, 902);
		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();
	    
		// Background
		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;
		
	 // Image 1
	    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;
		
	 // Image 2
	    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;
		
	 // Image 3
	    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;
		
	 // Image 4
	    bbg.drawImage(images[ 4 ], x, y, width, height, this);
	    
	    
	g.drawImage(buff, 0, 0, this);
	}
}

< img alt =IMG示例src =https：// lh3 .googleusercontent.com / -Hsni_fqQqP8 / U19U3vHhYwI /AAAAAAAAANg/AkLrkHjzxZY / s816 / Game.png/>

< img alt =IMG示例src =https：//lh3.googleusercontent .com / -Er2g8Bglu2o / U19VDF4vwZI / AAAAAAAAANs / e4H9k_22-C4 / s1491 / Game2.png/>

<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" />

推荐答案

如果比率可能与<$ c不同$ c> 4：3 然后你必须在你的代码中使用实际比率而不是常数因子。



[更新]

如果 {ojw，ojh} 是 JPanel的旧维度和 {njw，njh} 是新的，然后每个控件都应按这种方式缩放：

If the ratio can be different from 4:3 then you have to use the actual ratio instead of constant factors, in your code.

[update]
if {ojw, ojh} are the old dimensions of the JPanel and {njw, njh} are the new ones, then every control should be scaled this way:

ncw = ocw * njw / ojw;
nch = och * njh / ojh;

（其中 {ncw，nch} 是控件的新尺寸， {ocw，och} 是旧的尺寸。

当然你必须缩放控件职位。

[/ update]

(where {ncw, nch} are the control new dimensions and {ocw, och} are the old ones)
Of course you have to scale the control positions too.
[/update]

这篇关于JPanel上的缩放图形调整大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！