What you have do is make UI Buttons and Text resolutions dependent on screen in which your game is running,Instead of entering fixed values like
button.height=100;
button.width=50;
Instead Give value like this.
button.height=Gdx.graphics.getheight()/4;
button.width=Gdx.graphics.getwidth()/8;
if you follow the above code you can run your game in any device the buttons will look the same with out zooming in or zooming out.
Here is a small code example with a single button,I am using scene2d for setting stage and adding actor button
- Create a class start that extends the Game class and call setScreen
function to set screen to main menu
- MainMenu Class implements screen.It have stage that contains buttons
that also have on/off state ,An input listener is added to button to
handle touch inputs
You can find button.pack and new.fnt files from here
Start Class
public class Start extends Game{
public OrthographicCamera camera;
public SpriteBatch batch;
public BitmapFont font;
@Override
public void create() {
camera=new OrthographicCamera(Constants.width,Constants.width*Constants.aspectRatio);
batch=new SpriteBatch();
setScreen(new MainMenu(this));
}
}
MainMenu Class
public class MainMenu implements Screen{
Start game;
private Stage stage; //** stage holds the Button **//
private BitmapFont font;
private TextureAtlas buttonsAtlas; //** image of buttons **//
private Skin buttonSkin; //** images are used as skins of the button **//
private TextButton button;
public MainMenu(Start game)
{
this.game=game;
}
@Override
public void show() {
buttonsAtlas = new TextureAtlas("img/button/button.pack"); //**button atlas image **//
buttonSkin = new Skin();
buttonSkin.addRegions(buttonsAtlas); //** skins for on and off **//
font = new BitmapFont(Gdx.files.internal("font/new.fnt"),false); //** font **//
stage = new Stage(); //** window is stage **//
stage.clear();
Gdx.input.setInputProcessor(stage); //** stage is responsive **//
TextButtonStyle style = new TextButtonStyle(); //** Button properties **//
style.up = buttonSkin.getDrawable("buttonOff");
style.down = buttonSkin.getDrawable("buttonOn");
style.font = font;
button = new TextButton("START", style);
//** Button text and style **//
button.setHeight(Gdx.graphics.getHeight()/3); //** Button Height **//
button.setWidth(Gdx.graphics.getWidth()/4); //** Button Width **//
button.setPosition(Gdx.graphics.getWidth()/2-button.getWidth()/2, Gdx.graphics.getHeight());
button.addListener(new InputListener() {
public boolean touchDown (InputEvent event, float x, float y, int pointer, int button) {
Gdx.app.log("my app", "Pressed"); //** Usually used to start Game, etc. **//
// TODO Auto-generated method stub
return true;
}
public void touchUp (InputEvent event, float x, float y, int pointer, int button) {
Gdx.app.log("my app", "Rggggggeleased");
///and level
game.setScreen(new MyNextScreen(game));
dispose();
}
});
MoveToAction moveAction = new MoveToAction();//Add dynamic movement effects to button
moveAction.setPosition(Gdx.graphics.getWidth()/2-button.getWidth()/2, Gdx.graphics.getHeight()/2+ Gdx.graphics.getHeight()/6);
moveAction.setDuration(.5f);
button.addAction(moveAction);
stage.addActor(button);
}
@Override
public void render(float delta) {
// TODO Auto-generated method stub
Gdx.gl.glClearColor(1, 1, 1, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
stage.act();
game.batch.begin();
stage.draw();
game.batch.end();
}
@Override
public void resize(int width, int height) {
// TODO Auto-generated method stub
}
@Override
public void pause() {
// TODO Auto-generated method stub
}
@Override
public void resume() {
// TODO Auto-generated method stub
}
@Override
public void hide() {
// TODO Auto-generated method stub
}
@Override
public void dispose() {
// TODO Auto-generated method stub
}
}