Hey people, I’ve been published again in Web Designer Magazine Issue 159. In this tutorial, I walk you through how to make a MP3 player with a sound visualizer. Its a pretty short and straight to the point tutorial. Hopefully everyone will be able to follow along and make some cool mp3 players. If there are any concerns or questions, post it here on the blog and I’ll get back to you ASAP.
Go pick up your copy and leave some feed back. Check out a preview here
I’ve gotten a lot of positive feedback on the Cool Flash Tip of the Week series. So as long as people find them useful, I’ll keep them coming. Make sure to subscribe to be on top of all tips and add me on twitter. Now with all the formalities out the way, lets get a move on to the tip of the week. This week’s tip is about Events!!
I’m sure you are wondering, what kind of tips can you not know already. Events are a big topic in Actionscript 3.0. Almost everything is based on event listeners and is event driven. During my time coding, I found a couple of handy shortcuts that made my day easier. Let’s say you have a simple event handler that adds a MovieClip to the stage when a link is clicked. For simplicity’s sake , lets pretend we have a MovieClip in the library named “myMC”, and a button on the stage called “myLink”.
myLink.addEventListener(MouseEvent.CLICK, addClip);
function addClip(e:MouseEvent):void
{
stage.addChild(myClip);
}
This would be the typical way we would do it. This is absolutely correct, but what if we wanted in a different function to add the clip as well. Some one would probably try to execute that this way.
myLink.addEventListener(MouseEvent.CLICK, addClip);
otherFunction();
function addClip(e:MouseEvent):void
{
stage.addChild(myClip);
}
function otherFunction():void
{
stage.addChild(myClip);
}
Although this is correct, the ideal way to program is to reuse code as much as possible so that when its time to update you caan change the code in one spot and it will update throughout the program. Not to mention it cleans up the code considerably. A better alternative to this would be to call addClip(). But WAIT!!, this is an event handler, if I call this I get an Argument Error. This is true, but we can setup the event handler to be an event listener and also be called without needing an event. Here is how we acheive that.
myLink.addEventListener(MouseEvent.CLICK, addClip);
addClip();
function addClip(e:MouseEvent = null):void
{
stage.addChild(myClip);
}
//------------------OR--------------------
myLink.addEventListener(MouseEvent.CLICK, addClip);
addClip(null);
function addClip(e:MouseEvent):void
{
stage.addChild(myClip);
}
That was pretty simple now was it. I use this all the time in my code to shorten things up and clean my code. I do prefer to the first method than the second alternative. I rather not have to keep passing null than just setting the default to null instead. Keep in mind, that this will only work if you do not need the actual event in your functions logic. If you do, then you need to an event. Well that’s all for this week’s tip. I hope you found it useful in any sense. Next week will be a big week, so stay tuned and subscribe to the feed.
I’m going to start a series that will occur every week. A cool flash tip or something I think not many people know about. Be on the lookout every week for a new tip. This week’s CFT is ……drumroll…….” The Tertiary Operator “.
I spend alot of time traversing flash posts looking at other peoples code and I often see a large if else block to change a simple variable. Using the Tertiary Operator we can simplify this into one line of code. Shorter code is always better in my opinion. Plus can save you a couple bytes in your code.
Here is an example of what I see.
var myBool:Boolean = false;
var myVar:Number = 12;
if(myBool == true)
{
myVar = 15;
}
else if(myBool == false && myVar == 10)
{
myVar = 40;
}
else
{
myVar = 0;
}
Now this is all well and dandy, but it is a waste of space and can be simplified by a lot. One, when testing a Boolean there is no need to test to true or false. Instead if you want to test if something is true, you can just place the variable in the if parenthesis. This will automatically test to true. To test if a variable is false, use !. Here is an example.
var myBool:Boolean = false;
var myVar:Number = 12;
if(myBool )
{
myVar = 15;
}
else if(!myBool && myVar == 10)
{
myVar = 40;
}
else
{
myVar = 0;
}
This already shortens up our code a bit. But we can take this a step further using the Tertiary Operator. The syntax for this is pretty simple once you know what it means.
//Tertiary Syntax
(Test) ? True : False;
Basically, If the test is true, the code after the ? executes. If the test is false the code after the : executes.
You can also string together Tertiary statements to make and if else if else etc. Here’s how we write the same code from above over using the Tertiary Operator.
var myBool:Boolean = false;
var myVar:Number = 12;
myVar = (myBool ) ? 15 : (!myBool && myVar == 10) ? 40 : 0;
WOW, look how much space we saved, and it i still readable. I implore everyone to start using this and save space =D. Be aware that it is advised no to string Tertiary statements past “If..Else”. If you liked this idea of CFT ( Cool Flash Tip ), then leave a comment, subscribe to the feed or / and follow me on twitter. It would be great to get some feedback on if this is helpful or not and maybe some tips you would like to see featured here.
Happy Flashing
- Actionscript 3.0, XML
- Nice, advanced audio player with simple controls.
- Actionscript 3.0, XML
- Simple and clean banner / image rotator. XML driven slide show which supports links and loads JPEGS , PNGS, GIFS and SWFS .
- Actionscript 3.0
- This Actionscript 3.0 Class allows for multiple XML files to be loaded and stored for future use by way of a name or index number. I use this class in all of my XML powered projects.
I have finally gotten around to updating the XMLLoader Class now, in its 3rd Release. With this release comes a couple new properties such as bytesLoaded, bytesTotal, totalItems, currentItem and ratioLoaded. The biggest update is the new naming feature. With this feature you can now give each XML file a name to reference it. Also in the big boat of updates is the new way of handling errors.
The new naming feature is meant to replace the old naming feature in version 2.0. TO refresh everyone’s memories, the older version would automatically name the file for you by using the actual name of the file. If there happened to be more than one file that had the same name, it would attach a number depending on its spot in the Array. I’ve come to realize, this way was really unproductive and annoying. So to combat that, I created a new naming feature. This naming feature allows you to call each XML file anything you you want.
In order to use this new feature, you must pass in another Array which contains the names in the order that the XML files are being loaded in. For Example:
package
{
import com.clementegomez.utils.XMLLoader;
import flash.display.*;
import flash.events.*;
public class XMLDoc extends MovieClip
{
public var xl:XMLLoader;
public var array:Array;
public function XMLDoc()
{
xl = new XMLLoader();
array = new Array();
xl.addEventListener(Event.COMPLETE, loaded);
xl.loadXML(["http://flashden.net/feeds/user_item_comments/cg219.atom", "http://feeds2.feedburner.com/kreativeking?format=xml"], ["xml1", "xml2"]);
}
private function loaded(e:Event):void
{
trace(xl.data["xml1"]);
}
}
}
loadXML() function. the first string “xml1” will be the name of the first XML file in the array and “xml2” refers to the second. With this, you can reference the XML file by name later on in code rather than its index number.ratioLoaded which returns the amount of items loaded to the total amount of items as a Number between 0 and 1. The currentItem property returns the number of the current XML being loaded and the totalItems property returns the total amount of XML files. The bytesLoaded and bytesTotal return those properties of the current XML file being loaded.skipErrors. This is set to true by default. When this property is set to true, if there happens to be an error in the Array of XML files such as a dead link or misspelled url, it will be skipped and the loading process will continue. This is set to true by default, so if you would like to receive the Error messages, set this property to false.
I finally released the kreativeKING Videoplayer API. I’m sure you all remember the old VideoViewer and ProgressionBar classes. Well this new set of API does away with those and replaces with a plethora of new classes to make your video player creating processes much easier. Spend more time on design than on programming. Some of the 10+ classes released are VideoWindow ( Replacement of the VideoViewer Class ), VideoPanel ( ProgressionBar replacement) and the VideoControl Classes. These are the main 3 classes that you will be using to the video players logic. I will post later on a short tutorial on creating a video player using the API.
The new API allows you to load movies via flashVars or XML. Playlist support through the XML method. Keep the amount of code to a minimum of about 10 lines and your code is done. I have posted documentation online of the API for reference here. This version of the documentation will have some small changes coming in the next day or two as the API has been updated since I uploaded the documentation. But the gist of it is correct.
To get your hands on the API, you have to purchase one of my video player products from FlashDen. I know alot of people probably are ready to go to a different page after reading that, but I think its fair for the amount of time I put into creating it. Also it’s cheap, only $15. But since I’m a nice guy, I will be releasing a LITE version for free for other to play around with in the next coming weeks, even days actually. SO be on the lookout for that. I will be posting it up here once it’s completed.
Here is a small sample of what the code looks like for a completed video player
var vControl:VideoControl = new VideoControl();
var panel:VideoPanel = new VideoPanel(movie, cBar.progress);
var assets:Array = [movie, panel, cBar.playB, cBar.muteB];
movie.addEventListener(Event.COMPLETE, setupMovie);
vControl.setupAssets(assets);
vControl.useXML();
function setupMovie(e:Event):void
{
vControl.setup();
}
Woot!!!, just a really small post. You are reading this post from the new AS3 Tutor at the Borough of Manhattan Community College. I actually got the good news a couple days ago, but I would like to share it with the world =D.
In addition, if anyone needs any help with Actionscript 3.0 or needs a private tutor, don’t hesitate to drop me an email. In the next coming days I have some interesting things to post about ranging from new FlashDen products to new published articles. So be on the lookout for those, or you know what is even better?? Just subscribe and I’ll let you know. =D Happy Flashing people.
I know I haven’t been posting as frequently as I used to, but I have good reason. The AIRUploader is one of those reasons. This is a project I have been working on in the past week and a half. It started out as just practice for learning how to use the FileReference class, but then grew to be muuuuuuch more.
This application is essentially a drag and drop FTP Uploader. I sometimes hate uploading files. Signing in, looking for directories, etc etc. So I decided to make this application. It will save your login information so you don’t have to keep entering your information.
