This Blog is Moving to http://blog.drisgill.com
Viewing By Entry / Main
October 19, 2006
I was inspired by the wicked reflector class by Trey Long and updated by Narciso Jaramillo. It's a really nice class and the effect is quite stunning. So, I have put together a hopefully easy to use Flex scrolling gallery (view an example here) that uses the effect. I had initially intended it to automatically load all the images in a folder using a scripting language, but ended up with a simple xml implementation. Download the code and feel free to check it out for yourself. Let me know if there are any issues with it.

Comments

Sweet bro, looks purdy ;o)
Just one small bug, is that ocassionaly the mouse out doesnt fire and im left with a big image while others are doing the resizing.

Looks real nice... I wonder if it would be feasible to smooth the thumbnails though -

Yeah, I had a lot of problems with the images 'ping ponging' open and closed real fast, so I had to put some controls in place to stop that. There are still a few issues, if anyone gets it smoother... send me a new version!

Also, smoothing the thumbnails would be tight... not sure I would know how to do that one though.

Very cool! I think the best way to get rid of the ping-ponging would be to make it so you only shrink the previously moused-over item when you mouse over a new item, as opposed to when you mouse out of the old item. The cleanest way to do this would be to change the Repeater to a custom component based on HorizontalList. If I have some time this weekend I'll play with it...

As far as smoothing the thumbnails, I'm kind of surprised they aren't smoothed by default...I thought we made smoothing the default in Flash 9. I'll poke around and find out if there's some easy way to fix this. (It looks like the underlying Bitmap class in Flash has a "smoothing" property, but it looks like there's no control over that property from the Loader/SWFLoader/Image classes.)

nj

I just found out how to make the thumbnails smoother. It's not obvious, but it should be pretty easy to hack in and try out. Do the following:

-- In the <Application> tag, add: applicationComplete="stage.quality = StageQuality.BEST"

-- In imagePop.mxml, add the following function:

private function handleImageComplete(event: Event): void {
var bitmap: Bitmap = ((event.target as Image).content as Bitmap);
if (bitmap != null) {
bitmap.smoothing = true;
}
}

-- Add a call to handleImageComplete(event) in the complete handler for the Image tag in imagePop.mxml.

Let me know if this works for you (i haven't tried it in your app yet). Setting the stage quality to BEST may slow down the animations a bit.

Wow - this is great!! Thank you!