Feb 1, 2012
Posted on Feb 1, 2012 in Hints and Tips | 10 comments
Commando is a Flash debugger that lets you change variables at runtime and run your own custom commands. It will allow you to try out whatever tweaks you want, without the hassle of changing your code and recompiling every time. This debugger also comes with its own memory monitor, and an output panel that is similar to the output dialog in the Flash IDE.
See Commando in Action
Why Use Commando?
Using Commando you can change your code at runtime. Let’s pretend you are making a platformer game. You have a jumpPower variable, but when testing your game you feel that the player can’t jump high enough. So instead of going back and changing your code, you can just type set jumpPower(25) in Commando and you can try out the new value.
Of course, this is just a simple demonstration; Commando can be extended even more. Just continue reading…
Configuration
First, download the ZIP file included with this article. Then, add the SWC file to your project’s library path.
Once you have added the SWC to your project’s library path, all you need are three lines of code to add an instance of Commando on the stage:
import com.pxlcoder.debug.Commando;
var commando:Commando = new Commando(flash.ui.Keyboard.ENTER, this);
addChild(commando);
Now press CTRL+ENTER (CMD+ENTER on a Mac), and you will see Commando up and running in your Flash project!
Explore
Commando comes with eight built-in functions. In this section I will explain what they are and how to use them.
Math
Using the Math function you can do addition, subtraction, multiplication and division between two numbers. The Math function can also calculate the square root of a number. For example, type math 1+1 or math sqrt(144) in the Commando dialog. The answer will show up in the output dialog.
Hide
You can use the Hide function to hide objects. You can type hide monitor or hide output to hide the two panels at the bottom. You can also use the Hide function with movieclips or buttons by simply typing hide myInstanceName.
View
You can use the View function to view hidden objects. You can type view monitor or view output to show the two panels at the bottom. You can also use the View function with movieclips or buttons by simply typing view myInstanceName. If any of your objects have their visible property set to false, typing view myInstanceName will set it to true.
Set
Using the Set function you can set values of your variables or you can set properties of your objects. To use the Set function on variables type set myVariable(myValue). To use the Set function on objects, type set myInstanceName(myPropertyName,myValue).
Get
Using the Get function you can get the values of your variables and properties. To use the Get function type get myVariable. You can also get properties by typing get myInstanceName.myPropertyName.The values will show up in the output dialog.
Probe
Using the Rrobe function you can get the probe all of the properties of an object. To use the Probe function type: probe myObjectInstanceName. The properties will be traced in the Flash IDE, rather than in the Commando output dialog.
Remove
You can use the Remove function to remove objects from the stage. To use the Remove function type remove myInstanceName.
Add
You can use the Add function to add objects back on to the stage. To use the Add function type add myInstanceName.
Note: Commando’s built-in functions each evaluate a single string, so after you type your function name and press space, make sure to type your arguments without any spaces. Instead, type your arguments as one continuous word, with commas if necessary.
Extend
While Commando has many great built-in functions, you may want something more. To solve this problem, Commando comes with a function to add your own custom commands.
Here is a quick code example of how you can create your own custom commands:
import com.pxlcoder.debug.Commando;
var commando:Commando = new Commando(flash.ui.Keyboard.ENTER, this);
addChild(commando);
commando.addCommand("output", outputFunction); //Sets the command keyword to "output" and calls the outputFunction below
public function outputFunction(s:String):void {
commando.output(s); //A call to Commando's built-in output dialog
}
Now press CTRL+ENTER (CMD+ENTER on a Mac), to run your code. In the Commando dialog, type output hello, and press Enter. The output dialog will now say hello!
You can also remove commands from Commando by using the removeCommand() function.
import com.pxlcoder.debug.Commando;
var commando:Commando = new Commando(flash.ui.Keyboard.ENTER, this);
addChild(commando);
commando.removeCommand("output");
Recap: Commando has three functions that you can access; addCommand(), output() and removeCommand().
Conclusion
At the end of the day, debugging is the most important part in the development process. Commando has everything you could ever ask for in a debugger. You can use it for anything and everything.
If you’re a Tuts+ Premium member, you can download the source files for Commando – just log in and head to the Source File page.
Any questions, comments or concerns? Feel free to get in touch in the comments.
Take control of your Flash projects!
View full post on Activetuts+
Jan 25, 2012
Posted on Jan 25, 2012 in Hints and Tips | 10 comments
It’s Premium tutorial time! This week, Tuts+ members will learn how to use the EaselJS JavaScript library (along with SoundJS and TweenJS) to create a version of the classic Pong game in HTML5.
Premium Preview
Click to play the demo
In this tutorial, we’ll create a clone of the classic game, Pong, in HTML5, using the EaselJS library. The game will have multiple screens, sound effects, and a (very simple) AI opponent.
Read the Full Tutorial
Premium members can access the full tutorial right away!
If you’re not yet a Premium member, you can still read the first few steps of the tutorial.
Tuts+ Premium Membership
We run a Premium membership system which periodically gives members access to extra tutorials, like this one! You’ll also get access to Psd Premium, Vector Premium, Audio Premium, Net Premium, Ae Premium, Cg Premium, Photo Premium, and the new Mobile Premium too. If you’re a Premium member, you can log in and download the tutorial. If you’re not a member, you can of course join today!
Also, don’t forget to follow @envatoactive on twitter, circle us on Google+, like us on Facebook, and grab the Activetuts+ RSS Feed to stay up to date with the latest tutorials and articles.
View full post on Activetuts+
Jan 18, 2012
Posted on Jan 18, 2012 in Hints and Tips | 10 comments
Building real time networked games and applications can be challenging. This tutorial will show you how to connect flash clients using Cirrus, and introduce you to some vital techniques.
Premium Preview
Click the start button in the SWF above to create a ‘sending’ version of the application. Open this tutorial again in a second browser window, copy the nearId from the first window into the textbox, and then click Start to create a ‘receiving’ version of the application.
In the ‘receiving’ version, you’ll see two rotating needles: one red, one blue. The blue needle is rotating of its own accord, at a steady rate of 90°/second. The red needle rotates to match the angle sent out by the ‘sending’ version.
(If the red needle seems particularly laggy, try moving the browser windows so that you can see both SWFs at once. Flash Player runs EnterFrame events at a much lower rate when the browser window is in the background, so the ‘sending’ window transmits the new angle much less frequently.)
Read the Full Tutorial
Premium members can access the full tutorial right away!
If you’re not yet a Premium member, you can still read the first few steps of the tutorial.
Tuts+ Premium Membership
We run a Premium membership system which periodically gives members access to extra tutorials, like this one! You’ll also get access to Psd Premium, Vector Premium, Audio Premium, Net Premium, Ae Premium, Cg Premium, Photo Premium, and the new Mobile Premium too. If you’re a Premium member, you can log in and download the tutorial. If you’re not a member, you can of course join today!
Also, don’t forget to follow @envatoactive on twitter, circle us on Google+, like us on Facebook, and grab the Activetuts+ RSS Feed to stay up to date with the latest tutorials and articles.
View full post on Activetuts+
Jan 13, 2012
Posted on Jan 13, 2012 in Hints and Tips | 10 comments
Flash Player 10 introduced new low-level APIs for manipulating audio with AS3. In this tutorial, exclusive to Tuts+ Premium members, you’ll learn about these APIs and how they work, and use them to create a simple app that can play MP3s in reverse.
Premium Preview
Click to view the demo
Click here to view a preview of the SWF we’ll be building in this tutorial. Click on the “Play” button to play the sound. You can’t really tell by looking at or listening to it, but this isn’t just an MP3 loaded and then played normally; the MP3 is being used as a sound source and samples are fed dynamically to the Sound engine. To help prove it, the “Reverse” button will play the same sound, just in reverse. There is no sleight of hand here: there is only one MP3 loaded and the reversal effect is computed on the fly.
If you’re not yet a Premium member, you can still read the first few steps of the tutorial. Members can, of course, access the full thing right away!
We run a Premium membership system which periodically gives members access to extra tutorials, like this one! You’ll also get access to Psd Premium, Vector Premium, Audio Premium, Net Premium, Ae Premium, Cg Premium, Photo Premium, and the new Mobile Premium too. If you’re a Premium member, you can log in and download the tutorial. If you’re not a member, you can of course join today!
Also, don’t forget to follow @envatoactive on twitter, circle us on Google+, like us on Facebook, and grab the Activetuts+ RSS Feed to stay up to date with the latest tutorials and articles.
View full post on Activetuts+
Jan 3, 2012
Posted on Jan 3, 2012 in Hints and Tips | 10 comments
Something a little different for you this week: a Flash slideshow framework. As well as finding it directly useful for any presentations you may give, Premium members can download the full source code, and take it apart to see how the Greensock tweening libraries were used to put it together.
Preview
There are three example slideshows created with the framework:
The slideshows support images, SWFs, and FLV videos, and are all defined by a single simple XML file.
Download
All the files you need to actually use the slideshows are available in this free ZIP file.
If you’re a Premium member, you can download the source files as well; these use Greensock’s LoaderMax and TweenLite libraries, so make excellent examples. You could use these files as examples of how to use those libraries, or could extend them to add your own flair or new features.
We run a Premium membership system which periodically gives members access to extra tutorials, like this one! You’ll also get access to Psd Premium, Vector Premium, Audio Premium, Net Premium, Ae Premium, Cg Premium, Photo Premium, and Mobile Premium. If you’re a Premium member, you can log in and download the tutorial. If you’re not a member, you can of course join today!
View full post on Activetuts+
