1

I am new to libgdx and I am trying to do some stuff but I am facing a weird problem. Text is really small on desktop while it is normal on android. Here is screenshots:

Desktop: Ubuntu

Android: Android

and here is the code:

    public MainMenu(RTSGame game){
    this.game = game;

    stage = new Stage( new FitViewport( 1920, 1080 ));

    Table rootTable = new Table();
    rootTable.setFillParent(true);
    rootTable.setDebug(true, true);

    Table menuTable = new Table();
    rootTable.add(menuTable).expand().center().right();

    Skin skin = new Skin(Gdx.files.internal("data/uiskin.json"));

    TextButton singlePlayer = new TextButton("Single Player",skin);
    TextButton multiPlayer = new TextButton("Multi Player", skin);
    TextButton options = new TextButton("Options", skin);
    TextButton exit = new TextButton("Exit", skin);

    int x = 1080;
    int unit = x / 8;

    float scale = unit / singlePlayer.getHeight();

    float width = singlePlayer.getWidth() * scale;

    Label.LabelStyle style = new Label.LabelStyle();

    style.font = game.fontMenu;

    singlePlayer.getLabel().setStyle(style);
    multiPlayer.getLabel().setStyle(style);
    options.getLabel().setStyle(style);
    exit.getLabel().setStyle(style);

    float fontScale = 1f;

    if( singlePlayer.getLabel().getHeight() < unit )
        fontScale = (singlePlayer.getLabel().getHeight() / unit) * ( 1080 / stage.getHeight() );

    Gdx.app.log( "label", singlePlayer.getLabel().getHeight() + "" );
    Gdx.app.log( "unit", unit + "" );
    Gdx.app.log( "scale", fontScale + "");

    singlePlayer.getLabel().setFontScale(fontScale);
    multiPlayer.getLabel().setFontScale(fontScale);
    options.getLabel().setFontScale(fontScale);
    exit.getLabel().setFontScale(fontScale);

    menuTable.add( singlePlayer ).size( width,unit).right().row();
    menuTable.add( multiPlayer ).size( width,unit).right().row();
    menuTable.add( options ).size( width,unit).right().row();
    menuTable.add( exit ).size( width,unit).right().row();

    stage.addActor(rootTable);
}
Arda Kara
  • 501
  • 6
  • 24
  • 1
    Did you try anything, to change the font size ? Tell us about it. – kebs May 01 '15 at 20:38
  • I am scaling font to fit in button, it works on phone but not on desktop. It makes text smaller instead scaling it up – Arda Kara May 01 '15 at 20:41
  • 1
    `int x = 1080;` this is called a [magic number](http://en.wikipedia.org/wiki/Magic_number_%28programming%29#Unnamed_numerical_constants), and it has a smell. Are you sure about that value ? Shouldn't it be retrieved ? – kebs May 01 '15 at 20:45
  • I am using a viewport so I think it must be equal to height of viewport. Anyway it does nothing with fonts. What I am doing is get ratio of label size to button size and scale font to fit button. – Arda Kara May 01 '15 at 20:49
  • 1
    Allright, but then, shouldn't the `fontScale` be adapted to the terminal? (sorry, I have no particular knowledge on those tags). – kebs May 01 '15 at 21:16
  • Thanks for your help I have solved the problem. I will post the answer in a minute. – Arda Kara May 01 '15 at 21:20

1 Answers1

1

Firstly I have figured that I should use #getPrefHeight() instead of #getHeight(). Also it is a bad practise to use height for scaling. It is better to use ratio of width. Secondly I have corrected wrong aspect ratio with following code:

    if( width > singlePlayer.getLabel().getPrefWidth() && fontScale < 1f )
        fontScale = 1 / fontScale;

    if( width < singlePlayer.getLabel().getPrefWidth() && fontScale > 1f )
        fontScale = 1 / fontScale;

Here is the full code snippet:

    public MainMenu(RTSGame game){
    this.game = game;

    stage = new Stage( new FitViewport( 1920, 1080 ));

    Table rootTable = new Table();
    rootTable.setFillParent(true);
    rootTable.setDebug(true, true);

    Table menuTable = new Table();
    rootTable.add(menuTable).expand().center().right();

    Skin skin = new Skin(Gdx.files.internal("data/uiskin.json"));

    TextButton singlePlayer = new TextButton("Single Player",skin);
    TextButton multiPlayer = new TextButton("Multi Player", skin);
    TextButton options = new TextButton("Options", skin);
    TextButton exit = new TextButton("Exit", skin);

    int y = 1080;
    int unit = y / 8;

    float scale = unit / singlePlayer.getHeight();

    float width = singlePlayer.getWidth() * scale;

    Label.LabelStyle style = new Label.LabelStyle();

    style.font = game.fontMenu;

    singlePlayer.getLabel().setStyle(style);
    multiPlayer.getLabel().setStyle(style);
    options.getLabel().setStyle(style);
    exit.getLabel().setStyle(style);

    float fontScale = ( singlePlayer.getLabel().getPrefWidth() + 20 ) / width;

    Gdx.app.log( "label-height", singlePlayer.getLabel().getHeight() + "" );
    Gdx.app.log( "label-prefheight", singlePlayer.getLabel().getPrefHeight() + "" );
    Gdx.app.log( "unit", unit + "" );
    Gdx.app.log( "scale", fontScale + "");

    if( width > singlePlayer.getLabel().getPrefWidth() && fontScale < 1f )
        fontScale = 1 / fontScale;

    if( width < singlePlayer.getLabel().getPrefWidth() && fontScale > 1f )
        fontScale = 1 / fontScale;

    singlePlayer.getLabel().setFontScale(fontScale);
    multiPlayer.getLabel().setFontScale(fontScale);
    options.getLabel().setFontScale(fontScale);
    exit.getLabel().setFontScale(fontScale);

    Gdx.app.log( "label-scaled-height", singlePlayer.getLabel().getHeight() + "" );
    Gdx.app.log( "label-scaled-prefheight", singlePlayer.getLabel().getPrefHeight() + "" );

    menuTable.add( singlePlayer ).size( width,unit).right().row();
    menuTable.add( multiPlayer ).size( width,unit).right().row();
    menuTable.add( options ).size( width,unit).right().row();
    menuTable.add( exit ).size( width,unit).right().row();

    exit.addListener( new ClickListener(){
        @Override
        public void clicked(InputEvent event, float x, float y){
            Gdx.app.exit();
        }
    });

    Gdx.input.setInputProcessor( stage );

    stage.addActor(rootTable);
}
Arda Kara
  • 501
  • 6
  • 24