9 Replies Latest reply on May 26, 2009 10:26 AM by Winginsue

    A button array question

    Winginsue Level 1

      I think this should be here instead of the Actionscrip area but not sure.  I am using a button to have a small popup (which is a MovieClip) appear when the user does a mouse over.  I have a LOT of these because it is a list of bullet points.  What I'm wondering is if there is a way to do an array.  It would cut WAY down on code.

       

      I've been searching on the net and in Adobe but haven't had much luck.

       

      Thanks.

       

      Suzette

       

      Although this is the Flash forum instead of ActionScript My code for one button is: 

       

      box_new90.btn_newUsers.addEventListener(MouseEvent.MOUSE_OVER, newUserOver);
      box_new90.btn_newUsers.addEventListener(MouseEvent.MOUSE_OUT,closePop);

       

      function newUserOver(e:MouseEvent):void{
      activePop = pop_newUsers;
      heightPop = 75;
      topPopOpen = 190;
      topPopClose = 155;
      openPop();
      }

       

      function openPop() {
      var tweenShow:Tween = new Tween(activePop, "alpha", None.easeIn, 0,1,3,false);
      var tweenGrow:Tween = new Tween(activePop,"height",None.easeIn, 0,heightPop,3,false);
      var tweenMoveDown:Tween = new Tween(activePop,"y",None.easeNone,topPopClose,topPopOpen,3,false);
      }


      function closePop(e:MouseEvent):void{
      var tweenHide:Tween = new Tween(activePop, "alpha", None.easeOut, 1,0,3,false);
      var tweenShrink:Tween = new Tween(activePop,"height",None.easeOut,heightPop,1,3,false);
      var tweenMoveUp:Tween = new Tween(activePop,"y",None.easeNone,topPopOpen,topPopClose,3,false);
      // activePop.y = topPop;
      }

        • 1. Re: A button array question
          Ned Murphy Adobe Community Professional & MVP

          I'm not sure what you are thinking of using an array to accomplish, though it could be helpful in some aspects.

          As a minimum, an array could come in handy for assigning the event listeners.  If the array held the btn objects, then you could loop thru the array to assign the event listeners.

           

          You could utilize the same three functions for all of the buttons if you modify things slightly.  Renaming your buttons to remove the "btn_" portion would help avoid an extra line of code (the extra line would otherwise be needed to extract the unique part of the names).

           

          box_new90.newUsers.addEventListener(MouseEvent.MOUSE_OVER, newUserOver);
          box_new90.newUsers.addEventListener(MouseEvent.MOUSE_OUT,closePop);

           

           

           

          function newUserOver(e:MouseEvent):void{
          activePop = this["pop_"+e.currentTarget.name];
          heightPop = 75;
          topPopOpen = 190;
          topPopClose = 155;

          openPop();
          }

           

           

           

          function openPop() {
          var tweenShow:Tween = new Tween(activePop, "alpha", None.easeIn, activePop.alpha,1,3,false);
          var tweenGrow:Tween = new Tween(activePop,"height",None.easeIn, activePop.height,heightPop,3,false);
          var tweenMoveDown:Tween = new Tween(activePop,"y",None.easeNone, activePop.y,topPopOpen,3,false);
          }


          function closePop(e:MouseEvent):void{
          var tweenHide:Tween = new Tween(activePop, "alpha", None.easeOut,  activePop.alpha,0,3,false);
          var tweenShrink:Tween = new Tween(activePop,"height",None.easeOut,activePop.height,1,3,false);
          var tweenMoveUp:Tween = new Tween(activePop,"y",None.easeNone,activePop.y,topPopClose,3,false);
          // activePop.y = topPop;
          }

           

           

          The reason I highlighted things red...

           

           

          for the newUserOver function, if those value would be different for each popup, then that's one place where an array could come in handy... an array that included objects that specify those three parameters for each popup.  To make use of an array, you would need to have the btn provide an identifier for the index of the array.  This could be done by making the btn a movieclip that carries a variable for the index.

           

           

          for the 3's in the Tween code, you'll notice I changed the beginning value of the Tweens to use the current value of the popup for the associated property.  This would help in the event of someone moving a mouse over/out of a button faster than the tween speed. The tween will always begin where it currently is rather than jumping to the full value of that property.  In this case, the 3's could be established as variable amount rather than fixed values so that you're not waiting the full 3 seconds for something that was only part way thru it's Tween when the reversing Tween occurred.  The 3 would be replaced by something like... 3*Math.abs(initial-final)/fullInitial...  this would depend on the property/scenario you're dealing with... don't wanna be dividing by zero.

          • 2. Re: A button array question
            Winginsue Level 1

            Once again Ned you've helped.  I have to study this a bit to fully understand it but from what I can tell it will solve my problem.  It is true that the popups will differ in size.  I owe you big time for your assitance.  It seems that Flash has so much power but sometimes figuring out some of it is a bugger.

             

            Thanks again Ned.

             

            Suzette

            • 3. Re: A button array question
              Ned Murphy Adobe Community Professional & MVP

              It's usually a bugger figuring things out... I'm in that same boat very often.  But the struggle helps alot in the learning process.  Hand-outs don't teach much.  If you have any questions, feel free to ask.

              • 4. Re: A button array question
                Winginsue Level 1

                I agree completely.  Usually I work at it for a long time then I finally make a post.  I've programmed in VB for years and what usually happens is just after I make a post I figure it out.  Hopefully I'll be much better with Flash soon.   I am really enjoying learning it and the potential with it.

                • 5. Re: A button array question
                  Winginsue Level 1

                  ack.. my brain my brain!

                   

                  I renamed the buttons and changed them to MovieClips so my code is now:

                  import fl.transitions.Tween;
                  import fl.transitions.easing.*;

                   

                  var activePop:MovieClip = box.pop_one;

                   

                  box.pop_one.visible = false;
                  box.pop_two.visible = false;

                   

                  box.one.addEventListener(MouseEvent.MOUSE_OVER, Over);
                  box.one.addEventListener(MouseEvent.MOUSE_OUT, closePop);

                  box.two.addEventListener(MouseEvent.MOUSE_OVER, Over);
                  box.two.addEventListener(MouseEvent.MOUSE_OUT, closePop);

                   

                  function Over(e:MouseEvent):void {
                  trace("pop_"+e.currentTarget.name);
                  activePop=this["pop_"+e.currentTarget.name];
                  trace ("Popname = " + activePop.name);
                  openPop();
                  }

                   

                  function openPop(){
                  activePop.visible = true;
                  }

                   

                  function closePop(e:MouseEvent):void{
                  activePop.visible = false;
                  }

                  The line in red is giving me fits.  I put the trace in to see what comes up.  The first trace shows "pop_one" which is correct.  After that I get a:

                  TypeError: Error #1009: Cannot access a property or method of a null object reference.

                        at layertest_fla::MainTimeline/Over()

                  Message which tells me that activePop is getting a null assignment.  I tried changing it to

                            activePop=this["box.pop_"+e.currentTarget.name];

                  thinking that it needed the box prefix since the pop is imbedded in the box frame.  Shoot, I just realized I can upload the file.  DUH!

                   

                  I'm off to research the movieclip index part you mentioned as well as the math for the replacement of the "3" you mentioned.

                   

                  Thanks again.


                  Suzette

                  • 6. Re: A button array question
                    Ned Murphy Adobe Community Professional & MVP

                    Try:

                     

                    activePop=box["pop_"+e.currentTarget.name];

                    • 7. Re: A button array question
                      Winginsue Level 1

                      That did it.  My question is.. can you recommend a book to help me understand some of the "this"/"box" information?  I got the "Classroom in a book" on Flash and Actionscript which helped me a lot but I am struggling to understand some of the finer points of coding such as e:MouseEvent in a function and such.

                       

                      Thanks again.... my HERO!

                       

                       

                      Just in case someone might need similar information in the future.

                       

                      Keywords for searching:  array child objects addEventListener MovieClip

                       

                      I created a movie clip in which I included additional movie clips.  Some are hover items, others are popup items.  Rather than do an .addEventListener for each item I used an array.  The items being used for the hover are prefixed with a "b" (for button?).  The popups are prefixed with "pop_".  Here is the code:

                       

                       

                       

                       


                      var activePop:MovieClip = box["pop_bOne"];
                      var bulletPt:MovieClip;

                       

                       

                      box["pop_bOne"].visible = false;
                      box["pop_bTwo"].visible = false;

                       

                      for(var i=0;i<box.numChildren;i++){
                      var childName =  box.getChildAt(i).name;
                      trace(childName.substr(0,1));
                           if (childName.substr(0,1)=="b") {
                                  bulletPt = MovieClip(box.getChildAt(i));
                                  bulletPt.addEventListener(MouseEvent.MOUSE_OVER, openPop);
                           }
                      }

                       

                      function openPop(e:MouseEvent):void {
                           closePop();
                           activePop=box["pop_" + e.currentTarget.name];
                           activePop.visible = true;
                      }

                       

                      function closePop() {
                           activePop.visible = false;
                      }

                      • 8. Re: A button array question
                        Ned Murphy Adobe Community Professional & MVP

                        Sorry, but I don't do books, so I am not a good reference for them.  Not that I don't read to find things, I just don't use published books for it... Google and the Help documents are my primary information sources.

                         

                        As far as 'this' goes, it's a means of insuring that your are targeting the current timeline.  Generally, 'this' is understood, but in some cases you need to use it because you are calling on a movieclip method (basically a function that's relevant to a class), not a function (something that stands on it's own, like stop();).  When I use 'box', I could have used this.box, but because box is in the current timeline, it isn't necessary.

                         

                        One thing you don't want to do is what you tried... this["box.etc"]... the "." loses its meaning (I don't know why... I just know it doesn't work).  If you have to string things along you'd be using something more like.... this["box"+i]["pop_"+k]   ... think of the brackets as including an invisible "." in front of them.

                         

                        As far as the e:MouseEvent thing goes, it's merely a variable with its class/type defined, an argument passed into a function.  In AS3 event listeners automatically pass an argument to the handler function.  That argument holds information relelvant to the event.  For e:MouseEvent, someone decided to name the variable "e"... though they could have used "just_about_anything"  And you can look up the MouseEvent class in the help docs to see what properties and methods apply to it.

                        • 9. Re: A button array question
                          Winginsue Level 1

                          Thanks Ned for the info on the MouseEvent class.  I've learned a lot with this exchange and enough to set me off in the right direction for understanding more.