Setting different images for button onClick, hover, etc

KonradZuse · September 17, 2013, 1:16am

I have looked at Button (Nifty Default Controls 1.3 API)

and such, but it has nothing really, nor does it show a way to change the background image?

I am also using the Nifty GUI editor and there is a field to edit a background there though. I can make my own fields as well it seems, but what would I do after that to make to actually do something?

Am I looking in the wrong place or would I have to create my own button or something?

Any help in the right path would be appreciated.

javagame · September 17, 2013, 8:30am

It sounds like you are wanting to make a new nifty control, there’s a tutorial for that here

Sorry can’t get the link to show

javagame · September 17, 2013, 9:09am

        &lt;panel id="StartButtonPanel" height="20%" width="30%" align="left" childLayout="center" valign="center" &gt;  
            &lt;control name="StartButton" id="StartButton" type="button" label="Connect to a server" height="30%" width="70%" visibleToMouse="true"&gt;
                &lt;interact onClick="startPressed()" /&gt;
            &lt;/control&gt;
        &lt;/panel&gt;

This is how I define my button, startPressed is a method in my gui controller class that is called when the button is clicked (onClick) but you can change that to onFocus or onHover I think

Anyway its probably much easier to use the t0neg0d gui

KonradZuse · September 17, 2013, 5:07pm

Tonegod gui?

I really don’t get how Nifty doesn’t have a lot of this stuff pre-built in. What kind of Game GUI is that? Most games definitely have things for onHover, click, etc… Making us do all of that is okay, but most gui’s have this already…

http://hub.jmonkeyengine.org/forum/topic/tonegodgui-documentation/

So this is the pre-Alpha, is that even safe to use? :P.

javagame · September 17, 2013, 7:00pm

@KonradZuse said:
I really don’t get how Nifty doesn’t have a lot of this stuff pre-built in. What kind of Game GUI is that? Most games definitely have things for onHover, click, etc… Making us do all of that is okay, but most gui’s have this already…

onHover, onFocus and onClick are prebuilt in though… See in my XML where I have

<interact onClick=”startPressed()” /> ?

That method call, startPressed(), is to a method with the same name in my gui controler class and is called when the button is clicked… Hence the onClick part of the XML, which you can change to onHover or onFocus. I’ll admit that nifty isn’t the simplest ever GUI, but when writing a game one generally does have to write code, yes…

@KonradZuse said: Tonegod gui?
http://hub.jmonkeyengine.org/forum/topic/tonegodgui-documentation/

So this is the pre-Alpha, is that even safe to use? :P.

I’ll admit I’ve never tried it as of now but once I’m done with some of the more important game mechanics I will definitively be converting all of my nifty stuff over to tonegod… As to whether it is safe… From what I have seen it looks great, I’m like 90% sure its fine to use but for a definite answer you will have to ask @t0neG0d

KonradZuse · September 17, 2013, 7:14pm

@javagame said: onHover, onFocus and onClick are prebuilt in though... See in my XML where I have
<interact onClick=”startPressed()” /> ?

That method call, startPressed(), is to a method with the same name in my gui controler class and is called when the button is clicked… Hence the onClick part of the XML, which you can change to onHover or onFocus. I’ll admit that nifty isn’t the simplest ever GUI, but when writing a game one generally does have to write code, yes…

I’ll admit I’ve never tried it as of now but once I’m done with some of the more important game mechanics I will definitively be converting all of my nifty stuff over to tonegod… As to whether it is safe… From what I have seen it looks great, I’m like 90% sure its fine to use but for a definite answer you will have to ask @t0neG0d

Yeah, I’m sorry, I thought your interact stuff was all made by you, so that’s my fault. Of course I’ll have to write code, what are we using? Gamemaker? :P.

I must have missed the info in the Nifty documentation, but it’s also not the best documentation.

I’ve used Swing and FX is my goto now, so I am familiar with GUI work, it’s just the API documentation seems to be lacking a lot of info, or I’m looking in the wrong places to find these commands. Button was limited as shown above.

ToneGod’s gui definitely seemed really nice, but the only issue I noticed was the “Multiple Screen” issue from March, which I hope is fixed.

I made a post on there, just to make sure, but it seems I might go with that one.

All I need to do is text, some buttons, and maybe an image logo. Nothing crazy complicated.

I appreciate your help Dan.

t0neg0d · September 17, 2013, 7:47pm

The multiple screen issue is really a non-issue, as AppStates (which are already being used by your application more than likely), allow you to do everything you might do with multiple screens and more… now for the list of mores:

With AppStates:

You can have multiple screens at the same time! This is good for loading/unloading ui components that aren’t in use all the time)
You can overlap “screen” transitions… one fades in while the other fades out, etc.
You can better organize your GUI related code

And I am sure there are more reasons I am forgetting.

Basically, to use them with the library…

Initialize all components in the constructor or private methods called by the constructor.
in the initialize() method, add components to the screen, and run any transition effects you like
In the cleanup method, run any transition effects you like and remove the components from the screen.

For the coming additions to the library, the update method will also be useful for leveraging:

2d Time-based animation related actions
Updates to 2d physics model (coming very soon)

I’ll be finishing up and adding a fully integration of 2d game framework for desktop/android, which includes time-based actions with interpolations methods and integrated 2d physics (Box2d with familiar JME class wrappers for creating typical control types).

Anyways… hope this clarifies the multi-screen question. As for updates, I’ll be posting out my test project soon which allow people to explore the library without writing a stitch of code, code examples for all components (which will demonstrate easy-of-use and also allow people to select the build target for android to see how it performs there (and try out some of the android specific controls… like the virtual keyboard and joystick).

jmaasing · September 17, 2013, 9:46pm

@KonradZuse said: I must have missed the info in the Nifty documentation, but it's also not the best documentation.

Good or not this is the documentation for Nifty that I know of:

You can find the nifty manual here http://nifty-gui.lessvoid.com/archives/495
Some nifty tutorials here: nifty-gui download | SourceForge.net
Actually, it’s all linked from here https://wiki.jmonkeyengine.org/legacy/doku.php/jme3:advanced:nifty_gui

zarch · September 19, 2013, 9:36pm

You can do the button thing just fine in nifty - we do it for herodex. Just use the onHover to trigger a ChangeImage effect. We use standard panels (not controls at all) and set a style on them that does the onHover, onClick, etc and triggers the image changes all automatically.

I don’t have the code handy so can’t be more specific but it wasn’t too hard to set up.