Jump to content
Search Community

Slider for TimelineMax Based Slideshow

mspanish test
Moderator Tag

Recommended Posts

I've built a slideshow using 5 movieclip pages using TimelineMax and TweenMax. Works great! I had the idea to use a slider for navigation, to make it easier for people to go forward and backward, as using a forward/backward button is a bit clunky.

 

I borrowed a little code I found on the forum, and tried integrating that with an AS3 slider class I found online. Since I"m doing this all via the command line using the Flex SDK compiler, I can't use the slider component from Flash CS4 or CS5. I have to do this via the command line, as I'll be generating hundreds of SWFs with this code.

 

My slider does update along with the timeline, but I can't seem to interact with the slider at all. Mouse events (hover, press, release) don't register at all.

 

I've attached a sample of my slideshow (the timeline stuff is still a work in progress!), as well as the .as file for my SWF, as well as the relevant class files. If anybody has an idea why my slider is failing to react to mouse events I'd be super appreciative!!

 

In case anybody would like to compile directly from the folder, you can just change the path to your own Flex SDK in the .bat file, and click to compile the SWF.

Link to comment
Share on other sites

i'm getting this error on your swf as soon as it opens

 

 

TypeError: Error #1034: Type Coercion failed: cannot convert com.reintroducing.ui::SliderUI@250bc061 to flash.display.DisplayObject.

at edl1seven()

 

 

where that is happening I don't know. I can't export any of your work (flash cs5) and its tough to look through 700 lines of code.

 

I didn't see any functions that would tell the timeline to update when the slider is dragged, but I guess you have to figure out why your ROLL_OVER isn't working and what is causing that error. I did notice that I could drag the slider back and forth.

 

perhaps you can contact the developer that made the slider as it seems to be where the problem lies.

 

also you are using an outdated version of the tweening platform. you should download the latest version and note the new structure

 

import com.greensock.*

Link to comment
Share on other sites

Dear Carl - thanks so much for spending your time looking at my file; it was a lot to ask and you are a kind soul!

 

I started out using gs. structured platform from Greensock but I did download and import the main package when I decided to use TimelineMax - so eliminated the reference to the old package that uses the com.greensock.* structure.

 

Perhaps I should go for a new slider - is there a way to import the regular Flash component when you are using the command line compiler from the Flex SDK? Then I could use a nice example for a slider that I found on this forum, which isn't set up as a pure actionscript class, but rather in a .FLA.

 

Thanks again for your help, I'm a bit blown away by how cool the Greensock stuff is and how generous the developer as well as the others like yourself are on this forum.

 

warm wishes from Alaska

Stacey

Link to comment
Share on other sites

The big problem is that the MouseEvents aren't responding when you hover/drag/release the Slider - the Alerts I set up to test the MouseEvents are not being fired.

 

slider.lowVal = 0;  
slider.startVal = 0;  
slider.highVal = timeline.totalDuration;   
slider.enable();  
slider.addEventListener(SliderUIEvent.ON_PRESS, thumbDragHandler);  
slider.addEventListener(SliderUIEvent.ON_RELEASE, thumbReleaseHandler);  
slider.addEventListener(SliderUIEvent.ROLL_OVER, stopHandler);  
function stopHandler(event:SliderUIEvent):void {  
timeline.gotoAndStop(timeline.currentTime);  
Alert.show("ROLL OVER currentTime is " + timeline.currentTime, {buttons:["OK"]});  
}  		
function thumbDragHandler(event:SliderUIEvent):void {  
Alert.show("i got pressed ", {buttons:["OK"]});  
}  
function thumbReleaseHandler(e:SliderUIEvent):void {  
Alert.show("onRelease currentValue is " + e.currentValue, {buttons:["OK"]});  
timeline.currentTime = slider.currentValue;  
timeline.resume(); 
}  
function updateSlider(event:TweenEvent):void {  
slider.currentValue = timeline.currentTime;  
}  

 

Probably time to just ditch this slider and not waste any more time...

Link to comment
Share on other sites

