Jump to content
GreenSock

Carl last won the day on October 13

Carl had the most liked content!

Carl

Moderators
  • Posts

    9,681
  • Joined

  • Last visited

  • Days Won

    540

Everything posted by Carl

  1. hello timaging. I am having difficulty understanding your problem. I am confused by also: also please post the error. from what I can tell, your code: buttonSkipOff.addEventListener(MouseEvent.CLICK, fl_ClickToGoToWebPageS); function fl_ClickToGoToWebPageS(event:MouseEvent):void { yourTimeline.currentProgress = 0.9; } appears to be correct. Perhaps if you rephrase the question with just the elements that are not working I can be of better assistance also if you want yourTimeline to stop when it gets to .9 be sure to add yourTimeline.stop(); to the button code. Carl
  2. doh. i thought the scroller was part of the image
  3. i'm glad you got this resolved and updated the post, although it is puzzling that TimelineMax somehow fixed it. I also don't see how the screenshot proved the existence of a scene that was supposedly missing and causing an error. very strange. I wonder, is stateOutline something that is even capable of having a "scene"? i'm happy that you got it working!
  4. Hello Learner_7n, The car animation you linked to is actually a flash timeline animation. The easiest approach would be: TweenLite.to(some_mc, 1, {x:200}); TweenLite.to(some_mc, 1, {x:400, delay:5}); Carl
  5. try this: TweenMax.to(stateOutline, .5, {alpha:0, delay:14.5, onComplete:goNextScene}); function goNextScene(){ stateOutline.gotoAndPlay(1, "Nav01intro") } for the onComplete property it is best to pass in the name of a function and not try to define a function there. -Carl
  6. using TimelineMax you can adjust playback rate / timeScale so you can speed up or slow down a single tween or an entire sequence of tweens. http://www.greensock.com/timelinemax/ view the interactive example and adjust the timeScale property. I believe that once a TweenLite/Max instance is created its duration and all properties are set for the lifespan of the Tween. the dynamicProps plugin will allow the end values of the properties to change mid-tween. see the plugin explorer. using TweenLite or TweenMax you can dynamically set a duration upon the tweens creation by calculating the distance needed to travel and the desired speed of movement. If you have a specific scenario you need a solution for perhaps someone can provide more detailed help. I think you will find that the many features of greensock can enhance anything you would do with normal ActionScript.
  7. are you familiar with mask layers? it sounds like you want to do something similar to this: http://www.snorkl.tv/2010/08/hgtv-text- ... ith-flash/ are you using tweenlite?
  8. Carl

    TimelineMax

    timeline.append(mc1, 1, {x:200})); timeline.append(mc2, 1, {x:200}), -.5); mc2 will start half a second before mc1 ends because it has a negative offset -.5 check out http://www.greensock.com/as/docs/tween/ ... ml#append() and the rest of the info. There are a ton of fun things to play with Carl
  9. Hello FelipeSAMA, I had a hard time understanding what your question is. I looked at your zip but you only included a swf which didn't help much. The animation is very nice. TimelineLite/Max can basically replace anything you can do on the maintimeline in Flash and much more Being that it is code-based you have tremendous flexibility to adjust the speed of your animation and sequence hundreds or thousands of tweens. please watch these videos http://www.greensock.com/timeline-basics/ http://www.snorkl.tv/?s=timelinemax If after watching the videos you have a specific question about implementing any of the features, someone here will be glad to help you. it is always best to start learning this stuff by experimenting with a very small goal in mind. Trying to learn it while trying to integrate into a complex project may prove frustrating. Carl
  10. the gs.easing folder is an old version. your code should be: import com.greensock.TweenLite; import com.greensock.easing.*; if for some reason that doesn't work and you have old mixed up files.... get rid of the com and gs folders download the most recent version from www.greensock.com extract the zip place only the com folder (pertinent to your actionscript version AS3/AS2) next to your fla try again. good luck! Carl
  11. Damian, Glad to help. Yeah, your final code is great and I like the switch on the navClick. As for best practices and classes v timeline code. It can be a divisive issue. The way things are going I would encourage you to experiment more with breaking things into classes as that is the way things are going and you will learn good habits that will pay off as your skills increase and the scope of your projects increase. I find with my audience and the style of tutorials I do it is just easier to keep everything in one file and focus on very basic concepts. Also I'm no master of the class-based approach as I am still learning and sorting it all out. There is a time and a place for everything. There is plenty of cool stuff you can do on frame 1 of a timeline but it can get messy fast. The main problem is that most people (with no programming experience) struggle just to understand how to "click the button and go to a url"... when you throw in... create a new AS file... import these 12 classes... make this a private function... this protected... extend that... I feel it is a huge barrier to people who just want to make a circle bounce and change color every 5 seconds;) If you are just starting out, continue to read as much about OOP as you can... it will pay off! You should be very pleased with yourself for getting your project to work as you did. If you can get that far you have what it takes to keep learning more and it will get progressively easier. Carl
  12. Hey iceKomo, I'm flying a bit blind here but what I'll take a stab. what happens if you remove this.mouseChildren = false. does this class define the behavior of a menu that contains individual buttons or does it define the behavior of an individual button? the best thing to do is run a trace(event.target.name) in your mouse event handler functions. I'm thinking that killing the mouseChildren is preventing subclips from being the target of mouse events. Carl
  13. Hello, First, off congratulations on getting your buttons to work and your effort to implement the greensock classes. There are so many cool things to play with. There are many ways to get things done with AS3 in general and greensock. As for the efficiency aspect of your code. I don't see that there is much benefit to using TimelineLite in your particular case as TweenLite on its own can handle the simple fade. TimelineLite comes into play more when you are dealing with sequencing tweens. I notice you are using the timeScale property which is cool, but if you just have one tween, changing the duration is just as easy as setting a timeScale. your event handler functions code could simply be: function navBtnRollOver(evt:MouseEvent):void { TweenLite.to(this.deco_mc, .4, {alpha:1, ease:Sine.easeIn}); } function navBtnRollOut(evt:MouseEvent):void { TweenLite.to(this.deco_mc, .4, {alpha:0, ease:Sine.easeOut}); } I guess having timelineLites built could help for extending the animation effects in the future, but for a fade-in it is a bit overkill. Below are a few video tutorials I made that show a few different ways of efficiently having multiple MovieClip buttons share similar functionality. They are not class-based but pretty much hammer home the concepts of using target vs currentTarget properties of event objects. If anything download the sample files and take a look at them. They may serve as a good starting point for projects in the future. http://www.snorkl.tv/2010/08/assign-eve ... enttarget/ http://www.snorkl.tv/2010/11/create-a-s ... y-clicked/ http://www.snorkl.tv/2010/11/part-1-bui ... flash-as3/ http://www.snorkl.tv/2010/09/tweenmax-t ... wn-by-now/ of greater importance: http://www.greensock.com/tweening-tips/ read the api docs often! spend time reading through the posts on this forum. there is so much good stuff hidden in here. enjoy Carl
  14. hey artguy, first, and it's probably just a typo or you forgot to uncomment something you were testing: mc_play.addEventListener(MouseEvent.ROLL_OVER, forward); mc_play.addEventListener(MouseEvent.ROLL_OVER, reverse); you are overwriting the first ROLL_OVER on mc_play with the second. next, reverse() is a method that gets applied to a tween and not a movie clip directly. here is a basic implementation: import com.greensock.*; import com.greensock.easing.*; btn.addEventListener(MouseEvent.ROLL_OVER, btnOver); btn.addEventListener(MouseEvent.ROLL_OUT, btnOut); var playMovie:TweenMax ; function btnOver(e:MouseEvent):void{ playMovie = TweenMax.to(play_mc, 1, {frameLabel:"end"}); } function btnOut(e:MouseEvent):void{ playMovie.reverse(); } so you are telling the tween to reverse and not the movie clip. have fun Carl
  15. from what i'm getting of your situation (and i could be wrong)... i think the solution could be much simpler. I would suggest taking the use of the duration of the video as a delay / offset out of the equation completely. add an onComplete callback to the arrow tween that does a timeline.pause(). Or whenever it is that the video starts playing when the video is done playing fire an event that will trigger the timeline to resume or play. when the user clicks "skip" do the same. it appears you are already using an onComplete and have a solid knowledge of greensocky stuff so it should be pretty easy for you to whip up. its my impression that when the video is playing, the timeline isn't tweening any other objects so pausing it shouldn't hurt. when you resume... everything just tweens out as scheduled. hope this helps -Carl
  16. add the imports import com.greensock.*; import com.greensock.easing.*; assuming your button is starting with a y of 0: btn.tween = TweenLite.to(btn, 3, {y:2-*(btn.height + 10), ease:Elastic.easeOut}; take a look at the interactive tweening demo here: http://www.greensock.com/tweenlite/ enjoy greensock. Carl
  17. fixed fla attached here is the code import flash.display.MovieClip; import com.greensock.*; import com.greensock.plugins.*; import com.greensock.TweenMax; import flash.events.MouseEvent; import fl.transitions.*; import fl.transitions.easing.*; var imageLoader:Loader; var xml:XML; var xmlList:XMLList; var xmlLoader:URLLoader = new URLLoader(); var numClips:int=6; var columns:int=2; xmlLoader.load(new URLRequest("data/images.xml")); xmlLoader.addEventListener(Event.COMPLETE, xmlLoaded); function xmlLoaded(event:Event):void { xml=XML(event.target.data); xmlList=xml.children(); for (var i:int = 0; i imageLoader = new Loader(); imageLoader.load(new URLRequest(xmlList[i].attribute("thumb"))); imageLoader.x = 6 +( i % columns )*600; imageLoader.y = 6 +(Math.floor(i/columns)*106); imageLoader.name=xmlList[i].attribute("source"); imageLoader.addEventListener(MouseEvent.CLICK, showPicture); //Carl did this: imageLoader.alpha=0; imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, startListener) //addChild(imageLoader); } } function showPicture(event:MouseEvent):void { imageLoader = new Loader(); imageLoader.load(new URLRequest(event.target.name)); imageLoader.x=165 imageLoader.y=6; //Carl did this imageLoader.alpha=0; imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, startListener) //addChild(imageLoader); } //this is where the fade happens function startListener(e:Event):void{ trace("loaded"+ e.target); var thisClip = e.target.loader; addChild(thisClip); TweenMax.to(thisClip, 1, {alpha:1}) } each imageLoader now has the ON_COMPLETE listener added to its contentLoaderInfo. one thing to watch out for in the future... you are literally re-creating A NEW loader over and over each time you click on a thumbnail and adding it to the stage. if you click the first thumb 10 times... the large image will load 10 times and you will have 10 instances of that image on the stage. in a larger gallery this could become problematic. for now, it works Carl
  18. you can just attach it to this thread / post. just hit "post reply" and use the upload attachment tab under the submit button.
  19. hello kbat, In order for TweenLite/Max to work in your gallery you are missing a very important component and that is an eventListener that will run when the images complete loading. You can read about event.COMPLETE here: http://www.republicofcode.com/tutorials ... as3loader/ if you tween the imageLoader before the content loads, it won't work very well. So you will need to add an evenListener to each imageLoader. I'm reluctant to provide a complete code solution as it isn't possible for me to test your existing code. If you post a zip of your gallery working I can take a look at it. Please try to keep it small with just a few images. Carl
  20. you should watch this video: http://tv.adobe.com/watch/actionscript- ... pisode-13/ I think you will find that after watching the majority of these: http://tv.adobe.com/show/actionscript-1 ... ug-winnie/ you will have a good solid base for doing more with greensock. happy flashing Carl
  21. an array in its simplest terms allows you to create a list of items. see: http://www.republicofcode.com/tutorials ... as3arrays/ the code you gave implies that you have an array that stores the names of all the movie clips you want to animate. so you would do something like this: var lettersArray:Array = new Array(a_mc, b_mc, c_mc, d_mc); you would also have to have movie clips on the stage with instance names a_mc, b_mc, c_mc now when you call timeline.insertMultiple( TweenMax.allFrom(lettersArray, 1, {y:"-30", alpha:0, ease:Elastic.easeOut}, 0.04), 1.4); each movie clip that is referenced in lettersArray will tween you could literally tween 100s of movie clips in this fashion
  22. the one thing that jumps out is onComplete: rollOverListen_global2(), should be onComplete: rollOverListen_global2, kill the parens()
  23. TweenMax has an isTweening() method that can check if an object is tweening or not. in the example below, the roll over listener checks the isTweening value of box_mc. If isTweening = true, the tween will not restart box_mc.addEventListener(MouseEvent.ROLL_OVER, boxOver); function boxOver(e:MouseEvent) { if (!TweenMax.isTweening(box_mc)) { TweenMax.fromTo(box_mc, 5, {scaleX:1}, {scaleX:5}); } }
  24. yeah, i'm a little lost in the explanation, but i think the problem is that you are mistaking how flash handles 3D. (not your fault) It isn't true 3d, its a pseudo 3d. when you do z-axis transformations it scales and moves objects so that they appear to be farther or closer, but it doesn't handle the layering of foreground and background elements. if in your flipper you have your back and front cards positioned on top of each other, try doing a 3d rotationX/Y rotation on the timeline with a motion tween... you'll see that the front card is always on front... there really is no back regardless of the z settings or even if they are in different layers, there is no top card or bottom card. I imagine you were trying to account for this by toggling the visibility. what you were hoping to have happen definitely makes sense in the real world... but not the flash ide what you want to do is have both front and back in your flipper clip with the instance names font and back. do a series of tweens like this import com.greensock.*; import com.greensock.easing.*; //hide the back flipper.back.alpha=0; //flip the font 90 TweenMax.to(flipper.front, .5, {rotationY:90, ease:Linear.easeNone}); //hide the front when it reaches 90 TweenMax.to(flipper.front, 0, {alpha:0, delay:.5}); //show the back as the front hides TweenMax.to(flipper.back, 0, {alpha:1, delay:.5}); //flip the back from 90 to 180 TweenMax.fromTo(flipper.back, 1, {rotationY:90}, {rotationY:180, ease:Linear.easeNone, delay:.5}) there are probably more elegant ways of doing this with timelinemax and callback functions or listeners, but this simple approach will do the trick. Carl
  25. ok, so if you want to tween back and forth along the x and also want a specific destination x you can put your bubbles in a container. zig zag them in the container, and then tell the container exactly where it should end. image in you create a movie clip in flash called box_mc. inside of it create motion tween of a ball moving back and forth. on the stage create a tween of the box_mc moving up and down. it will give you wormy, snake like action. with timelinemax you can do the same thing. take a look here: http://www.snorkl.tv/dev/bubbles/dimitri-bubbles.html each bubble is placed in a bubble holder. the bubble moves back and forth (random wiggle amount) as the holder is told a specific x/y ending position. in my example the end point is random... but it is specific. function createBubble() { //create a bubble (attach symbol in library with Class Bubble) var bubbleHolder:MovieClip = new MovieClip(); var bubble:Bubble = new Bubble(); bubbleHolder.y=20; bubbleHolder.x=20; bubbleHolder.alpha=0; bubbleHolder.visible=false; addChild(bubbleHolder); bubbleHolder.addChild(bubble); //create timeline for each bubble var nestedTl:TimelineMax = new TimelineMax(); //how much wiggling / zig zagging var wiggle:Number=randomRange(10,100); //how fast and big var speed:Number=2.5; //fade and grow nestedTl.insert(TweenMax.to(bubbleHolder, .5, {autoAlpha:randomRange(.5,1), scaleX:speed, scaleY:speed})); //go up nestedTl.insert(TweenMax.to(bubbleHolder, speed, {y:350, x:randomRange(250, 500), ease:Quad.easeIn})); //zig zag nestedTl.insert(TweenMax.to(bubble, speed*.15, {x:String(wiggle), repeat:5, yoyo:true, ease:Linear.easeNone})); //append new timeline very close to when the previous one started //don't even ask about the offset...k? var offset:Number = -speed*.5 trace(offset) tl.append(nestedTl, offset) } while playing around with a few parameters (having each bubble follow the same wiggle and speed parameters but starting just slightly after the previous... you get something that LOOKS LIKE A SNAKE! http://www.snorkl.tv/dev/bubbles/dimitri-snake.html I've zipped up the files if you want to mess with them. I think if you threw in a custom ease like jack suggested, you could get some interesting effects Carl
×