user3203425
user3203425

Reputation: 3059

Specify TextButton padding in skin json file?

I have a typical skin json file, like the sample one here:

https://github.com/libgdx/libgdx/blob/master/tests/gdx-tests-android/assets/data/uiskin.json

is it possible to specify "inner" padding for text buttons (the space around the text to the edge of the button) in the skin file - or can we only do that programatically at runtime?

Thanks

Upvotes: 1

Views: 1078

Answers (3)

Tenfour04
Tenfour04

Reputation: 93779

Buttons in scene2d use the background drawable to determine padding. To the best of my knowledge, the only three reliable ways to set the padding of a Button are

  1. Use a 9 patch drawable for the background drawable. The 9 patch defines its own padding.

  2. Programatically modify any Drawable to have padding by using its setTopHeight(), setLeftWidth(), etc. methods. Then apply this Drawable as the Button's background programatically.

  3. Edit: As of LibGDX 1.7.2, this is now possible to do by specifying a TextureRegionDrawable in the JSON file. Use a TextureRegionDrawable as the background of the button and define its padding like this:

    com.badlogic.gdx.scenes.scene2d.utils.TextureRegionDrawable: { paddedWhite: { region: white, leftWidth: 5, rightWidth: 5, topHeight: 4, bottomHeight: 4 } }

Note that if you simply use button.pad(...), your padding settings will be cancelled the moment the button is pressed the first time.

Upvotes: 2

Angel Angel
Angel Angel

Reputation: 21728

If you want to make a padiding from the code inside a table.

this is an example from the wiki table:

Padding

Padding is extra space around the edges of a cell.

table.add(nameLabel);
table.add(nameText).width(100).padBottom(10); // Sets bottom padding.
table.row();
table.add(addressLabel);
table.add(addressText).width(100).pad(10);    // Sets top, left, bottom, right padding. 

look this:

  1. https://github.com/libgdx/libgdx/wiki/Table
  2. https://github.com/EsotericSoftware/tablelayout

Upvotes: 0

Fish
Fish

Reputation: 1697

Along with your .json file, you should also have a .atlas file in your .atlas file, you define your button

in your .atlas file:

Button.png
size: 70,10
format: RGBA8888
filter: Linear,Linear
repeat: none
Button1
  rotate: false
  xy: 0, 0
  size: 30, 30
  orig: 30, 30
  offset: 0, 0
  index: -1

so if your button size is 30, 30
then if you want your button to be slightly larger on the x axis, then make your orig 20, 30

Hope you like this answer

If you need more help visit here or find yourself more examples

Upvotes: 0

Related Questions