dcsimg
A Flash Developer Resource Site

Results 1 to 5 of 5

Thread: HitTest question

  1. #1
    Senior Member
    Join Date
    Mar 2008
    Posts
    160

    HitTest question

    I am building a navigation that has a button that reveals a set of menu buttons. Have no problem getting the first button to key the group of buttons to come on stage. However, I need group of buttons to "sense" that the mouse is still hovering over this area. This all while each individual button (within that group) can act individually. I have read a bit and it sounds like a hitTest kind thing. All examples I have seen are higher level (game oriented) examples. Can someone help and explain this? Thanks ahead of time.

  2. #2
    Total Universe Mod jAQUAN's Avatar
    Join Date
    Jul 2000
    Location
    Honolulu
    Posts
    2,429
    I use a container clip for the entire button group including the parent that reveals the children when rolled over.
    The container never has any mouse events (onRollOver, onRollOut etc) so that it wont override the events assigned to the actual buttons.

    I then have a mouse listener set up which is assigned when the parent is rolled over and unassigned when the mouse leaves the area. That mouse listener does the hitTest so all the sub-clips are allowed to act like buttons.

    PHP Code:
    //the mouse listener
    //this doesnt actually run until the listener is added to the Mouse object
    //that is done in the onRollOver of the parent button
    mouseListener = new Object();
    mouseListener.onMouseMove = function(){
      if(
    myContainerClip.hitTest(_xmouse_ymouse)){
        
    //mouse is still hovering over open menu
      
    }else{
        
    //mouse has left the area of myContainerClip so close the menu
      
    }
    }

    //the parent button's rollover
    myContainerClip.parentButton.onRollOver = function(){
      
    //start listening to the Mouse
      
    Mouse.addListener(mouseListener);

    This may take some adjustment depending on how your building the menu but the concept is there.

  3. #3
    Senior Member
    Join Date
    Mar 2008
    Posts
    160
    Okay,
    That kinda make it clearer. As I understand.. put both the parent and children buttons (both should be a movie clip) in an empty container. Do I put the code on the parent button, on the first frame of of the empty container...? Do I still keep the onrollOver action on the parent button.

  4. #4
    Total Universe Mod jAQUAN's Avatar
    Join Date
    Jul 2000
    Location
    Honolulu
    Posts
    2,429
    For clarity and editability, you should attempt to put all your code in one place. Preferably on the first frame of a layer called actions. For now you'll be safe putting in on the first frame of the container to keep your references relative. As you gain more understanding of scope, you'll be more comfortable putting all the code in the main timeline.

    The children of the container clip can be buttons and receive their rollover assignments as usual. The Mouse is a global object so you don't need a fully qualified reference to it (ie. _root.myClip.Mouse). You can just refer to the Mouse object directly as in my example.

    From within the container, the button event assignment might look like this:


    Code:
    mouseListener = new Object();
    mouseListener.onMouseMove = function(){
      //if you declare the mouseListener object in side the scope of the
      //container, you'll have to bubble up (ie. this._parent) to do the hitTest
      //centralizing your code in the main timeline makes that less confusing.
      if(this._parent.hitTest(_xmouse, _ymouse)){
        //mouse is still hovering over open menu
      }else{
        //mouse has left the area of myContainerClip so close the menu
      }
    }
    
    myParentButton.onRollOver = function(){
      Mouse.addListener(mouseListener);
    }

  5. #5
    Senior Member
    Join Date
    Mar 2008
    Posts
    160
    Hi,
    Thank man. That helped me understand a bit more. However, I decided to make it a bit more groovy with a timer action. so here is what I have.
    PHP Code:
    var TimeOutID
    var OverFlag=false
    var HitFlag=false

    onEnterFrame
    =function(){
        
    HitFlag=this.hitTest(_root._xmouse,_root._ymouse,true)

        if (
    HitFlag){
            
    clearTimeout(TimeOutID)
            
    OverFlag=true
            TimeOutID
    =null    
        
    }else{        
             if (
    OverFlag && TimeOutID==null)TimeOutID=setTimeout(Disappear700this//5000 milliSeconds  (5 secs)            
        
    }
    }



    function 
    Disappear(nav_mc){
        
    gotoAndPlay(3);

        
    menuBig.process.gotoAndPlay(3);
        
    menuBig.work.gotoAndPlay(3);
        
    menuBig.news.gotoAndPlay(3);
        
    menuBig.connect.gotoAndPlay(3);
        
        
    // Assume "park" is the frame label inside your movie clip.
        // mc.gotoAndStop(10)   // If want to use a frame number. Assume 10 is a frame number in you movie clip to go and stop.
        
    delete TimeOutID    
        delete onEnterFrame

    As you can see it is a simple timer kinda thing. After timing out it goes to a frame where I have tween code waiting so that the buttons ease off stage. NOW.. When I click a button I am wanting to (I guess in a global kinda way) kill this code so that it does not perform the final instructions. Now when you click a button my code moves the buttons off stage nicely BUT the timer repeats that "going off stage" action. How can you fix that? Thanks a ton.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center