2 Replies Latest reply on May 7, 2013 4:44 PM by JonnyDL

    Tween Timing Issue

    JonnyDL Level 1

      I have a script that places text outside the stage (based on words in an array), and tweens them across the stage (and repeats). The problem is that the words have varying widths, so one tween/words, bumps into another. I was trying to find a way to have them all move across one after another, at a consistant speed without bumping into each other. Sadly math is not my strong suite so I cant seem to figure it out. Can any body with better math skills help :]

       

      (Ned: if you happen to see and answer this..Thanks...The script below is what prompted my last forum question...Didn't have it written yet to provide)

       

      import mx.transitions.Tween;

      import mx.transitions.easing.*;

       

       

      var adWords:Array = new Array("catalogued ", "retrieved ", "systematized ", "word 4 ", "word 5 ", "word 6 ", "word 7 ", "word 8 ", "word 9 ", "word 10 ");

      var adWords_TF:Array = new Array()

      var Textholder:MovieClip = new MovieClip();

      var moveWord:Tween;

      var n:Number = 0;

      var i:Number= 0;

      //load all the adwords onto stage (off-satge)

      for(i=0; i < adWords.length; i++)

      {

                var word = this.createTextField("ActionWord_"+i, this.getNextHighestDepth(),0, 0, 0, 0)

                word.text = adWords[i];

                word.autoSize = "left";

                format = new TextFormat();

                format.color = 0xCC1E2C;

                format.size =24;

                format.font = "Folio";

                word.setTextFormat(format);

                word._x = - word._width

                adWords_TF.push(word)

       

      }

      tweenwords();

       

       

      function tweenwords():Void

      {

                var moveWord = new Tween(adWords_TF[n], "_x", None.easeNone, (0-adWords_TF[n]._width), Stage.width, 5, true);

                moveWord.onMotionChanged = function()

                {monitortweens ()}

      }

       

       

       

       

      function monitortweens ()

      {

                onEnterFrame = function ()

                          {

                                    if (n !== adWords_TF.length)

                                    {

                                              if (adWords_TF[n]._x >= 0)

                                              {

                                                        n++

                                                        tweenwords()

                                              }

                                              delete onEnterFrame;

                                    }

                                    else

                                    {

                                              n=0

                                              delete onEnterFrame;

                                              tweenwords()

                                    }

       

                          }

       

       

      }

        • 1. Re: Tween Timing Issue
          Ned Murphy Adobe Community Professional & MVP

          The reason your words are not holding their place in line is because you have the distance they must travel varying based on their length but it has to happen in the same amount of time for each.

           

          Say you have a word that is 100 pixels wide and another that is 400 pixels wide.  Both of them have to travel their tween in 5 seconds, but the longer word has to cover more ground due to it having 300 more pixels to travel... it has to travel faster.

           

          So what you need to do is level the playing field so that each word has to cover the same amount of ground... travel at the same speed. To do that you can adjust the end point of the tween to account for the length of the word, just as you do with the start point...

           

          var moveWord = new Tween(adWords_TF[n], "_x", None.easeNone, (0-adWords_TF[n]._width), Stage.width-adWords_TF[n]._width, 5, true);

           

           

          but that will have all your words dropping off before the end of the stage.  If you want them to make the full journey, then you'll need to adjust the stage dimension factor of that end point as well.  This adjustment could be a matter of trial and error...

           

          var moveWord = new Tween(adWords_TF[n], "_x", None.easeNone, (0-adWords_TF[n]._width), Stage.width+400-adWords_TF[n]._width, 5, true);

          • 2. Re: Tween Timing Issue
            JonnyDL Level 1

            Thank you Ned. The explanation made it clear. Hopefully you or some else can clarify something that came up as I've broadened my Idea. (feeling ambitious)

            I'm attempting to create more text fields like the original. I figured I can use a for loop and access arrays in an array.

            and build text fields like i did before. It works, but when I use a trace statement to check an item in an  array I get "_level10.ActionWord_00" I'm not clear on the _level10.

            I looked into it and found it delt with nesting of MovieClips. It does'nt appear that I am nesting the textfieds. They should be all on the stage at different depth? it works , but is there a better way?

             

            import mx.transitions.Tween;

            import mx.transitions.easing.*;

             

            var Setone_TF:Array = new Array();

            var Settwo_TF:Array = new Array();

            var Setthree_TF:Array = new Array();

             

             

            var words_Setone:Array = new Array("catalogued ", "retrieved ", "systematized ", "executed ", "prepared ", "influenced ", "delegated  ", "prioritized ", "encouraged ", "stimulated ");

            var words_Settwo:Array = new Array("catalogued ", "retrieved ", "systematized ", "executed ", "prepared ", "influenced ", "delegated  ", "prioritized ", "encouraged ", "stimulated ");

            var words_Setthree:Array = new Array("catalogued ", "retrieved ", "systematized ", "executed ", "prepared ", "influenced ", "delegated  ", "prioritized ", "encouraged ", "stimulated ");

            var basketOfArrays:Array = new Array(words_Setone, words_Settwo, words_Setthree)

             

             

             

            var moveWord:Tween;

            var n:Number = 0;

            var m:Number= 0;

            //var mainArray = adWords;

            var holderArray = adWords_TF

             

             

            for(i=0; i < basketOfArrays.length; i++)

            {

                      for(n=0; n < basketOfArrays[i][n].length; n++)

            {

                      if (i==0){holderArray = Setone_TF}

                      if (i==1){holderArray = Settwo_TF}

                      if (i==2){holderArray = Setthree_TF}

                      var word = this.createTextField("ActionWord_"+i+n, this.getNextHighestDepth(),0, 0, 0, 0)

                      word.text = basketOfArrays[i][n];

                      word.autoSize = "left";

                      format = new TextFormat();

                      format.color = 0xAED6FF;

                      format.size =24;

                      format.font = "Folio";

                      word.setTextFormat(format);

                      word._alpha = 50;

                      word._x = -word._width

                      holderArray.push(this.word);

                      //trace(holderArray.length);

            }

             

             

            }