View Full Version : Help with Image Viewer

Fuzzplug Jones
03-26-2005, 11:44 PM
Hello, I've just started learning Flash in my free time in the last few months. I seem to understand the basics pretty well, but the ideas that I have for things I'd like to do are much more than the "move the circle over here and rotate some text" examples that seem to be the most advanced things in most of the books. Then again, I've never really grasped why OOP languages like ActionScript feel so convoluted and unnecessary to me, so I'm right in the middle of the two types of people the books seem to help.

That being said, I am fairly competent in PHP4 and HTML, and I used to be pretty good in Visual Basic, but as my ideas got more advanced, I started to suffer the same problems as I now have with ActionScript.

Anyway...this afternoon I hacked together a little image viewer that will be used in a site I'm building that will have a lot of images of varying resolutions. It will also be visited by lots of people on both dialup and broadband, running all different OSs, browsers, and screen resolutions.

Since CSS is mostly useless in true cross-browser compatibility, I've turned to Flash lately to try and solve a lot of the problems that are making my time coding HTML rather pointless. If you take a look at the attached .FLA, you can see that when you load my SWF directly into a web browser window, it loads the specified JPG, and scales it to the browser window, centering it horizontally and vertically no matter its dimensions. If the end user resizes his/her browser, the image will also rescale, which does away with all those messy "view at 640x480 / view at 800x600 / etc" things.

Of course, it works fine, but now I'd like to make it pretty :-). So I have a few questions. I've been lurking here for the time I've been learning Flash and it seems like a very helpful place. So here goes:

1. I would like to make the ProgressBar fade out and the image fade in when the loader is done loading. Seems a little prettier to me than it just going "pop." I've been trying for hours to do it in ActionScript. The closest I got was something like a while loop inside the "on (complete)" event in the Loader, that subtracts alpha values until the alpha is zero. But the entire loop takes place without ever updating the stage (until it's done, of course), and is the same as just setting ProgressBar.visible = false.

2. I've noticed that if I load the swf straight into a web browser (i.e. through the address dialog), it scales to the entire window. But even if I set width="100%" and height="100%" in the <object> tags in an HTML file that calls the SWF, it always loads at the stage size (set to 200x200 at the moment in Flash) and never ever resizes to fit the browser window or scales with a resize. Since calling the SWF from an HTML file is the "right" way to do it, is there actually a way to do what I want?

3. I imagine this is something that would require a complete rewrite with other components I don't yet understand, but what if I wanted to load, say, a very "widescreen" image and have it resize on the stage so the height is 100% tall, and let's say I don't care if the right and left sides of the image are cut off at the browser window borders (think: an oversized background graphic on a web page that tries to compensate for a myriad of screen resolutions). Of course eventually I'd like it to be an option in the URL calling the SWF so I can switch it around (i.e. a graphic taller than it is wide that is sized to 100% of the browser width and cuts off the top and bottom).

It may not be the most important SWF in the world, but for someone like me who is sick of hacking CSS to every God-forsaken browser out there, just because someone else decided I have to adhere to some broken standard in order to get my ideas across, it might just be a lifesaver.

(My apologies for the overly cynical attitude, but it seems like every idea I have as of late is broken in at least one major web browser, and it's getting hard for me to be able to do anything new and different anymore... and it's occurring to me that the only cross-platform, cross-browser, market-dominant standardized rendering solution we have left is Flash.)

And if I'm onto something, feel free to steal the code, though there's not much at the moment. Or the idea. The graphic specified in the AS is not included, as it's pretty huge, but you can change it to whatever you've got lying around if you want to play with it.

Thanks, I hope!

Zipped FLA is available at http://www.markscudder.com/loadimage.zip
Preview in a new window: Click here (http://www.markscudder.org/loadimage.swf)