Archive for May, 2009
Yikes, it was the age-old problem of an overlapping object getting in the way of a rollover or mouseover event. Except my usual method of making the object in the way “invisible” to events via mouseEnabled = false didn’t work. Turns out the thing in the way (which was a MovieClip) had another MovieClip inside of it that was still capturing the mouse events. So note to self: always remember to set the mouseEnabled = false property on the child lowest down on the display list.
Today I find myself implementing one almost from scratch for my very first ever, all-Flash website! (Oh no, run for it.) And with it, scrollbars.
And with that, I’m discovering that scrollbars are surprisingly complex critters, made even more complex by the fact that Adobe hasn’t given us a decent scrollbar/scrolling class to work with. Which means, in the Flash world, if you want any sort of semi-awesome custom scrollbar, you pretty much have to do it from scratch or work off of other people’s preexisting examples (this is where the “almost” comes in for me).
I continue to find this a little silly because scrollbars are such a common thing and they all have the same basic functionality save for some variables that a user would want to customize. It’s, like, a prime ripe opportunity for class-ifying.
(Actually, turns out, Adobe did make this UI component scrollbar class but it only works with the weird xml layouting scheme for Flex that I know nothing about. Yikes. So what they really need to get a move on is a class that can be instantiated in AS…)
For the seasoned Googler, there are a lot of attempts, sprinkled all over the internets, by various coders of authoring a good scrollbar class. However I still find it a pain that we have to Google for it and spend all this time figuring out if any particular code we’ve found is any good before borrowing it and running with it.
To save some time later, here are a couple that I found that look pretty decent:
- http://as3.kylebrekke.com/2008/advanced-customizable-as3-scrollbar-class-for-adobe-flash-cs3/
- http://www.emstris.com/2009/01/final-scrollbar-class-v-20/
- http://www.kirupa.com/forum/showthread.php?t=245468
The last one is the one I ran with because it was the most abstract one I found. I managed to customize it to dynamically resize to the stage height and width to accomodate liquid layouts. That was the major thing that I needed for this layout that I couldn’t find anywhere else. Also, I made the arrow buttons scroll continuously on press, rather than making the user flick repeatedly.
(That’s another thing I think Adobe seriously shouldn’t have forgotten about… why can’t we just have a continuously firing MouseEvent rather than having to tie an ENTER_FRAME to the MOUSE_DOWN?)
So it seems like there are a lot of existing classes out there, and I’m really just a small fry novice, but I wonder if I should try to find the time to write one of my own. It would be good practice, and other than iffy arithmetic (details, details…), I think I could do it pretty easily using my elementary coding skillz.
Mine at least would have the option of dynamically resizing to stage size, which I think would be really useful for some…
Anyway, back to work.
Doing tween animations in Flash using code rather than via the timeline sometimes comes in handy. While it may be harder to visualize, it is a great deal more flexible than timeline animation.
In the project I’m working on now, there is a drop-down menu that requires opening and closing animation upon rollover/rollout. Before, I’d do this with timeline animation combined with the old-school “gotoAndPlay()” to jump to different parts that animate opening and closing. However I’ve found that this makes the animation appear jerky if you hover your mouse over and then really quickly move it away. A better way is using tweens:
import fl.transitions.Tween;
import fl.transitions.easing.*;
var slideMenuOut:Tween = new Tween(galleryMenu, "y", Regular.easeOut, header.galleryMenu.galleryBg.y, 0, 9);
The constructor takes a heck of a lot of arguments that I always have trouble remembering:
- object to tween
- property to tween (don’t forget the quotes)
- the easing method to use (refer to the fl.transitions package for all the possibilities)
- starting value (set this to whatever the current value may be, so there is no jerkiness)
- ending value
- length, in frames (or seconds, if last parameter is true)
- whether the length unit is seconds (optional)
Note to self: when loading a SWF into another Flash movie, the SWF can’t access any properties of the parent stage until Event.ADDED_TO_STAGE has been triggered. It doesn’t automatically recognize when it has been added to a stage. So remember to put the following at the top of the movie being loaded:
MovieClip(root).addEventListener(Event.ADDED_TO_STAGE, initClip);
…where initClip is a function that will be executed once the movie has been added. This can contain any code that makes use of stage properties, including adding event listeners that require access to stage properties.
The MovieClip(root) part of the code means grab the root of the movie being loaded and cast it as a MovieClip. (I think.)
Further note to self: the stage of the loaded movie no longer exists once it’s loaded; it becomes the stage of the container movie.
This post here basically summarizes it.
EDIT: This also applies to custom-written AS classes that require access to stage properties. If an instance of that class doesn’t exist on stage yet, any code in the class that calls on stage properties will be confused and yell at you.









