Join Joseph Labrecque for an in-depth discussion in this video Compiling and debugging, part of Learning ActionScript.
Compiling ActionScript into a Swif, or some other format, is a fairly straightforward process. But debugging your compiled code can be somewhat of a mystery. In this lesson, we'll examine how to do both from within Flash Professional. In Flash Professional I have a basic FLA created here and there's not to much to it. But I am pointing to a specific document class under the package calm.josephlebreck.samples.sample document class.
And I click this I'll bring us into that class itself, so you can see that I have my package defined up here. I'm extending MovieClip and I have a basic Constructor function. So if we want to compile this, we can choose here our specific player. So we can compile down targeting different versions of the flash player itself in which case it will create for us a swiff or we can target air. And if we target air 2.5 or 2.6 or whatever the particular version is, it's going to create for us a .air file.
Which need the air run time to play back on the desktop. If we choose to compile to air for iOS, it will actually create a file that is compatible with iOS, so iPhone and iPad and so forth. Likewise, if we choose Air for Android, it will create an Android APK, an application file for us. And then we have a bunch of different Flash light scenarios here. But we're going to choose here, Flash Player and Flash Player is going to generate a Swif for us.
Which is going to play back in the Flash Player that's available in the browser. So what we want to do to compile this is we're going to go up to File, and Publish, and you can see that there is also a shortcut here that you can use. All right, so that published the Swif for us and you can see now our Swif history has come about here. And if we actually go into the folder that this project is contained in we can see that it's created for us this sample Swif.
And if we run that, you can see it's running in our Flash Player 10 here and here's the Swif. There's nothing going on, but it has compiled a Swif and it's running for us. So what if we want to actually debug this? Now, for that we have to first look at some different things. So here we can see that this document class doesn't really do anything yet. So, let's make it do something. I'm going to go in here and I'm going to paste in Trace Hello Flash. So, this is a basic kind of Hello World example, of how to get some debug information from Flash Pro.
When you use Trace, what Trace is going to do, is it's going to output the value of whatever you place within those brackets to the console. So, if we run this right now, and the way you can just test things in Flash Pro and run it is go Test Movie. So, Test Movie in Flash Pro, test, and you can also hit Ctrl +l Enter to do this. So, we'll test and you can see that it compiles.
And we also have, in our output console, the text Hello Flash. So that's one way you can debug. Another way is to actually set breakpoints within your class files, and you do that by clicking on this little gutter here. And you can see a breakpoint shows up as a little red dot. And you can click the break point to make it go away and click that line number to make it come back. Basically what a break point does is it stops the code from executing at a certain place. It pauses it, and let's you introspect the code. Let's see how this works.
We'll go up to the Debug menu, and we'll choose to Debug movie, in Flash Professional, and debug. And you can see that there is also a set of key commands that are bound to debug as well. All right, so this looks a little bit different and that's because we're now in debug mode. We have a debug console up here, where we can do things like continue. Because you can see right now we are actually paused on that line where we set a break point.
You can step over or step in certain functions and so forth. What's really useful, though, is you've got this Variables panel here and within this panel. You can twirl down and see every little piece of object that actually exists within this movie. So we don't have any specific variables or constants to find in this movie. But there are things in here that are all inherited from Movie Clip.
So since we're extending Movie Clip for our document class we have things like X and Y position. Visibility, width, whether it uses a hand cursor or not, all of these different points here. So once we look through all this and we're satisfied, we can actually move on and tell the Debug console to continue. And in that case if we had anything else going on, if we had any more break points set.
It would pause at those break points as well, and we could further introspect the code. So, in this lesson we've shown both how to compile ActionScript to a usable object, like a Swif. And we've also seen how to go about tracing out information to the Output window, and further debugging through, through break points.
- What is ActionScript and why should I learn it?
- ActionScript 2.0 vs. ActionScript 3.0
- Implementing external source code
- Working in Flash Professional and Flash Builder
- Understanding language fundamentals
- Working with ActionScript objects