Jump to content
GreenSock

X10

Members
  • Posts

    94
  • Joined

  • Last visited

Posts posted by X10

  1. If you read a little bit into the second link I posted they talk about creating a slider in AS3:

     

    "Or you could do it with just AS if you wish. All it is is a background with a Sprite that moves left and right between the edges of the background. It then sets a value based on it's relative position to the edges. It also needs to move if that value is set programatically."

     

    I think that might be the best thing for you to try.

    X10

  2. Hi Luigi,

    Check out Carl Schoof's random number post:

    http://www.snorkl.tv/2011/02/use-the-pr ... s-or-else/

     

    Basically you can create a random number function like below:

    function randomNumber(min:Number, max:Number):Number {
    //good
    return Math.floor(Math.random() * (1 + max - min) + min);
    }

     

    then use:

    randomNumber(1,5);

    to generate the number, in the example above it would be a value between 1 and 5 (inclusive)

     

    so in your code you could change:

    TweenMax.allTo(fireBallArray, .8, {y:randomNumber(1,5),x:randomNumber(1,5),blurFilter:{blurX:50, blurY:50}}, 0.1);

    Replace 1 and 5 with the values on the stage you want your fireball to go to.

     

    I hope that helps, let us know how you get on.

    X10

  3. Hi keleko,

    Not sure I understand what's going on with your animation, are you trying to tween something in AS or are you trying to tween something you already have on stage that you've used frame by frame animation for?

     

    This line suggestes you're trying to do the latter:

    timeline.append(TweenMax.to(main, 1, {frame:31}));

    in which case you need to tell TimelineLite/Max that you're using frames:

    so add this to your TimelineMax instance useFrames:true like so:

    var timeline:TimelineMax = new TimelineMax({totalProgress:main,useFrames:true});

     

    If you could post a simple FLA that would probably help to understand what's going on.

    X10

  4. Hi Miroku_87,

    Not sure if this is exactly what you're after, but the following all produce the same result:

    var myTween:TweenLite = new TweenLite(mc, 1, {x:100});

    TweenLite.to(mc, 1, {x:100});

    var myTween:TweenLite = TweenLite.to(mc, 1, {x:100});

     

    So you can use:

    var myTween:TweenLite = TweenLite.to(mc, 1, {x:100, paused:true});

    to create a tween and access it later e.g.

    myTween.play();

    Not sure if this directly answers the question, but I hope this helps.

    X10

  5. HI Nebulous, thanks for that.

    From my (rather limited) knowledge, the first thing to try is changing the overwrite value so the tween in the btnRollOver and btnRollOut functions does not overwrite the current tween of putting the buttons on stage.

    Otherwise, logically what needs to happen is the ROLL_OVER and ROLL_OUT event listeners need to go outside of the function creating them, which you could do in the main function with OnComplete();

     

    Try:

     

    TweenLite.to(e.currentTarget, 0.2, {transformAroundCenter:{scaleX:1.1, scaleY:1.1, overwrite:0}});

    OR

    TweenLite.to(e.currentTarget, 0.2, {transformAroundCenter:{scaleX:1.1, scaleY:1.1, overwrite:2}});

     

    And let us know if that helps.

     

    NOTE:

    TweenLite only recognises OverWrite 0 or 1, you will need to init the Overwrite Manager for option 2 (AUTO) (Or use TweenMax):

     

    import com.greensock.OverwriteManager;  //Import OverWrite Manager
    import com.greensock.TweenLite;
    OverwriteManager.init(OverwriteManager.AUTO); //Initialise it with the AUTO mode for all Tween by default

    See more in the Docs here and the Tutorial here.

     

    Let us know how you get on with the OverWrite option and if not you can try the OnComplete way.

     

    X10

  6. Hi keleko,

    In the code you posted the TimelineLite instance hasn't actually been populated with anything, I added 3 movieclips to the stage and added them to the TimelineLite instance then tried the code you posted & it works exactly as expected. You wouldn't need to use TimelineMax for this basic functionality.

     

    As you haven't got anything in the TimelineLite instanace there is nothing to stop, pause or reverse.

     

    See my complete code below:

     

    import com.greensock.*;
    import com.greensock.easing.*;
    var timeline:TimelineLite = new TimelineLite();
    
    timeline.append(TweenLite.to(movieclip_1,2,{y:50}));
    timeline.append(TweenLite.to(movieclip_2,2,{y:50}));
    timeline.append(TweenLite.to(movieclip_3,2,{y:50}));
    
    movieClip_4.addEventListener(MouseEvent.MOUSE_OVER, over);
    
    function over(event:MouseEvent):void {
    timeline.play();
    }
    movieClip_4.addEventListener(MouseEvent.MOUSE_OUT, out);
    
    function out(event:MouseEvent):void {
    timeline.stop();
    }
    movieClip_5.addEventListener(MouseEvent.MOUSE_OVER, overreverse);
    function overreverse(event:MouseEvent):void {
    timeline.reverse();
    }
    movieClip_5.addEventListener(MouseEvent.MOUSE_OUT, outreverse);
    
    function outreverse(event:MouseEvent):void {
    timeline.stop();
    }

     

    I had to add, "movieclip_1", "movieclip_2", "movieclip_3" to the stage just so we could see what was going on.

    If you need some more info on how to use TimelineLite, start with the basic tutorial, and then you can get more information in the AS Documentation. Feel free to come back to the forums if you're still stuck!

    FLA is attached.

  7. I'm also getting an error: 1126: Function does not have a body.

    the corresponding line....

    function addCallback(callback:Function, timeOrLabel:Array, params:* = null):TweenLite

     

    you haven't added a body for the function so it should look like:

     

    function addCallback(callback:Function, timeOrLabel:Array, params:* = null):TweenLite {
    //Your actions here
    }

  8. Hi muldy, can you be a bit more specific with how it's not working so we can provide further assistance, if you could post the error Flash gives you that would be good.

     

    Just to clarify, where I typed:

    function myAnimation():void{
    TweenMax.from(logo, 1.2,{scaleX:0, scaleY:0, ease:Back.easeOut, onCompleteListener:kill});
    TweenMax.from(logo1, .6,{scaleX:0, scaleY:0, ease:Back.easeOut, delay:.6, onCompleteListener:kill});
    ....
    myAnimation();
    }

     

    the "...." means "the rest of your code" and myAnimation(); goes at the end. Just in case that wasn't clear :)

     

    X10

  9. Hi Muldy,

    There are 2 ways you could repeat this animation.

     

    1) Put the Tweens into a TimeLineLite or TimeLineMax.

     

    var myTimeline:TimelineMax = new TimelineMax({repeat:2, repeatDelay:1.5});
    myTimeline.append(TweenMax.from(logo, 1.2,{scaleX:0, scaleY:0, ease:Back.easeOut, onCompleteListener:kill}));
    myTimeline.append(TweenMax.from(logo1, .6,{scaleX:0, scaleY:0, ease:Back.easeOut, delay:.6, onCompleteListener:kill}));
    ....

     

    Where it says repeat:2 you can use repeat:-1 to repeat infinitely, have a look at the documentation if you need some help in the explanations.

     

    2) Put your tweens into a function and at the end call the function

     

    function myAnimation():void{
    TweenMax.from(logo, 1.2,{scaleX:0, scaleY:0, ease:Back.easeOut, onCompleteListener:kill});
    TweenMax.from(logo1, .6,{scaleX:0, scaleY:0, ease:Back.easeOut, delay:.6, onCompleteListener:kill});
    ....
    myAnimation();
    }

     

    if you need a delay before the animation repeats you can use the Delayed Call feature of TweenMax, so instead of just myAnimation() above you could have:

    TweenMax.delayedCall(2, myAnimation);

    Where 2 represents the number of seconds before the call to the function is made (assuming you are using time for your timing mode instead of frames).

     

    I hope this all makes sense, give us a shout back if you have further questions or run into trouble.

     

    X10

     

    EDIT: Missed a semi-colon in the code above.

  10. Hi aesser, I realise I might not be fully understanding the issue, so apologies in advance, but to check if the timelines are playing, can you not check if subTimeline.totalProgress = subTimeline.totalDuration, then you will know if it's playing or ended?

  11. Hi felixaburg,

    I'm not an expert on these things but using absValue will return a decimal value, so I wonder if you actually want to return a whole number, so all the pixel align.

    I noticed on your example that sometimes I could move the mouse to get the screen to not have the white lines and I think absValue might be the cause of this.

    Did you try using a function that would return a whole number, rather than a decimal?

    Also, are the heights and containers even or odd values, I wonder if dividing on an odd number would give a half pixel amount that also adds to the issue?

  12. Hi tomKnox,

    This has been a really useful post. I was just wondering if you got the 'drawing' of the line working via onUpdate and if you could share it with us?

     

    I'm trying to acheive the same thing, but so far I am at a loss as to what parameters I am pasring from the tween to the function in order for lineTo to incrementally draw.

     

    I've got this so far, but just confused on what I should be parsing through onUpdateParams and where to use them in the function:

     

    import flash.display.Sprite;
    import com.greensock.TweenMax;
    import com.greensock.plugins.BezierPlugin;
    import com.greensock.plugins.BezierThroughPlugin;
    
    var sp:Sprite=new Sprite();
    addChild(sp);
    
    sp.graphics.beginFill(0xff0000);
    sp.graphics.drawEllipse(-5,-3,10,6);
    sp.graphics.endFill();
    
    TweenMax.to(sp,5,{bezierThrough:[{x:250,y:100},{x:50,y:200},{x:500,y:200}]});
    
    this.graphics.lineStyle(1);
    
    var xA:Array=[0,250,50,500];
    var yA:Array=[0,100,200,200];
    var bezierObj:Object=BezierPlugin.parseBeziers({"x":xA,"y":yA},true);
    
    function drawme():void{
    
    var pointCount:int=0;
    while(pointCount{
    this.graphics.curveTo(bezierObj.x[pointCount][1],bezierObj.y[pointCount][1],bezierObj.x[pointCount][2],bezierObj.y[pointCount][2]);
    pointCount++;
    }
    }
    drawme();

  13. Hi Zync, thanks for that. It's a pretty good halfway house and would speed up co-ordinate typing time.

     

    The problem really lies with not being able to see the path, which is where a lot of the time is spent with tweaking as slight changes in co-ordinates can drastically change parts of the path. Is there any way to get the path to be drawn, in much the same way as in Jack's plugin explorer?

     

    X10

  14. I've started to use Bezier curves in a few flash animations via the Bezier and BezierThrough plugins (thanks Jack!), but I'm finding it difficult to create points and see what I'm working with.

    The Plugin Explorer is useful to a degree, but it only goes to a maximum of ~350 on the x axis and ~400 on the y axis, and it also starts at a fixed point, so it's no good to generate sample code for when the stage is, for example, 600 x 600.

     

    I've searched the Interwebs for a useful tool to do this, but I can't seem to find anything that allows you to preview a curve that gives you bezier x,y co-ordinates.

    So I'm wondering if anyone has a solution or example they have come across?

     

    Many thanks!

  15. I need to have text change out when a user clicks a certain button. I was admittedly tired when trying that which I'm sure is the issue. So if I had 5 buttons, what would be the best way to swap out the text? And can I do that with images too? Many, many thanks to everyone from an excited newbie...

     

    If you want the text to change when the user clicks the button, instead of MOUSE_OVER/MOUSE_OUT/ROLL_OVER/ROLL_OUT, use MouseEvent.CLICK

     

    e.g.

        Object(this).button_mc.addEventListener(MouseEvent.CLICK,show2);

     

    X10

     

    EDIT: SEE ATTACHED FLA Example (Flash CS4)

  16. Hey as3gs,

    The reason your tween seems to not work is because the tween is still happening, all you are doing is replacing the text, not the entire tween.

    So if your tween is 2 seconds, like in the code I posted, and you roll off after 1 second, the alpha for that movieClip is still happening, but the text changes straight away.

    This is an overwrite issue that can be fixed quite easily with setting the overwrite to true in both tweens. Have a look at the information for the OverWrite Manager to help you understand.

    I have also added a "Finished" function so you can trace and see what's happening:

     

    I also changed the MOUSE_OVER AND MOUSE_OUT to ROLL_OVER and ROLL_OUT, see Jack's post here about it, not so much an issue with your code, but useful to know

     

        import com.greensock.*;
    
    
       var test1:String = "THIS IS THE ORIGINAL TEXT";
       var test2:String = "HEY THIS IS NEW TEXT!";
    
       message_txt.text = test1;
    
    
    
       function show1(evt:MouseEvent):void
       {
          message_txt.alpha=0;
       trace('alpha show1 done')
          TweenMax.to(message_txt, 2, {alpha:1,onComplete:finished,overwrite:true});
       trace('message show1 done')
          message_txt.text = test1;
      	   trace('text show set to test1')
       }
       function show2(evt:MouseEvent):void
       {
          message_txt.alpha=0;
       trace('alpha show2 done')
          TweenMax.to(message_txt, 2, {alpha:1,onComplete:finished,overwrite:true});
       trace('message show2 done')
          message_txt.text = test2;
      	   trace('text show2 set to test2')
       }
    
    function finished():void{
    trace ("this tween finished");
    }
    
       Object(this).button_mc.addEventListener(MouseEvent.ROLL_OVER,show2);
       Object(this).button_mc.addEventListener(MouseEvent.ROLL_OUT,show1);

  17. Hi Aksel,

    If you're using a TimelineLite/Max, you can use a time offset on the second tween so they happen at the same time:

     

    myTimeline.append(TweenLite.to(mc1, 2, {alpha:0}));
    myTimeline.append(TweenLite.to(mc2, 2, {alpha:1}),-2);

     

    or without TimelineLite/Max create a function that has the tweens in it:

     

    function crossFade():void
    {			
    TweenLite.to(mc1, 2, {alpha:0});
    TweenLite.to(mc2, 2, {alpha:1})
    }

  18. Hi as3gs,

    I'm a little confused as to why you're calling the same function at the end of each function, this might have something to do with your problem.

     

    I removed the onComplete's and it works as I would expect it to, was there something you wanted the function to do when it finishes it's Alpha tween?

     

        import com.greensock.*;
    
       var test1:String = "THIS IS THE ORIGINAL TEXT";
       var test2:String = "HEY THIS IS NEW TEXT!";
    
       message_txt.text = test1;
    
       function show1(evt:MouseEvent):void
       {
          message_txt.alpha=0;
       trace('alpha show1 done')
          TweenMax.to(message_txt, 2, {alpha:1});
       trace('message show1 done')
          message_txt.text = test1;
      	   trace('text set to test1')
       }
       function show2(evt:MouseEvent):void
       {
          message_txt.alpha=0;
       trace('alpha show2 done')
          TweenMax.to(message_txt, 2, {alpha:1});
       trace('message show2 done')
          message_txt.text = test2;
      	   trace('text set to test2')
       }
    
       Object(this).button_mc.addEventListener(MouseEvent.MOUSE_OVER,show2);
       Object(this).button_mc.addEventListener(MouseEvent.MOUSE_OUT,show1);

     

    Perhaps I'm missing what you're trying to do

×