Jump to content
Search Community

Carl last won the day on December 24 2023

Carl had the most liked content!

Carl

Moderators
  • Posts

    9,824
  • Joined

  • Last visited

  • Days Won

    546

Everything posted by Carl

  1. var FooterTween:TweenMax = new TweenMax(Content_mc.Introduction.Footer, 5, {y:410, repeat:1, yoyo:true}); this will play the tween forward once and then in reverse. to repeat indefinitely change the repeat to repeat:-1 learn more here: http://www.greensock.com/as/docs/tween/ ... enMax.html
  2. assuming the problem is with waiting a minute and not loading the swf, you can use TweenLite.delayedCall() delayed call allows you to set a delay in seconds and also specify what function to run. you could use it like this: TweenLite.delayedCall(60, loadSwf) function loadSwf(){ trace("time to load the swf"); //add loaderMax code here to load swf } if you need to learn about loading external content read this: http://www.greensock.com/loadermax/
  3. it's a pleasure to help. I hadn't used roundProps before. there is always something more to learn. very glad it worked for you! carl
  4. Yeah, that can be done. But just to clarify for others, you are going to be tweening a numeric variable / property that will displayed in a textfield. here is some sample code that will do that for you: import com.greensock.*; import com.greensock.easing.*; var score:Number = 0; //start value var targetScore:Number = 20; //end value TweenLite.to(this, 1, {score:targetScore, onUpdate:showScore, ease:Linear.easeNone}); function showScore(){ trace(score); score_mc.score_txt.text = int(score); //you could also use Math.round() } basically you can tween any property, in this case score just like you would tween the alpha of a movieclip. In order to visualize the change in value of the score property, you use an onUpdate callback to round your number and then place it in a textfield. here is a video and source files for more explanation: http://www.snorkl.tv/2010/09/how-to-tween-a-variable-with-flash-and-tweenlite/ here is a good reference for rounding to certain decimal places if you ever need it: http://kb2.adobe.com/cps/155/tn_15542.html Once you understand the basic concept check out the roundProps plugin for tweenlite/max in the plugin explorer: http://www.greensock.com/tweenmax/ if using tweenMax, the code above could look like this: TweenMax.to(this, 1, {score:targetScore, roundProps:["score"], onUpdate:showScore, ease:Linear.easeNone }); AND you wouldn't have to use int() or round() in the onUpdate function. If using TweenLite, the roundProps plugin would have to be activated import com.greensock.plugins.*; TweenPlugin.activate([RoundPropsPlugin]);
  5. Hi Benkyma, Good morning! TweenLite can handle your effect with its eyes closed and not miss a beat. If you attach a stripped-down fla with just the pertinent thumbnail functionality saved as CS4 or earlier I will take a look at it. Also if you post a snippet of the AS code you are using to apply your roll_over and roll_out effects that could help as well. here is a checklist of things I would look into: -are you using the latest version of tweenlite -do you have other complex enterframe events firing or loops running -what is the framerate of the fla -is there anything wonky with the images being used, like being super large and just sized-down in the IDE. Also, try previewing your swf in a browser, on my end, using a high-powered mac with CS4, the flash player used during a control > test movie runs swfs really poorly and is not a good reference of how swfs will run in a browser or the stand-alone player. As a reference here is a little experimental project I built that loads around 50 thumbnails and does just a simple scale and colortransform on rollover. It should run buttery smooth (regardless of how quickly you rollover/out) and give you a good idea the excellent performance you can expect from TweenLite: http://www.doyouhaveapen.com/extranet/puzzle/. there is nothing fancy going on beyond normal usage of tweenlite. I am sure your problem can be solved. Carl
  6. hello jrojas, I don't think there is an out of the box greensock solution for this. Your example shows that the image is not dropped but thrown. What is happening theoretically is that the speed of your mouse along the x and y axis is constantly being determined, when you release the mouse that speed is used used to propel the image in the proper direction and friction slows it down. a partial example of the code involved is available here: http://efreedom.com/Question/1-1941989/ ... op-Inertia the physics2d plugin might come in handy. its a club greensock benefit and you can see its power in the plugin explorer: http://www.greensock.com/tweenlite/ regardless of the solution you use, you are going to have to determine the direction and speed of the mouse movement. to determine how hard the object is thrown and in which direction. This is often achieved by continuously sampling the current mouse position (on an EnterFrame or MouseMove event) compared to the previous mouse position (both mouseY mouseX). Try googling: drag and throw smooth drag drag and drop easing drag and drop inertia unfortunately it isn't a quick answer. Carl
  7. hey, glad you got a solution. you can also use tl.resume(); carl
  8. check out this thread here. viewtopic.php?f=1&t=3853 basically you have to figure out the duration based on distance prior to setting up the tween. carl
  9. hey seasonss, That is a very intriguing effect you are going for. I don't have the best answer, but hopefully this simplified approach might spark some ideas that you can implement. check this out: http://snorkl.tv/dev/bezier/ This is my first time working with the bezier plugin so I wanted to keep it real simple. Basically there is ONE tween in a TimelineMax instance. Each button is set up to have the TimelineMax play to 25% intervals along the timeline. btn 1 goes to 0% btn 2 goes to 25% btn 3 goes to 75% btn4 goes to 100% here is the code: import com.greensock.*; import com.greensock.easing.*; var tl:TimelineMax = new TimelineMax({paused:true}); tl.insert(TweenMax.to(floater_mc, 2, {bezierThrough:[{x:400, y:300}, {x:700, y:150}], orientToBezier:true, ease:Linear.easeNone})) btn1.addEventListener(MouseEvent.CLICK, goBtn1); function goBtn1(e:MouseEvent):void{ tl.tweenTo(0); //tween to beginning of timeline } btn2.addEventListener(MouseEvent.CLICK, goBtn2); function goBtn2(e:MouseEvent):void{ tl.tweenTo(tl.duration *.25); // tween to 25% the duration of the timeline } btn3.addEventListener(MouseEvent.CLICK, goBtn3); function goBtn3(e:MouseEvent):void{ tl.tweenTo(tl.duration *.5); // } btn4.addEventListener(MouseEvent.CLICK, goBtn4); function goBtn4(e:MouseEvent):void{ tl.tweenTo(tl.duration *.75); } btn5.addEventListener(MouseEvent.CLICK, goBtn5); function goBtn5(e:MouseEvent):void{ tl.tweenTo(tl.duration); } Benefits once you figure out your bezier control points its really easy to get working. the amount of code is ridiculously insignificant. Drawbacks does not support easing since there is constant speed, there is a direct 1:1 relationship between amount of time elapsed and amount of distance travelled. this makes it real easy to figure out what point in time each button should tween to. Another approach might be to make a movie clip with the triangle tweening along a motion guide. you could then add framelabels to the movie clip and use tweenlite to tween to various frames on that timeline. you would gain the ability to use easing. your buttons would call functions that would do things like: TweenLite.to(nav_mc, 1, {frameLabel:"tutorials", ease:Cubic.easeOut}); TweenLite.to(nav_mc, 1, {frameLabel:"game", ease:Cubic.easeOut}); hopefully one of these options suits you. let us know how it goes. Carl
  10. There were a few syntax errors in there. The following code will not throw any errors and if you have movieclips called object1, and object2 on the stage. they will appear to grow once. import com.greensock.*; import com.greensock.easing.*; var timeline1:TimelineLite; var timeline2:TimelineLite; var timeline3:TimelineLite; var timeline4:TimelineLite; var timeline5:TimelineLite; var timeline6:TimelineLite; var timeline7:TimelineLite; var timeline8:TimelineLite; var timelineArray:Array; timelineArray = new Array(timeline1,timeline2,timeline3,timeline4,timeline5,timeline6,timeline7,timeline8); for(var i = 0; i myFunction(i); } function myFunction(number){ timelineArray[number] = new TimelineLite(); timelineArray[number].insertMultiple([ TweenMax.to(object1,1, {scaleY:2,ease:Back.easeOut}), TweenMax.to(object2,1,{scaleX:2,ease:Back.easeOut}) ], 0, TweenAlign.START, 0.3); } What you are doing here is creating 8 timelines that all tell the same 2 objects to change the same property on each clip all at the same time. here are some of the thing i fixed: function myFunction(number){ var number; doesn't do anything timelineArray[number]:TimelineLite kill that = new TimelineLite(); timelineArray[number].insertMultiple([ TweenMax.to(object1,1{scale there is no scale property, use scaleX and or scaleY :1,ease:Back.easeOut}), TweenMax.to(object2,1,{scale:1,ease:Back.easeOut}), ] hard bracket ] in the wrong place (see my code), 0, TweenAlign.START, 0.3); } It is a little tricky keeping track of the ()[] when using insertMultiple. But once you do it right a few times it comes natural. since you are using a loop, you could probably avoid declaring all the timelines at the top and manually inserting them into your array. Perhaps you can explain what you are trying to accomplish and someone can help you optimize your code. Keep at it. Carl
  11. Very cool. Hey, sometimes we are forced to stick with what works for the moment. I am absolutely certain your experimentation will pay off. Thanks for sharing the final product! -Carl
  12. Hey Jamie, well I just couldn't let this rest...had to give it a shot. the finished product can be viewed here: http://www.snorkl.tv/dev/seriesBackAndForth/ THE CODE: import com.greensock.*; import com.greensock.easing.*; //create TimelineMax instance and set to repeat infinitely var timeline:TimelineMax = new TimelineMax({repeat:-1}); //speed vars var inOutDuration:Number = .5; var slideDuration:Number = 3; //array of all clips //note: since clips are named chronologically they don't need to be an array, but its nice:) //we could just loop through them by name "t" + i var boxes_arr:Array=new Array(t1,t2,t3,t4,t5,t6); //loop through each item in the array for (var key:String in boxes_arr) { //create reference to each individual clip var mc:MovieClip=MovieClip(boxes_arr[key]); //detect clips with index of 0,2,4,6... //by checking if the current index divided by 2 has a reminder aka modulo operation if ((Number(key)%2)==0) { trace(key + " even"); //create left -> right sequence timeline.append(TweenMax.to(mc, 0, {x:-200, y:12, blurFilter:{blurX:20}})); timeline.append(TweenMax.to(mc, inOutDuration, {x:20, blurFilter:{blurX:0}, delay:.5})); timeline.append(TweenMax.to(mc, slideDuration, {x:440, ease:Linear.easeNone})); timeline.append(TweenMax.to(mc, inOutDuration, {x:660, blurFilter:{blurX:20}})); } else { //create right -> left sequence timeline.append(TweenMax.to(mc, 0, {x:660, y:12, blurFilter:{blurX:20}})); timeline.append(TweenMax.to(mc, inOutDuration, {x:440, blurFilter:{blurX:0}, delay:.5})); timeline.append(TweenMax.to(mc, slideDuration, {x:20, ease:Linear.easeNone})); timeline.append(TweenMax.to(mc, inOutDuration, {x:-200, blurFilter:{blurX:20}})); } } Note the first append() in each sequence. I'm using this to initialize all the start values, instead of doing the .from() like you. I only took this approach as it allows me to have my movie clips arranged however I want, fully visible off-stage (see image below). Makes it real easy for myself and clients to select and edit symbols without having to have them all on top of each other in separate layers or whatever. No real difference in the way the swf runs. I axed my idea of making each sequence its own timeline as I didn't see any advantage in that. Perhaps if each sequence needed to yoyo or have callbacks added it would make sense. If you need any help deciphering the code just let me know. I'm really impressed with your ability to watch my vid and jump right in and try to build something like this. I can make videos til you turn blue, but unless you challenge yourself like this... its pointless. Great job! Honestly, it helped get my brain into gear this morning and revived my love for TimelineMax ! This was an excellent example of showing where TimelineMax really shines. Doing this on the flash timeline would have been a nightmare to setup or make global edits to. I regret that I'm still not quite seeing your point: " to change the array I would do one of the following: edit the array by hand in code programmatically reverse the array : array.reverse() The array simply lets you dictate the exact order the clips are added to the timeline. Its up to us to put them in their in the desired order. Does this help? If i'm totally misunderstanding, let me know. I hope my code and examples help. I'll attach a zip of the all the source for you and anyone else. Carl
  13. Hi Jamie, I gotta say I really appreciate the clarity of your question and the effort that went in to explaining a fairly complex issue. I've looked at your swfs (a huge help) and definitely know the results the solution should produce. There are a few ways to tackle this and I'll probably come up with a solution somewhere right between the best and worst;) I think where I'm headed with this is that each sequence will be converted to a new timeline with the following tweens: 1:clip slides on screen quickly 2:clip slides across screen a bit slower 3:clip zips out then I will add all these sub timelines, to a main timeline. most likely I will put all your clips into one array. then i'll loop through the array and all the odd numbered clips will be placed in a timeline that handles left > right movement, and even numbered clips will move right > left. this is definitely a good exercise for me to get some real-world timelineMax experience! I'll let you know when this is done. Would love for it to be today, but can't promise. Best, Carl
  14. oh snap. I didn't think of that. although by passing in the y property as a string "50", all icons will move 50pixels from where they are, so if you have a clever way of placing them initially 50 pixels away from where they are going too... ahhh probably won't get you away from the loop anyway. hmmm. (i'm just using 50 x pixels as an example). Well since you have a loop already in place, you can append all your tweens into a TimelineLite/Max instance and then at least when the timeline is done you can fire an onComplete function. as far as the amount of code needed it will probably be a touch more than your existing loop, but it may get you a few personal neatness points
  15. Yeah, if you put all your icons in an array you can use TweenMax.allFrom or TweenMax.allTo like so: var icons:Array = new Array(icon1, icon2, icon3); TweenMax.allTo(icons, 1, {y:"50"}, 0, done); function done(){ trace("done"); } //0: delay / stagger between tweens running //done: name of function to call when all tweens are complete
  16. Hey Alaricoffir, TimelineMax instances start playing immediately. Since you tl instance has nothing in it is completes instantly. try this import com.greensock.TimelineMax; var tl:TimelineMax = new TimelineMax({onComplete:complete, paused:true}); tl.insert(new TweenLite(movieClipInstanceName, 2, {alpha:0})); tl.play(); function complete():void { trace('completed'); } note the paused:true in the constructor. this tells the timeline not to play instantly. also note the addition on tweenlite instance and the tl.play() method... that gets it going. once you experiment with timelinemax a bit you will be in love. Carl
  17. Thanks wjt. I appreciate your kind comments and support. I'm just getting rolling.
  18. Jack, Wow. I'm totally grateful to you. I had no idea about the promotion / contest. The concept of YOU giving something to ME is difficult to comprehend. TweenMax has saved my butt on soooo many occasions. Just recently on a project I was dying to get my hands on the customEase classes as I needed something just slightly snappier than a Back.easeOut. I've always been really eager to dig into splitTextfield as well. I made something that works similarly for myself awhile ago but it isn't very flexible and I know it is complete garbage compared to what you have made. I look forward to getting into these premium features. When I started making Flash tutorials I wanted to focus on things that are easy to comprehend and help beginners add big value to their workflow and end results. Your tweening platform has so many little nuggets to explore that meet that criteria. Whenever I consider what to tutorialize, TweenMax is so much more fun to talk about than generic AS3. I will gladly keep churning them out. Again, thanks so much for allowing me to post here, your kind comments, and generous reward. Carl
  19. Hey Guys and the Exalted Greensock, I've been using greensock code for quite awhile and wanted to share a few quick video tutorials I've done that highlight some awesome features of the platform. Hopefully these videos will get you excited about using this tool and open your eyes to the fact that its much more than just making things move from point A to B. I've gained so much from using this platform and from the flash community as a whole. Its time to give a little back: Random Color Tweens http://www.snorkl.tv/2010/08/flash-cs4-actionscript-3-0-and-tweenmax-random-tint-color-tween/ How to Tween A Variable / What the heck is onUpdate for? http://www.snorkl.tv/2010/09/how-to-tween-a-variable-with-flash-and-tweenlite/ Random Perpetual Motion with TweenMax http://www.snorkl.tv/2010/08/tweenmax-and-actionscript-random-perpetual-motion-tutorial/ Easiest way to pause A Flash timeline for any amount of time without adding tons of frames http://www.snorkl.tv/2010/09/how-to-pause-a-flash-timeline-without-adding-frames-or-using-a-clunky-timer/ Love, Carl
×
×
  • Create New...