2
votes

I want to use TextButton for my custom made buttons but this requires me to (re)position the text or Label within that TextButton. I have tried some options but i am pretty stuck.

//this seems straightforward but nothing changes.
final TextButton b = new TextButton("LABEL", skin);
b.getLabel().setPosition(100, -20);

//Read somewhere about adding new children to buttons but no success either.
final TextButton b = new TextButton("OLD LABEL", skin);
b.clearChildren();
Label l = new Label("NEW LABEL", skin);
l.setPosition(400, 600);
b.add(l);

b.layout(); // Does not help either.

I am adding the Button straight into the Stage without a table for what it matters. Anyone has some ideas on this?

enter image description here

2
Button is a Table subclass. Instead of trying to reposition the inner label directly, maybe just call textButton.top().right().padTop(20).padRight(20);. If that doesn't work, maybe a 9-patch would help. - Tenfour04
If you need the rectangular area to expand to various sizes depending on the String, look into using a 9-patch for the background. Actually, a 9-patch alone might solve this problem. In the Android UI, a 9-patch can define which part of the image extends beyond the area that text will go. Not sure if it behaves the same way in Libgdx. - Tenfour04
Have a look here: javagamexyz.blogspot.de/2013/05/… probably you can find something useful. This method can be useful for you in the src code on that page: public void addButton(String label, String secondaryLabel, ChangeListener listener, boolean active) ....I managed to have correct label positionin [both x and y], I can post some code if required... - dawez

2 Answers

0
votes

Solution is easy:

final TextButton b = new TextButton("LABEL", skin);
b.getLabelCell().padBottom(xxx);
0
votes

the texbutton is a button to which they added a label in the constructor,

label = new Label(text, new LabelStyle(style.font, style.fontColor));
label.setAlignment(Align.top);
add(label).expand().fill();

first is that there is, or do not see any method to change the alignment of the label.

label.setAlignment(Align.top);

on the other hand to the label was added to a new cell, the actor,

add(label).expand().fill();

knowing that the only thing that occurred to me was to implement some houses remained as I show is not very fine but I think you will

import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Color;
import com.badlogic.gdx.graphics.g2d.Batch;
import com.badlogic.gdx.graphics.g2d.BitmapFont;

import com.badlogic.gdx.scenes.scene2d.ui.Button;
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.utils.Align;
import com.badlogic.gdx.scenes.scene2d.utils.Drawable;
import com.esotericsoftware.tablelayout.Cell;


public class LabelButton extends Button {

    private final Label label;
    private TextButtonStyle style;
    private float widthButton, heightButton;

    public LabelButton (String text, Skin skin) {
        this(text, skin.get(TextButtonStyle.class));
        setSkin(skin);
    }
    //NEW CODE1 FOR ADD, NEW CLASS EXTENDS BUTTON, OTHER CODE EQUALS TEXTBUTTON.
    /** @param boolean alignament: false desactiva la alineación al centro, x e y son las coordenadas donde se mostrar el texto del label. 
      * <p>
      * xLabel, e yLabel tienen su pivote en el centro del texto, asi que las posiciones son basadas respecto a esto.
      * <p>
      * las variables float widthButton, y float heightButton, referidos a el boton.
      * <p>
      * boolean alignament: false deactivate center alignment, x and y are the coordinates where show the text label. 
      * <p> 
      * xLabel, ylabel and have its pivot in the center of the text, so the positions are based on this.
      * <p>
      * las variables widthButton float and float heightButton, referring to the button
      */

    public LabelButton (String text, Skin skin, boolean alignament, float xLabel, float yLabel, float widthButton, float heightButton) {
        this(text, skin.get(TextButtonStyle.class), alignament, xLabel, yLabel, widthButton, heightButton);
        setSkin(skin);
    }
    //END NEW CODE1

    public LabelButton (String text, Skin skin, String styleName) {
        this(text, skin.get(styleName, TextButtonStyle.class));
        setSkin(skin);
    }

    public LabelButton (String text, TextButtonStyle style) {
        super();
        setStyle(style);
        this.style = style;
        label = new Label(text, new LabelStyle(style.font, style.fontColor));
        label.setAlignment(Align.top);
        add(label).expand().fill();
        setSize(getPrefWidth(), getPrefHeight());
    }
    //NEW CODE2 FOR ADD, NEW CLASS EXTENDS BUTTON, OTHER CODE EQUALS TEXTBUTTON.
    /** @param boolean alignament: false desactiva la alineación al centro, x e y son las coordenadas donde se mostrar el texto del label. 
      * <p>
      * xLabel, e yLabel tienen su pivote en el centro del texto, asi que las posiciones son basadas respecto a esto.
      * <p>
      * las variables float widthButton, y float heightButton, referidos a el boton.
      * <p>
      * boolean alignament: false deactivate center alignment, x and y are the coordinates where show the text label. 
      * <p> 
      * xLabel, ylabel and have its pivot in the center of the text, so the positions are based on this.
      * <p>
      * las variables widthButton float and float heightButton, referring to the button
      */

    public LabelButton (String text, TextButtonStyle style, boolean alignament, float xLabel, float yLabel, float widthButton, float heightButton) {
        super();
        setStyle(style);
        this.style = style;
        label = new Label(text, new LabelStyle(style.font, style.fontColor));
        if (alignament == true){
            label.setAlignment(Align.top);
            add(label).expand().fill();
        }else{
            this.heightButton = heightButton;
            this.widthButton = widthButton;
            add(label).padRight(widthButton - (xLabel * 2)).padBottom(-heightButton + (yLabel * 2));        
        }

        setSize(getPrefWidth(), getPrefHeight());

    }

