文章目录
- 一、前言
- 二、实现思路
- 三、实现方法
- 四、实现效果
- 五、参考代码
- 六、图片要求
- 七、总结
一、前言
刚好这周是学校的软件实训周,要做一个类似飞机大战的游戏,可是要实现更好效果的飞机大战游戏,难免会遇到一个问题,如何实现游戏背景图片的循环滚动和无缝连接呢?思考之后,便有了以下的方法,通过两张一样的图片实现图片的无缝连接循环滚动。
二、实现思路
假设有一张图片AB,图片AB如果想要实现无缝连接的循环滚动,那么每当图片AB向下滚动一段位移move,要想办法将向下移动move的末端图片(B)连接到图片的顶端(A),就如下图所示。
三、实现方法
用两张相同的图片,一张图片从图片顶端往下移动,另一张图片从图片底端往上移动,只要两张图片移动的速度一致,就能实现图片的无缝连接。
1.从图片顶端往下移动
2.从图片底端往上移动
四、实现效果
五、参考代码
注意g为Graphics对象,即画布。
private ImageIcon img=new ImageIcon("img/Background/1.png");
private int moveY=0; //从图片顶端向下滚动
private int moveYY=800;//从图片底端向上滚动,大小等于图片的长度
//如果移动超过图片的长度,则回到初始位置
moveY=(moveY>=800)?0:moveY;
moveYY=(moveYY<=0)?800:moveYY;
//图片从底端向上滚动
g.drawImage(img.getImage(),
getX(), getY(), //屏幕左上角坐标
getX()+300, getY()+400, //屏幕右下角坐标(“+”后面为窗体的大小)
0,moveYY, //图片左上角坐标
600,800+moveYY, //图片右下角坐标
null);
//图片从顶端向下滚动
g.drawImage(img.getImage(),
getX(), getY(), //屏幕左上角坐标
getX()+300, getY()+400, //屏幕右下角坐标
0,-moveY, //图片左上角坐标
600,800-moveY, //图片右下角坐标
null);
//移动位移!
moveY+=5;
moveYY-=5;
六、图片要求
为保证最佳的显示效果,最好选择上下或左右能衔接上的图片。
若图片衔接不上,可利用Photoshop等工具水平或垂直翻转后将两张图片拼接在一块即可。
七、总结
看似很简单的思路,想起来却并不容易。直接用一张图片也可以实现图片的循环滚动,但是好像无法实现图片的无缝连接,可能会出现以下三种情况:
1.屏幕的右下角坐标大于窗口的大小时,显示图片的一部分,图片移动一段时间后复位导致出现闪烁现象。
2.屏幕的右下角坐标等于窗口的大小时,显示整张图片,只要稍微移动就会出现空白的区域。
3.屏幕的右下角坐标小于窗口的大小时,显示整张图片,但图片小于窗口大小,周边出现大片空白区域。
更多推荐
如何用Java实现图片的无缝连接循环滚动
发布评论