Geek.blog » actionscript

How to Load External Images in Actionscript 3.0

Andrew Christensen — Thu, 12 Mar 2009 03:37:12 +0000

Using the flash.display.Loader class in AS3, you can load in external image files to display in flash. The loader class supports loading in JPG, SWF, PNG, or GIF file types. The Loader class sounds more like a loading manager that watches load progress, rather than a display object. Fact is, the Loader is treated as a DisplayObject, so when it’s ready you just add it to the stage. Pretty simple, so let’s get started!

First, you will need to create an instance of the loader class and add a couple event listeners to it. One to watch load progress, and one to watch for when the loading is complete.

1
2
3

var myLoader:Loader = new Loader();
myLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onLoaderProgress);
myLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaderComplete);

You’ll notice that I’m not adding the event listener to the loader instance (myLoader), but instead adding them to a property of myLoader called contentLoaderInfo. The Loader class has a special property that controls all the loading events. This property is an instance of the LoaderInfo class, so we will listen to it for events, rather than our Loader instance.

Next, we will call the Loader.load() method to initiate the loading sequence. You will need to create a new variable that will be an instance of the URLRequest class. This new variable will be passed to the load() method.

1
2
3
4
5
6

Ok, so that’s pretty much it. All that is left is to create our callback methods for each of our eventListeners. Our final code should look like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

var myLoader:Loader = new Loader();
myLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onProgressStatus);
myLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaderReady);

var fileRequest:URLRequest = new URLRequest("myImage.jpg");
myLoader.load(fileRequest);

public function onProgressStatus(e:ProgressEvent) {
// this is where progress will be monitored
trace(e.bytesLoaded, e.bytesTotal);
}

public function onLoaderReady(e:Event) {
// the image is now loaded, so let's add it to the display tree!
addChild(myLoader);
}

Connecting to a Flash Media Server using RTMP

Andrew Christensen — Mon, 04 Aug 2008 04:06:49 +0000

RTMP is the protocol used by Adobe’s Flash Media Server to stream content into flash. Most of the help documentation doesn’t touch much on this method of connection and is limited to sources not easily available to users.

This article should be used by those with an understanding of video playback using actionscript 3. If that isn’t you, please read this article before continuing.

1.) In order to use the RTMP protocol, you will need to install and run a version of Adobe Flash Media Server. Adobe has released a free developer version the limits you to 10 connections. That will be MORE than enough to do some basic development. Please make sure you are running or have access to a Flash Media Server before continuing to the next step.

1.) (B) If you are having trouble installing or setting up an app, please read this article.

2.) Now that you have access to a Flash Media Server, we will start with some basic code that should look familiar if you have worked with actionscript and video before. For this step, you will need to know the URI for the server. If you installed Flash Media server on the machine you are running on, you can use “localhost” for the URI. We will be using the “vod” app that comes pre-installed on the server for this example.

var nc:NetConnection = new NetConnection();
nc.connect("rtmp://YOUR_SERVER_URI/vod/");

If we were loading an flv file without streaming, you would have passed null to the connect() method instead.

3.) The only thing left is to load the stream, instead of loading an FLV video from a URL. This is actually much easier than you think. Instead of passing a URLRequest to the NetStream.play() method, you would instead pass the name of the stream you wish to play from within your app (this is the name of the FLV file on the server, but without the .FLV extension). To playback an HD streaming file, you will need to format your stream name slightly different: “mp4:NAME_OF_STREAM.mp4″

Please note that you can not setup your NetStream until after the NetConnection has successfully connected. You will know this from the NetStatus event: NetConnection.Connect.Success that is dispatched.

var ns:NetStream = new NetStream(nc);
ns.play("NAME_OF_STREAM");
// ns.play("mp4:NAME_OF_STREAM.mp4");  // this will stream an HD movie instead.

4.) That’s it! I hope this article has helped. Please comment below with any questions and I would be glad to help answer them.

For a more informative tutorial, check out this one from Peachpit.

What the hell is Modulus?!

Andrew Christensen — Sat, 24 May 2008 13:20:37 +0000

Grant Skinner has started a great series of posts related to core functionality. Each post will discuss methods that are less than 5 lines of code. These “Core AS3″ snippets can be HUGE time savers when used properly. Grant does a great job at fully explaining what you need to do, and why you would want to do it.

This week: Modulus (%)