    public void setCoordenadasLabel(float xLabel, float yLabel){
        getCell(label).padRight(widthButton - (xLabel * 2)).padBottom(-heightButton + (yLabel * 2));
    }
    //END NEW CODE2

    public void setStyle (ButtonStyle style) {
        if (style == null) {
            throw new NullPointerException("style cannot be null");
        }
        if (!(style instanceof TextButtonStyle)) throw new IllegalArgumentException("style must be a TextButtonStyle.");
        super.setStyle(style);
        this.style = (TextButtonStyle)style;
        if (label != null) {
            TextButtonStyle textButtonStyle = (TextButtonStyle)style;
            LabelStyle labelStyle = label.getStyle();
            labelStyle.font = textButtonStyle.font;
            labelStyle.fontColor = textButtonStyle.fontColor;
            label.setStyle(labelStyle);
        }
    }

    public TextButtonStyle getStyle () {
        return style;
    }

    public void draw (Batch batch, float parentAlpha) {
        Color fontColor;
        if (isDisabled() && style.disabledFontColor != null)
            fontColor = style.disabledFontColor;
        else if (isPressed() && style.downFontColor != null)
            fontColor = style.downFontColor;
        else if (isChecked() && style.checkedFontColor != null)
            fontColor = (isOver() && style.checkedOverFontColor != null) ? style.checkedOverFontColor : style.checkedFontColor;
        else if (isOver() && style.overFontColor != null)
            fontColor = style.overFontColor;
        else
            fontColor = style.fontColor;
        if (fontColor != null) label.getStyle().fontColor = fontColor;
        super.draw(batch, parentAlpha);
    }

    public Label getLabel () {
        return label;
    }

    public Cell getLabelCell () {
        return getCell(label);
    }

    public void setText (String text) {
        label.setText(text);
    }

    public CharSequence getText () {
        return label.getText();
    }

    /** The style for a text button, see {@link TextButton}.
     * @author Nathan Sweet */
    static public class TextButtonStyle extends ButtonStyle {
        public BitmapFont font;
        /** Optional. */
        public Color fontColor, downFontColor, overFontColor, checkedFontColor, checkedOverFontColor, disabledFontColor;

        public TextButtonStyle () {
        }

        public TextButtonStyle (Drawable up, Drawable down, Drawable checked, BitmapFont font) {
            super(up, down, checked);
            this.font = font;
        }

        public TextButtonStyle (TextButtonStyle style) {
            super(style);
            this.font = style.font;
            if (style.fontColor != null) this.fontColor = new Color(style.fontColor);
            if (style.downFontColor != null) this.downFontColor = new Color(style.downFontColor);
            if (style.overFontColor != null) this.overFontColor = new Color(style.overFontColor);
            if (style.checkedFontColor != null) this.checkedFontColor = new Color(style.checkedFontColor);
            if (style.checkedOverFontColor != null) this.checkedFontColor = new Color(style.checkedOverFontColor);
            if (style.disabledFontColor != null) this.disabledFontColor = new Color(style.disabledFontColor);
        }
    }   
}

these are the new methods for use in what you want.

public LabelButton (String text, TextButtonStyle style, boolean alignament, float xLabel, float yLabel, float widthButton, float heightButton) {
        super();
        setStyle(style);
        this.style = style;
        label = new Label(text, new LabelStyle(style.font, style.fontColor));
        if (alignament == true){
            label.setAlignment(Align.top);
        }else{
            this.heightButton = heightButton;
            this.widthButton = widthButton;
        }

        add(label).padRight(widthButton - (xLabel * 2)).padBottom(-heightButton + (yLabel * 2));
        setSize(getPrefWidth(), getPrefHeight());   
    }

    public void setCoordenadasLabel(float xLabel, float yLabel){
        getCell(label).padRight(widthButton - (xLabel * 2)).padBottom(-heightButton + (yLabel * 2));
    }

simple example

.//

LabelBoton labelBoton = new LabelButton("hola", skinMenuPrincipal, false, 150, 150, 300, 300);
labelBoton.setBounds(50, 50, 300, 300);

stage.addActor(labelBoton);

in the constructor, it is still the same as before, but use the boolean false, that does not align to the center, the first two float is where you want the text to appear but the pivot is the center of this one corner, and the past two float

you have to say the height and width you will have the button in order to do the calculations, then do not use the setPosition the label to be in a cell and I do not make it, so I had that manages what allowed me the cell, then do the setBounds with the same height and width

This other method allows you to move the label, while not change the height and width of the button you created

setCoordenadasLabel(float xLabel, float yLabel);

also tell you who are not on precision 100% but I think you will be worth it for one side, then you have to open the file uiskin.json and add this

com.mygdx.game.LabelButton$TextButtonStyle: {
default: { down: default-round-down, up: default-round, font: default-font, fontColor: white },
toggle: { down: default-round-down, up: default-round, checked: default-round-down, font: default-font, fontColor: white, downFontColor: red }
},

com.mygdx.game replaced. by name of the new package where this class

I hope you work and be what you wanted, and I prove it works but not if some error appear, sorry for my English if I eh not expressed clearly, bye.

other way

another way is to use only, without extending the class, but for various buttons and if you have to modified during application or more on precision, I think it is better to use the extended class.

TEXTBUTTON.getCell(label).padRight("YOUR POSITION").padBottom("YOUR POSITION);