0
\$\begingroup\$

I have this problem with my game where UI build a nice menu and other stuff with TextButtons and labels, but it doesn't look nice because it's mostly displaying the text of the buttons (which don't look like they are buttons).

Right now I'm using this little snippet of code to style my TextButtons:

TextButton.TextButtonStyle buttonStyle = new TextButton.TextButtonStyle();
buttonStyle.font = new BitmapFont();
buttonStyle.fontColor = WHITE;

What do i need to add to make them look like a button and not like simple text? I'm using libGDX.

\$\endgroup\$
1
\$\begingroup\$

Do not just set font and fontColor, also set the properties that make up the vidual appearance such as up, down and checked etc. They take Drawable and will allow you to use any image to represent your button.

\$\endgroup\$
  • \$\begingroup\$ okay that fixes the problem that when i click the butto it will change its color. but what about an backgroundimage? kinda like that? img.usabilitypost.com/0808/buttons.png \$\endgroup\$ – Bexx Feb 2 '16 at 16:52
  • \$\begingroup\$ @Bexx Setting up and down to appropriate nine-patch Drawables will make your buttons look like the example you provided. \$\endgroup\$ – bornander Feb 2 '16 at 17:10
1
\$\begingroup\$

I think you mean just the look of the button? You need to do that in your favorite bitmap or vector app like Photoshop, Paint.net, Graphicsgale, etc. Search something like glossy button tutorial to learn how to make a nice looking button. Make a up, down and disabled state if you desire and set them as drawables to the corresponding "slots" for the button.

The trick with the NinePatch is that you can make the button very small and set the stretching area so it will scale to the size you need. Do this after you created a button. There are tools to create ninepatches but if you make a atlas with the texturepacker in Gdx.tools you can add a split parameter.

If you want to have the font have a indented look you have to edit your bitmap font for that. Render the bitmap font with extra padding so you have room to add this in your favorite drawing application. Gimp and Photoshop have filters that can create a instant intended look for you.

\$\endgroup\$
  • \$\begingroup\$ wow thank you very much. i will try that right now. but the thing with the ninePatch is kinda confusing. i think i have to look that up. but thank you \$\endgroup\$ – Bexx Feb 3 '16 at 23:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.