Nifty button - round with image, no text

I would like to have round clickable buttons in nifty, without any text on them, but with an image (with alpha transparency).



As far as I understand, I cannot reuse existing button. I can probably start with nifty-checkbox.xml and create my own control class - but maybe somebody has already done something similar? Is there a repository of ‘third party’ nifty controls somewhere ?

When you have fixed sized buttons - and I suppose you have when they show an image :slight_smile: - then the easiest way would probably be to use a simple image inside in Nifty and add some onClick() interact stuff to it. If you want to make that button to be able to get the keyboard focus then you can add focusable=“true” to the image. To define the look of the image when it has to keyboard focus you can add some nifty onFocus() effect, probably an imageOverlay effect to change the image or something. You don’t need to define a custom control to have simple clickable image buttons in Nifty at all. (But it’s really not so hard to build your own…)



Another route would be to use the existing button control and simply define a new style for it. You can start with the xml file “nifty-button.xml” in the “nifty-style-black” project. You would make your own copy, call the style definitions you find in there something like ‘style id=my-custom-button#panel"’ and ‘style id=“my-custom-button#text”’ and modify the style accordingly. You will still get the text element in that case but you should be able to use text="" so that no text is shown (or rendered).