您的位置：首页 > 移动开发 > Android开发

libgdx游戏引擎开发笔记（八）SuperJumper游戏例子的讲解（篇二）---- 游戏界面跳转

2013-08-02 09:39 711 查看
接着上一篇的讲解，今天我们来完成帮助和分数排行榜多界面的跳转，当然不会像是Activity之间跳转，那样会很卡的，具体怎么做我们往下看吧！

1.Help界面的跳转

1.1在上次的代码基础上，我们看到MainMenuScreen中在update()中留有注释的代码：

if (OverlapTester.pointInRectangle(playBounds, touchPoint.x, touchPoint.y)) {
//播放点击音效
Assets.playSound(Assets.clickSound);
//game.setScreen(new GameScreen(game));
return;
}
if (OverlapTester.pointInRectangle(highscoresBounds, touchPoint.x, touchPoint.y)) {
Assets.playSound(Assets.clickSound);
//game.setScreen(new HighscoresScreen(game));
return;
}
if (OverlapTester.pointInRectangle(helpBounds, touchPoint.x, touchPoint.y)) {
Assets.playSound(Assets.clickSound);
//game.setScreen(new HelpScreen(game));
return;
}


我们将HelpScreen的那行注释去掉，之后我们要完成的事情就是HelpScreen类的编写，显示帮助界面。（ 注：对于切换画面，这里的game被设置在Screen类的成员变量中，而实际的libgdx类库中，Screen 被做成了接口。也就是说，应当把对应的Game类的引用放在具体的Screen接口的实现类中，通过调用Game类的setScreen方法来切换游戏画面。可以看一下http://smallwoniu.blog.51cto.com/3911954/1255187，估计你就用该明白了它的机制了）


1.2HelpScreen类：


package com.zhf.mylibgdx;
import com.badlogic.gdx.Game;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.Screen;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.GLCommon;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.math.Rectangle;
import com.badlogic.gdx.math.Vector3;
/**
* 帮助界面一
* @author ZHF
*
*/
public class HelpScreen implements Screen {
Game game;
OrthographicCamera guiCam;  //相机
SpriteBatch batcher;  //用来绘画界面的

Rectangle nextBounds;  //下一个screen
Vector3 touchPoint;   //按下的触点
Texture helpImage;   //帮助界面图片
TextureRegion helpRegion;  //帮助界面区域
public HelpScreen(Game game) {
this.game = game;
//初始化了一个OrthographicCamera(正交相机)，并把宽度和高度设置为320*480，也就是屏幕的大小。随后将OrthographicCamera的位置，也就是position设置在屏幕的中点 (因为此为2D游戏，所以不需要考虑Z轴)
guiCam = new OrthographicCamera(320, 480);
guiCam.position.set(320 / 2, 480 / 2, 0);
nextBounds = new Rectangle(320 - 64, 0, 64, 64);
touchPoint = new Vector3();
batcher = new SpriteBatch();
helpImage = Assets.loadTexture("data/help1.png");  //加载图片资源到内存
helpRegion = new TextureRegion(helpImage, 0, 0, 320, 480);
}
/**刷新**/
public void update(float deltaTime) {
//检测捕获到按下位置
if (Gdx.input.justTouched()) {
guiCam.unproject(touchPoint.set(Gdx.input.getX(), Gdx.input.getY(),
0));
//点击切换到下一个界面
if (OverlapTester.pointInRectangle(nextBounds, touchPoint.x,
touchPoint.y)) {
Assets.playSound(Assets.clickSound);
//              game.setScreen(new HelpScreen2(game));  //切换到下一屏
return;
}
}
}
public void draw(float deltaTime) {
GLCommon gl = Gdx.gl;
gl.glClear(GL10.GL_COLOR_BUFFER_BIT);  //清屏
guiCam.update();
//设置绘画属性： 因为自定义了OrthographicCamera ，所以要将OrthographicCamera 的 投影矩阵传递给 batcher。在投影矩阵中是把得到的点击坐标弄成touchPoint向量，把得到的点击坐标，由左上为（0，0）的坐标系--》左下为（0，0）的坐标系。
batcher.setProjectionMatrix(guiCam.combined);
batcher.disableBlending();
batcher.begin();
batcher.draw(helpRegion, 0, 0, 320, 480);
batcher.end();
batcher.enableBlending();
batcher.begin();
batcher.draw(Assets.arrow, 320, 0, -64, 64);
batcher.end();
gl.glDisable(GL10.GL_BLEND);
}
/**系统会开启一个线程来不断的调用**/
@Override
public void render(float delta) {
update(delta);
draw(delta);
}
@Override
public void resize(int width, int height) {
}
@Override
public void show() {
}
@Override
public void hide() {
}
@Override
public void pause() {
helpImage.dispose();
}
@Override
public void resume() {
}
@Override
public void dispose() {
}
}
这样，我们的代码还不能运行，因为我们的帮助界面里有下一条的按钮，还需要修改Asset类：

声明：

public static TextureRegion arrow; //帮助下一条按钮区域
实例化：

//下一条按按钮
arrow = new TextureRegion(items, 0, 64, 64, 64);


