Archive for the ‘Tutorials’ Category

Use SharedObject to save data on users computer

Tuesday, March 24th, 2009

By using SharedObject you are able to store limited amounts of data on a user's computer. It's works in the same kind of way that your browser stores cookies. However there are some limitations with using this. Sometimes swf files may not be able to write the data, and the data can sometimes be deleted without your knowledge. Users can set their own limits on how much space flash player can use on their computer. When they lower the amount of disk space available, some local shared objects might get removed.

I'll show you a basic example of using SharedObject. We will have an input text field on stage and a button that will save the text in the text field.

Create a new AS3 Document and put a text field on stage and give it an instance name. I will call mine theText_txt.
Next make a button on stage and give it an instance name. I called mine save_btn.

Create a new layer in the main timeline and call it actions and lock it. Open up the actions panel and enter the following:

  1. var mySO:SharedObject;
  2. mySO = SharedObject.getLocal("myfirstSO");

The first line creates the shared object. The second line gets a local shared object called myfirstSO. Nothing is stored in it at the moment but we will assign data to it shortly.

Now when we click the button we want to assign whatever text is in the text field to the shared object. In the actions panel enter:

  1. save_btn.addEventListener(MouseEvent.CLICK, saveText);
  2.  
  3. function saveText(e:MouseEvent):void
  4. {
  5. mySO.data.myText = theText_txt.text;
  6. }

This has now assigned the text in the text field to a variable called myText in the SharedObject.

OK now that the text is saved we will want to populate the text field with that saved data when you open the swf again. In the actions panel enter the following.

  1. if (mySO.data.myText)
  2. {
  3. theText_txt.text = mySO.data.myText;
  4. }

This checks to see if there is any data in the myText variable in the SharedObject. If there is then it assigns that value to the text field.

Now test the movie. Enter some text in the text field and click your save button. Close the swf and test the movie again. You will see that the text you entered before is in the text field.

You can download the example here: SharedObject.zip

Hope this was helpful,
Ed

Searching through arrays

Monday, July 7th, 2008

This works in both actionscript 2 and actionscript 3.

To search an array starting from the first position in the array we use:

  1. for (var i:int = 0; i < myArray.length; i++)
  2. {
  3. ...
  4. }

Where you would change myArray with the variable name of your array.

But what if you wanted to search through the array from the last item? Well the easiest way of doing this is by using:

  1. for (var i in myArray)
  2. {
  3. ...
  4. }

Now you know. And knowing is half the battle. - G.I. Joe

Load an image with Actionscript 3

Friday, May 23rd, 2008

To load an image into flash with actionscript 3 the first thing you need to do is set up 2 variables. The first will be the loader which is what will actually load in the image. The second is the URL request which will tell flash where the image to be loaded is.

  1. var url:URLRequest = new URLRequest("myimage.jpg");
  2. var loader:Loader = new Loader();

Now we will call flash to load the image into the loader variable.

  1. loader.load(url);

However if we just have this, flash wont know what to do with it. So what we have to do is setup some event listeners which will call a function to tell flash what to do when it loads the file.

We will create one event listener to check what is happening while the image is loading.

  1. loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, loadProgress);
  2.  

At first you may be thinking "why do I need contentLoaderInfo in there? Why can't I just add an event listener straight onto the loader?" The reason for this is basically that the loader just holds the image whereas the contentLoaderInfo hold all the information about the file. So if you don't use contentLoaderInfo then you can't get any information about the file.

Create another event listener to check if the file has finished loading;

  1. loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);

Now these 2 event listeners are calling some functions one called loadProgress and the other called loadComplete. So lets create those functions.

  1. function loadProgress(event:ProgressEvent):void
  2. {
  3. }
  4.  
  5. function loadComplete(event:Event):void
  6. {
  7. }

In the loadProgress function you will notice that it is looking for a progress event. What this means is that while the image is downloading flash keeps checking this function to check the progress of the image download. This is called in the event listener that we created earlier.

In the loadProgress function we want to see the percentage of the file being downloaded. for this example we will just use the trace function.

  1. function loadProgress(event:ProgressEvent):void
  2. {
  3. var percentLoaded:Number = Math.round((event.bytesLoaded/event.bytesTotal) * 100);
  4. trace("Loading: "+percentLoaded+"%");
  5. }

What is happening here is we are getting the bytesLoaded from the image and dividing that by the bytesTotal of the image. This will get a number between 0 and 1. We then multiply that by 100 to get the percentage of the download. We also want to round this off so it won't display a number with a long decimal at the end like 13.2352274564. We then trace this out and when the image is downloading we will see how much of it has been downloaded.

Once the image has been downloaded we then need to tell Flash what to do with that image. What we will do in this instance is add it to the stage. So go into the loadComplete function and add this

  1. function loadComplete(event:Event):void
  2. {
  3. trace("Complete");
  4. addChild(loader);
  5. }

This tells flash that once the image has been downloaded add the loader to the stage. This will now display the image.

Your code should now look like this.

  1. var url:URLRequest = new URLRequest("myimage.jpg");
  2. var loader:Loader = new Loader();
  3. loader.load(url);
  4.  
  5. loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, loadProgress);
  6. loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);
  7.  
  8. function loadProgress(event:ProgressEvent):void
  9. {
  10. var percentLoaded:Number = Math.round((event.bytesLoaded/event.bytesTotal) * 100);
  11. trace("Loading: "+percentLoaded+"%");
  12. }
  13.  
  14. function loadComplete(event:Event):void
  15. {
  16. trace("Complete");
  17. addChild(loader);
  18. }
  19.  

If you are using this inside a class then you would also need to import:

  1. import flash.events.*;
  2. import flash.net.URLRequest;
  3. import flash.display.Loader;