Can I use a Flexlib component in a pure SWF project? I'm using the Flex compiler but this isn't a Flex app and I'm not using the Flex framework, just AS3. I should know the answer to that myself as I've developed plenty of Flex apps but I always used Flex Builder for those :)

Link to comment
Share on other sites

Ah I found the answer from the master himself:

 

On 8/31/07, Doug McCune wrote:

FlexLib is Flex-framework dependent, I think Jesse was asking about AS3, non-Flex libraries (ie you can use them in Flash projects).

 

Doug

 

Maybe I'll look on ActiveDen.net...

Link to comment
Share on other sites

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

Link to comment
Share on other sites

Still researching sliders - although Carl's awesome split text tutorial convinced me to become a Shockingly Green member in order to ditch my other letter by letter animation, which was also causing weird slowness in the slideshow.

 

Thanks!

Link to comment
Share on other sites

hi stacey,

 

It seems you are in good hands with X10. Wish I could help more but don't know anything about the command-line compiling you are doing or anything really about flex. Glad to hear you enjoyed the SplitTextfield tutorial.

 

Carl

Link to comment
Share on other sites

Hey Carl this is a really newbie thing to ask - but how the heck do I tween something in and just leave it there? My client thinks they want the text to fade in 1 paragraph at a time and leave them there, rather than fading out.

 

I guess I'd need to combine autoAlpha and visible?

 

var timeline:TimelineMax = new TimelineMax({paused:false, overwrite:true});  
var tween:TweenMax = null;  
CustomEase.create("page1Ease", [{s:0,cp:0.21,e:0.316},{s:0.316,cp:0.422,e:0.424},{s:0.424,cp:0.426,e:1}]);

timeline.append(TweenMax.to(page1, 5, {x:0, y:0, autoAlpha:1,  ease:CustomEase.byName("page1Ease"), onInit:initSlide1} ) ); 
timeline.addLabel("page1", timeline.duration) 
timeline.append(TweenMax.to(page1, 5, {x:0, y:0, visble ease:CustomEase.byName("page1Ease"), onInit:initSlide1} ) ); 
timeline.append(TweenMax.to(page2, 4, {x:0, y:0, autoAlpha:1, delay:.8, onInit:initSlide2})); 
timeline.addLabel("page2", timeline.duration) 
timeline.append(TweenMax.to(page3, 10, {x:0, y:0, autoAlpha:1, delay:.8,  onInit:initSlide3})); 
timeline.addLabel("page3", timeline.duration) 
timeline.append(TweenMax.to(page4, 5, {x:0, y:0, autoAlpha:1, delay:.8, onInit:initSlide4})); 
timeline.addLabel("page4", timeline.duration) 
timeline.append(TweenMax.to(page5, 10, {x:0, y:0, autoAlpha:1, delay:.8,  onInit:initSlide5, onComplete:timeStop})); 
timeline.addLabel("page5", timeline.duration)  

Link to comment
Share on other sites

SplitTextField is quite awesome, and Carl did a pretty great job of the tutorial.

 

The Greensock autoAlpha Plugin already deals with Visible, so that it sets Visible to False once the Alpha reaches Zero (and vice versa):

http://www.greensock.com/as/docs/tween/ ... lugin.html

 

Check Out the autoAlpha Plugin example in the Plugin Explorer:

http://www.greensock.com/tweenlite/#plugins

Link to comment
Share on other sites

sorry to be such a moron here - but I tried using the code from the greensock example SWF, and tried this:

 

timeline.insertMultiple( TweenMax.allFrom([page1, page2, page3, page4, page5], 3, {autoAlpha:0, alpha:1, onInit:initSlides }, 0.25), 0.6);

 

now each page fades in and then disappears - where I'd like them to STAY just like in the example, where each element fades in and stays present.

 

Caramba any idea what I'm doing wrong?

Link to comment
Share on other sites

Ah geez what a ridiculous mistake!

 

That's the problem with having done too much in the Flash IDE...

 

My movieclips had a fill color, which was why only the last movieclip was visible.

 

Not the lovely greensock framework's fault! Thing of beauty this framework is...

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...