ok! 在主菜单界面上点击Help已经成功实现跳转，接下来按下右下角的下一条，界面不会发生改变，为什么哪？

因为我们将一行代码注释掉了哦，现在我们取消注释，创建HelpScreen2,代码基本上没有改变，仅仅是在：
helpImage = Assets.loadTexture("data/help1.png");  //加载图片资源到内存
将图片help1改为help2，即可实现跳转。

再在：

game.setScreen(new HelpScreen2(game));  //切换到下一屏
将HelpScreen2改为HelpScreen3，同理，这样一直下去到[b]HelpScreen5，完成点击下一条切换帮助界面（这里有5张help图片，分别代表5个界面哦）！[/b]

1.3.在最后一屏[b][b]HelpScreen5[/b]我们将切换到下一屏的代码改到主菜单界面[/b]

game.setScreen(new MainMenuScreen(game));  //切换到下一屏


效果图：











ok！到此帮助界面的切换我们已经完成！！！

[b]2.排行榜界面的跳转[/b]

[b] 2.1.同理，首先放开MainMenuScreen中的那行注释：
[/b]

game.setScreen(new HighscoresScreen(game));


[b]2.2.HighscoresScreen类
[/b]

package com.zhf.mylibgdx;
import com.badlogic.gdx.Game;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.Screen;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.GLCommon;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.math.Rectangle;
import com.badlogic.gdx.math.Vector3;
/**
* 排行榜界面
* @author ZHF
*
*/
public class HighscoresScreen implements Screen {
Game game;
OrthographicCamera guiCam;
SpriteBatch batcher;
Rectangle backBounds;
Vector3 touchPoint;

String[] highScores;  //高分
float xOffset = 0;
public HighscoresScreen(Game game) {
this.game = game;
guiCam = new OrthographicCamera(320, 480);
guiCam.position.set(320 / 2, 480 / 2, 0);
backBounds = new Rectangle(0, 0, 64, 64);
touchPoint = new Vector3();
batcher = new SpriteBatch();
//实例化分数数组
highScores = new String[5];
for (int i = 0; i < 5; i++) {
highScores[i] = i + 1 + ". " + Settings.highscores[i];
//显示排行榜文字
xOffset = Math.max(Assets.font.getBounds(highScores[i]).width,
xOffset);
}
//分数显示位置
xOffset = 160 - xOffset / 2 + Assets.font.getSpaceWidth() / 2;
}
public void update(float deltaTime) {
if (Gdx.input.justTouched()) {
guiCam.unproject(touchPoint.set(Gdx.input.getX(), Gdx.input.getY(),
0));
//返回到主菜单界面
if (OverlapTester.pointInRectangle(backBounds, touchPoint.x,
touchPoint.y)) {
Assets.playSound(Assets.clickSound);
game.setScreen(new MainMenuScreen(game));
return;
}
}
}
public void draw(float deltaTime) {
GLCommon gl = Gdx.gl;
gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
guiCam.update();

batcher.setProjectionMatrix(guiCam.combined);
batcher.disableBlending();
batcher.begin();
batcher.draw(Assets.backgroundRegion, 0, 0, 320, 480);
batcher.end();
batcher.enableBlending();
batcher.begin();
//画出排行榜
batcher.draw(Assets.highScoresRegion, 10, 360 - 16, 300, 33);
//画出数组中的分数在对应的位置
float y = 230;
for (int i = 4; i >= 0; i--) {
Assets.font.draw(batcher, highScores[i], xOffset, y);
y += Assets.font.getLineHeight();
}
batcher.draw(Assets.arrow, 0, 0, 64, 64);
batcher.end();
}
@Override
public void render(float delta) {
update(delta);
draw(delta);
}
@Override
public void resize(int width, int height) {
}
@Override
public void show() {
}
@Override
public void hide() {
}
@Override
public void pause() {
}
@Override
public void resume() {
}
@Override
public void dispose() {
}
}
我们还需要在资源加载类Asset中添加几行代码：
声明：

public static BitmapFont font;  //文字
public static TextureRegion highScoresRegion;  //排行榜
实例化：

//分数
font = new BitmapFont(Gdx.files.internal("data/font.fnt"), Gdx.files.internal("data/font.png"), false);
//排行榜
highScoresRegion = new TextureRegion(Assets.items, 0, 257, 300,110/ 3);


再在Settings中实例化默认分数排行榜的值

//默认分数排行榜分数
public final static int[] highscores = new int[] {100, 80, 50, 30, 10};


注：这里的文字显示原理，清楚的可以看一下http://smallwoniu.blog.51cto.com/blog/3911954/1256054这篇应该就明白了！

[b] ok! 运行一下试试！发现可以实现跳转了！嘿嘿！
[/b]
[b]效果图：[/b]
[b]

[/b]

源代码下载：http://down.51cto.com/data/893990

顺便说一下，下一讲我们将接触游戏的主界面，里面包含了碰撞判断和点击区域判断，声音音效控制，游戏的一般框架等等，在这里还强调一下，这个游戏不包括舞台和演员这两个类，还需要通过其他的Demo来学习。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  游戏开发 Android libgdx superjumper游戏介绍 游戏开发框架
相关文章推荐
新的分享
章节导航