This is an old revision of the document!
There are plenty of ways to implement some kind of hovering effect. In this tutorial I will describe how do it using the animation framework of orx. In order to do so, you will have to write quite some lines in your ini files. Luckly you can just copy-paste most of it. I will not provide a running example, but rather some bits and pieces that you can use for your existing project.
It is supposed that your button consists of two images. One representing the active and on the inactive state.
Ok let's suppose you have some kind of game menu, in which you got a “Play” button, that will start the actual game. So we define two animations for this button: one that shows the active image and one showing the inactive image. You can just copy paste those lines, replacing “PlayButton” with the name you like and the paths inside “PlayButtonGraphicActive” and “PlayButtonGraphicInactive”, so that they will point to the correct images. Repeat this step for all the buttons you have.
[PlayButton] Graphic = PlayButtonGraphicInactive Position = (0,0,0.00001) Pivot = top left AnimationSet = PlayButtonAnimationSet AnimationActive = PlayButtonActive AnimationInactive = PlayButtonInactive [PlayButtonAnimationSet] AnimationList = PlayButtonInactive#PlayButtonActive LinkList = PlayButtonInactiveLoop#PlayButtonInactive2Active#PlayButtonActiveLoop#PlayButtonActive2Inactive [PlayButtonActive] DefaultKeyDuration = 0.5 KeyData1 = PlayButtonGraphicActive KeyData2 = PlayButtonGraphicActive [PlayButtonInactive] DefaultKeyDuration = 0.5 KeyData1 = PlayButtonGraphicInactive KeyData2 = PlayButtonGraphicInactive [PlayButtonInactiveLoop] Source = PlayButtonInactive Destination = PlayButtonInactive [PlayButtonInactive2Active] Source = PlayButtonInactive Destination = PlayButtonActive Property = immediate [PlayButtonActiveLoop] Source = PlayButtonActive Destination = PlayButtonActive [PlayButtonActive2Inactive] Source = PlayButtonActive Destination = PlayButtonInactive Property = immediate [PlayButtonGraphicActive] Texture = ../../data/img/ui/btn_badge_play_hover.png Pivot = top left [PlayButtonGraphicInactive] Texture = ../../data/img/ui/btn_badge_play.png Pivot = top left
Now that you have all the buttons configured, we can go to the coding part: We want to set the target animation to PlayButtonActive when the mouse hovers the button and to PlayButtonGraphicInactive when the mouse leaves the button.
So you probably have some update function that handles all your game logic stuff. You may either use this one, are register a new one, that is called less frequently(, because the hovering effect of the mouse is not really important/time critical). Nevertheless this is how the update function would look like:
//object that stores the currently highlighted button: orxOBJECT* highlighted_button_ = orxNULL; void orxFASTCALL Update(const orxCLOCK_INFO *_pstClockInfo, void *_pstContext) { //let's fetch the mouse's position: orxVECTOR vPos; if(orxRender_GetWorldPosition(orxMouse_GetPosition(&vPos), orxNULL, &vPos)) { //let's see what's currently under the mouse: orxOBJECT* object = orxObject_Pick(&vPos, orxU32_UNDEFINED); if(object) { //check if the user clicked or just hovered over the object: if(orxInput_IsActive("Select")&&orxInput_HasNewStatus("Select")) { //he clicked...so let's start the game if it was the PlayButton if(orxString_Compare(orxObject_GetName(object),"PlayButton")==0) { //INSERT SOME CODE THAT STARTS YOUR GAME } else if(orxString_Compare(orxObject_GetName(object),"OtherButton")==0) { //DO OTHER STUFF FOR OTHER BUTTONS } } else { //he just hovered...so let's set the animations correctly if(object!=highlighted_button_ && highlighted_button_!=orxNULL) { //The mouse left the currently hightlighted object...so remove the animation: if(orxConfig_PushSection(orxObject_GetName(highlighted_button_))) { orxObject_SetTargetAnim(highlighted_button_, orxConfig_GetString("AnimationInactive")); orxConfig_PopSection(); } highlighted_button_ = orxNULL; } //let's check if the mouse is over one of our buttons //this could also be made more intelligent, like searching for the string Button in the name of the object, given that all the buttons have the hovering animations specified //furthermore this could also be mode more efficient, but comparing the concrete object pointers, (given you have them) if(orxString_Compare(orxObject_GetName(object),"PlayButton")==0 || orxString_Compare(orxObject_GetName(object),"OtherButton")==0) { if(orxConfig_PushSection(orxObject_GetName(object))) { orxObject_SetTargetAnim(object, orxConfig_GetString("AnimationActive")); orxConfig_PopSection(); } highlighted_button_ = object; } } } } }It assumes, that you have multiple buttons and you want the possibility to add new buttons easily. Once you added the configuration lines for a new button simple add a new check (orxString_Compare(orxObject_GetName(object),“NewButton”)==0) at the bottom of the update function(where the animation is set to AnimationActive).
Hope that helps!!