Android游戏开发框架Libgdx的使用(七)--常用控件
本文使用的libgdx是0.98版本,可能和最新版有一些不同地方。全文内容仅供参考。
作为Libgdx的开发者来说,演员是必须掌握的,这也是基础中的基础。libgdx将每一个可以实现一定动作和效果的东西,全部定义为演员。同时libgdx也提供了一些自带的演员,例如:标签,按钮,勾选框,下拉框,图片,输入框,列表,滑动面板,滑条,分割面板等等,这些都是演员,都是可以加入到舞台类中的,舞台这里先不做详细介绍,因为后面我会单独的给大家讲解下舞台类。演员类可以分为libgdx提供给我们的演员类,还有就是我们自己继承Actor然后自己写的演员类,下面我就针对这2中分类给大家介绍下libgdx中的演员类。
Libgdx游戏引擎(1群):187378034
Libgdx游戏引擎(2群):148848483
Libgdx游戏引擎(3群): 79168470
刚才也说道了libgdx也提供了一些自带的演员,像标签,按钮,勾选框,下拉框,图片,输入框,列表,滑动面板,滑条,分割面板等,这些都是引擎给我们做好的的演员,我们可以直接拿来用,不必自己写了。这些控件比较多,这里土豆就挑几个常用的控件给大家讲解下,我们选取按钮、标签、图片这3个给大家演示下用法。
1.标签(Lable)
API定义:文本标签,可以自动换行。
它不像大多数的scene2d.ui控件,标签可以进行缩放、旋转和设置起点。这些设置只影响画图的时候,而其他scene2d.ui部件将仍然使用标签未缩放时的状态。请注意,缩放或旋转标签都使用相对较少。
使用方法:从API中我们可以看到lable如果实例化出来的话,需要传入一个LabelStyle参数,否则是无法实现效果的,其实lable和LabelStyle一般都是配套使用的,当然了这是比较简单的方法,你也可以用Skin,这里面土豆就选泽用LabelStyle。
LabelStyle的使用:首先你需要创建一个hiero的.fnt和.png文件(如何创建请看土豆的教程三),例如土豆就是创建的“Potato.fnt”“Potato.png”,然后传入“Potato.fnt”和“Potato.png”和“Color”就构成了一个LabelStyle。
代码如下:
LabelStyle style;
font = new BitmapFont(Gdx.files.internal("data/Potato.fnt"),
Gdx.files.internal("data/Potato.png"),false);
style = new LabelStyle(font, font.getColor());
这样一个LabelStyle就实现了,下面就可以将这个当做参数传入了,可能初学的朋友觉得会有困难,其实就是几句话而已,背下来也无妨。下面就是初始化Lable了。咱们看下lable的API来详细了解他lable的参数:
Label(java.lang.CharSequence text, Label.LabelStyle style)
通过API可以看出,前面的参数是一个字符串,后面是一个lableStyle,然后第二个lable参数设置,第一个是字符串,第二个是一个skin类型的参数。lable自带了一些方法,比如设置旋转、拉伸、位置、大小等。由于lable控件是属于actor类,所以应该加入到舞台中去展示出来,关于舞台我会在后面详细给大家讲解,这里简单用一下舞台。
完整代码:
package com.me.mygdxgame;
import com.badlogic.gdx.ApplicationListener;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Color;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.Texture.TextureFilter;
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.Sprite;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.ui.Label;
import com.badlogic.gdx.scenes.scene2d.ui.Label.LabelStyle;
import com.badlogic.gdx.scenes.scene2d.ui.Skin;
import com.badlogic.gdx.scenes.scene2d.ui.Table;
public class MyGdxGame implements ApplicationListener {
Stage stage;
LabelStyle style;
BitmapFont font;
@Override
public void create() {
font = new BitmapFont(Gdx.files.internal("data/Potato.fnt"),
Gdx.files.internal("data/Potato.png"),false);
style = new LabelStyle(font, font.getColor());
stage = new Stage(480, 320, false);
Gdx.input.setInputProcessor(stage);
Label label1 = new Label("Hello, \n Potato",style);
label1.setPosition(50, 150);
label1.setFontScale(2);
label1.setColor(Color.GREEN);
stage.addActor(label1);
}
@Override
public void dispose() {
}
@Override
public void render() {
Gdx.gl.glClearColor(1, 1, 1, 1);
Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
stage.act();
stage.draw();
}
@Override
public void resize(int width, int height) {
}
@Override
public void pause() {
}
@Override
public void resume() {
}
}
效果图:
大家可能奇怪,这图片怎么也是一个控件呢?其实Image准确的来说确实不算控件,但是土豆觉得Android的API里面有一个Imageview的控件就是来负责图片处理的,在libgdx中的也提供了一个Image类,这个类也是负责处理图片的,所以土豆觉得这个也算是控件吧,但是请同学们记住Image是继承Actor的,他是可以直接add到舞台的。
API定义:在一个小范围内,显示和拉伸一个纹理。首选的的参数是负责尺寸的。仅当使用一个TextureRegionDrawable的演员时候才使用拉伸,旋转,和设置起点来赋值给所使用的图片。
stage.add(texture); stage.add(region);
Image控件其实比较简单,这里使用一些比较常用的功能,比如说给我舞台加一个背景、和在舞台内部画一个图片,这2种功能是比较常用的。 一般我们所使用的图片都是做好的,关于图片分辨率的问题土豆在第一节已经讲过,这里土豆就不赘述了,不懂的朋友可以去前面看看。下面我就将Image控件的集中常用的方法:旋转、拉伸、设置起点坐标、设置旋转中心、旋转角度、图片大小等给大家讲解下。一般来说关于Image的方法这几个就够了。
VictoriaImage.setColor(Color.PINK);颜色
VictoriaImage.setScale(0.5F);缩放比例
VictoriaImage.setPosition(230, 40);绘画起点
VictoriaImage.setOrigin(0, 0);//设置旋转中心
VictoriaImage.setRotation(45);旋转角度
VictoriaImage.setSize(390, 300); 绘画大小
完整代码:
package com.me.mygdxgame;
import com.badlogic.gdx.ApplicationListener;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Color;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.Texture.TextureFilter;
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.Sprite;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.ui.Label;
import com.badlogic.gdx.scenes.scene2d.ui.Label.LabelStyle;
import com.badlogic.gdx.scenes.scene2d.ui.Image;
import com.badlogic.gdx.scenes.scene2d.ui.Skin;
import com.badlogic.gdx.scenes.scene2d.ui.Table;
public class MyGdxGame implements ApplicationListener {
Stage stage;
Image VictoriaImage;
TextureRegion region;
Texture tex;
@Override
public void create() {
tex = new Texture(Gdx.files.internal("data/1.png"));
region =new TextureRegion(tex,0,0,512,512);
VictoriaImage = new Image(region);
VictoriaImage.setColor(Color.PINK);
VictoriaImage.setScale(0.5F);
VictoriaImage.setPosition(230, 40);
VictoriaImage.setOrigin(0, 0);//设置旋转中心
VictoriaImage.setRotation(45);
VictoriaImage.setSize(390, 300);
stage = new Stage(480, 320, false);
Gdx.input.setInputProcessor(stage);
stage.addActor(VictoriaImage);
}
@Override
public void dispose() {
}
@Override
public void render() {
Gdx.gl.glClearColor(1, 1, 1, 1);
Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
stage.act();
stage.draw();
}
@Override
public void resize(int width, int height) {
}
@Override
public void pause() {
}
@Override
public void resume() {
}
}
效果图:
3.按钮(Button)
按钮是游戏中常见的控件,libgdx说到底毕竟是一个做游戏的引擎,所以按钮是必备的。libgdx给了我们2个类作为按钮来使用,一个是Button,另一个是ImageButton。作为游戏开发者来说,默认给的Button确实难看了一些,做一些优美的button的话,土豆这里比较推荐ImageButton,而且大部分游戏都是这么做的。其实要是追根究底来说,imagebutton其实也是归于buttton里面的,但是这里主要讲imagebutton了,因为他比较常用,
下面我来介绍下ImageButton。
API定义:使用图像来显示图像的按钮。当按钮必须大于图像时这是有用的,这是图像中心就是按钮的中心。
使用方法:同样的button也是可以设置大小,起点坐标,旋转角度等等和上面的控件一样的。
ImageButton(Drawable imageUp, Drawable imageDown, Drawable imageChecked)
ImageButton(Skin skin)
上面这2种是常用的button的方法,这里我们选比较常用的传入TextureRegionDrawable来讲解下。如果使用ImageButton就必须说明一下这个Drawable类是怎么回事,这里简单讲解下。
Drawable类:在已知的一个给定的矩形内,绘制本身。它提供了边框的大小和最小尺寸,通过它自带的方法,可以确定的大小和位置。其实他就是为了image提供一个矩形区域,这里大家不要搞混淆,他只是提供区域,但是没有规定一定button必须画成矩形。我们使用下面这组图片作为button的image,这也是在网上随便找的
tex = new
Texture(Gdx.files.internal("data/control.png"));
TextureRegion[][] tmp = TextureRegion.split(tex,
120,120);
buttonUp = tmp[0][0];
buttonDown = tmp[0][1];
up = new TextureRegionDrawable(buttonUp);
down = new TextureRegionDrawable(buttonDown);
button = new ImageButton(up, down);
button.setPosition(100, 100);
这里的 TextureRegion[][] tmp = TextureRegion.split(tex,
120,120)可能有同学不是很理解,请读一下土豆的上一篇教程《动画类》就明白了,这里不解释了。关于TextureRegionDrawable他其实就是一个矩形,一个传入region的矩形,方便画图的,不必太过计较,有兴趣的话可以自己看下API,其实很简单的。
完整代码:
package com.me.mygdxgame;
import com.badlogic.gdx.ApplicationListener;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Color;
import com.badlogic.gdx.graphics.GL10;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.Texture.TextureFilter;
import com.badlogic.gdx.graphics.g2d.BitmapFont;
import com.badlogic.gdx.graphics.g2d.Sprite;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.scenes.scene2d.Stage;
import com.badlogic.gdx.scenes.scene2d.ui.ImageButton;
import com.badlogic.gdx.scenes.scene2d.ui.Label;
import com.badlogic.gdx.scenes.scene2d.ui.Label.LabelStyle;
import com.badlogic.gdx.scenes.scene2d.ui.Image;
import com.badlogic.gdx.scenes.scene2d.ui.Skin;
import com.badlogic.gdx.scenes.scene2d.ui.Table;
import com.badlogic.gdx.scenes.scene2d.utils.TextureRegionDrawable;
public class MyGdxGame implements ApplicationListener {
Stage stage;
TextureRegionDrawable up;
TextureRegionDrawable down;
TextureRegion buttonUp;
TextureRegion buttonDown;
Texture tex;
ImageButton button;
@Override
public void create() {
tex = new Texture(Gdx.files.internal("data/control.png"));
TextureRegion[][] tmp = TextureRegion.split(tex, 120,120);
buttonUp = tmp[0][0];
buttonDown = tmp[0][1];
up = new TextureRegionDrawable(buttonUp);
down = new TextureRegionDrawable(buttonDown);
button = new ImageButton(up, down);
button.setPosition(100, 100);
stage = new Stage(480, 320, false);
Gdx.input.setInputProcessor(stage);
stage.addActor(button);
}
@Override
public void dispose() {
}
@Override
public void render() {
Gdx.gl.glClearColor(1, 1, 1, 1);
Gdx.gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
stage.act();
stage.draw();
}
@Override
public void resize(int width, int height) {
}
@Override
public void pause() {
}
@Override
public void resume() {
}
}
PS:
大家可能看到模拟器上面的按钮看起来好像被拉伸了,这样按钮会不会很失败,请大家放心,将来在游戏中我们用相机后,这个问题就会自然解决的,所以不必担心。
效果图:
桌面调试图:
写在最后,关于libgdx的控件其实还有很多,由于篇幅的关系,土豆这里就不能一一赘述了,不过大家可以模仿这些控件的使用方法,去实现一些其他的控件,照葫芦画瓢,还是可以的。最近土豆也是比较忙,一个新的游戏项目要做,而且最近私事也是很多,导致昨天没有更新,土豆会尽量做到一天一更新的,但是如果慢了的话,还请大家理解,毕竟土豆也是有自己的生活的,开发知识土豆的业余兴趣而已。下一篇是是关于libgdx框架中《演员类》的博文,我会介绍下演员的使用。如果大家有什么问题可以加我QQ:316344618,一起讨论下。PS:偷偷告诉大家一个秘密,土豆最近又被喷了,这里我想对叼着烟蹲街头同学说“其实我把你看得很淡。”土豆还是会坚持写下去的,做到一天一更。
-----------奋斗小土豆丶
2013 年 4 月 16 日
转载于:https://www.cnblogs.com/WeYingKG/archive/2013/04/17/3025869.html