GUI menu with animation trigger by hover

Hey all, basically as the title says, i`m looking to set up some animations as soon as you go over the buttons with the mouse pointer (i.e. the animatiomns get triggered) once you actual click then the particular scene will load, but if you dont click and stay hovering from one button to another the different animations will pop up.
i`m basically new to unity and to javascript so prolly my code is a bit of a mess... here it goes...

Code (csharp):

1. #pragma strict
2.  
3. public var Title:Texture2D;
4.  
5. private var TitleRect:LTRect;
6.  
7.  
8. function IsMouseOver() : boolean
9. {
10.    return Event.current.type == EventType.Repaint  
11.          GUILayoutUtility.GetLastRect().Contains(Event.current.mousePosition);
12. }
13.  
14. function OnGUI()
15. {
16.    if (GUILayout.Button("TEST PLAYER"));
17.    Debug.Log("click");
18.    
19.             if (IsMouseOver())
20.        Debug.Log("mouse is over just shown button");
21.        
22. if(GUILayout.Button("TEST PLAYER",  GUILayout.Width(100), GUILayout.Height(100))){
23.  
24.                     Debug.Log("Main Button clicked!");
25.  
26.                 }
27.    
28.    if(GUI.Button(Rect(460,320,100,40), "1 PLAYER"))
29.         {
30.             Application.LoadLevel("Gamescene");
31.            
32.             if (IsMouseOver())
33.        Debug.Log("mouse is over just shown button");
34.         }
35.            
36.         if(GUI.Button(Rect(460,400,100,40), "2 PLAYERS"))
37.         {
38.             Application.LoadLevel("Gamescene2PLAYERS");
39.         }
40.        
41.        
42.             if(GUI.Button(Rect(460,480,100,40), "CONTROLS"))
43.         {
44.             Application.LoadLevel("Controls");
45.         }
46.        
47.        
48.         if(GUI.Button(Rect(460,560,100,40), "EXIT GAME"))
49.         {
50.             Application.Quit();
51.         }
52.    
53.  
54.     GUI.DrawTexture( TitleRect.rect, Title);
55. }
56.  
57. function Start () {
58.     TitleRect = new LTRect( -Title.width, 0.5*Screen.height - Title.height/.5, Title.width, Title.height );
59.  
60.     // Slide in
61.     LeanTween.move(TitleRect, new Vector2(0.25*Screen.width - Title.width/3.95, TitleRect.rect.y ), 1.5, ["ease",LeanTween.easeOutQuad]);
62. }
63.  

Now I managed to actually get that the LeanTWeen scripts to simply animate some textures, but I want it triggered on mouse hover, not on start or updating every frame :/ so this animation has to be linked via boolean to a gui button, when I tried the ifmouseover, on some GUI buttons it works.. on GUI Layouts it does not... bdw anyone has a good easy to follow "quick facts about javascript" so maybe I can start to understand some stuff faster! (I need to google and read forums for every single ) or ; I place at this point!)

Thanks in Advance!

 

Hey DigitalScar,

This guide is pretty good for getting up and running with Unity scripting:

http://unity3d.com/learn/tutorials/modules/beginner/scripting

As far as the animating an item, you can move that slide in animation onto your if button clicked code and it should run, like:

if(GUILayout.Button("TEST PLAYER", GUILayout.Width(100), GUILayout.Height(100))){

LeanTween.move(TitleRect, new Vector2(0.25*Screen.width - Title.width/3.95, TitleRect.rect.y ), 1.5, ["ease",LeanTween.easeOutQuad]);

}

If you wanted to activate this on hover, I think you would need to set a boolean, to say the animation has already started, otherwise it would keep repeatedly firing on hover.

I hope that helps!
Russ

 

Hi, thanks for the reply Appreciate it!

Yes the theory and my idea is there, I just lack the coding and compiling skillz

so bascailly this is what I have atm, I need to link the CLICK button with a scene, and the HOVER action with an animation or sound, any idea how I can call the scene with a click... it is not working... also how can I play the sound or animation and make it delay with like 10 seconds at least, because as you said, the sound is just playing half a second and restarting!

Code (csharp):

1. var hover : String;
2.  
3. var sound : AudioClip;
4.  
5.  
6.  
7. function OnGUI(){
8.  
9.    GUI.Button (Rect (460,320,100,40), GUIContent ("1 PLAYER", "Button 1"));
10.      
11.    GUI.Button (Rect (460,400,100,40), GUIContent ("2 PLAYERS", "Button 2"));
12.          
13.    GUI.Button (Rect (460,480,100,40), GUIContent ("Controls", "Button 3"));
14.    
15.    GUI.Button (Rect (460,560,100,40), GUIContent ("Exit Game", "Button 4"));
16.    
17.    
18.    
19.    
20.    
21.    // also I need to include a code with it like this  
22.    //
23.     //  */ if(GUI.Button(Rect(15,100,100,40), "1 PLAYER"))
24. //      {
25. //          Application.LoadLevel("Gamescene");
26. //      }
27.    
28.  
29.    
30.    
31.    
32.    // here I need to add sounds and animations for the hover
33.  
34.     hover = GUI.tooltip;
35.      
36.        if(hover=="Button 1")
37.  
38.        audio.PlayOneShot(sound);
39.  
40. }
41.  
42.  
43. function Update () {
44.  
45.      
46.      
47.    if(hover=="Button 2")
48.  
49.    Debug.Log("Hovering Button 2");
50.    
51.    if(hover=="Button 3")
52.    
53.    Debug.Log("Hovering Button 3");
54.    
55.    if(hover=="Button 4")
56.    
57.    Debug.Log("Hovering Button 4");
58.  
59. }

 

With UnityGUI button you could detect only the click event.

However, you could keep the list of all the button positions (Rects) and when the mouse is moved calculate which button is being hovered.

 

http://docs.unity3d.com/ScriptReference/GUI-tooltip.html

I find this is the most correct way of doing the mouseOver. Basically you use tooltips: when you hover over an GUI element, if you have created content with a tooltip, GUI.tooltip stores that string. And you can check if that string is changing between frames...

You can still reuse tooltips as actual tooltips.