Explore F9 As3.0 Preview

Explore Flash Professional Actionscript 3.0 Preview

Disclaimer: The English version of this tutorial originated from Adobe:http://www.adobe.com/devnet/flash/articles/flash9_as3_preview.html
Original Author: Jen DeHaan and Peter DeHaan
This site for its translation and collation, this tutorial reproduced please indicate the source. and marked with activity links, thank you for your cooperation.

Adobe Flash Professional 9 ActionScript 3.0 Preview (AS3.0 preview) is the next preview of the Flash authoring tool that will be released. Its name, known as "Blaze," expands the Flash Professional 8 and includes a series of features to be released with Flash9, which is scheduled for release in 2007.

This preview version includes support for ActionScript 3.0, which has the advantage of a new virtual machine (AVM) contained in Flash Player 9, which is 10 times times faster than traditional ActionScript code, If you want to get more information about Flash Player 9, see the Flash Player Product page

The FLASH9 preview allows you to compile the Actionscript3.0 scripts that are included or imported into the FLA, and the scripts attached to the frame or associated with the library component are added to interact with the content of the scene during the compilation process.

This article is developed by using Flash's drawing tools to create a new form. When you're done with it. If you move the form with the button and the mouse, you will understand how to link the ActionScript from the main timeline to the external file, to the component in the library, or to the Flash document itself.

To complete this article you need Flash Professional 9 Actionscript 3.0 and sample files

writing ActionScript 3.0 in Flash

The FLASH9 preview is just a development environment that allows you to create Flash documents (FLA) and use ActionScript 3.0, but you can also use Flex Builder to compile As3.0.

FLASH9 Preview allows you to create Actionscript3.0 documents based on timelines and other features such as deformation and movement easing, flash.display.MorphShape classes, Abobe.utils package, Static text fields,scenes, and libraries.

The Flash9 Preview includes the following new features:

1.Document class:
FLASH9 introduces the concept of document class, defined as the class associated with the main timeline of your SWF file. When you initialize the main timeline, the document class is already constructed. You can set document class on the file's properties panel or ActionScript 3.0 publishing Settings panel, such as: File>publish Settings > Flash tab > Settings button

The following figure:

2.symbol-class Linkage: (Component-Class link)
In ActionScript 3.0 you no longer need a link ID, and instead you can specify a specific class name for a component that you can instantiate directly or dynamically create an instance of. As shown in the following illustration:

3. If the class cannot be found in the classpath you specify, Flash will create one after the scene so that it can still be instantiated . As shown in the following illustration:

4.Errors and Warnings: (Errors and warnings)
Added two actions for ActionScript 3.0 errors and warnings. You can choose from the features panel of ActionScript 3.0. For example, select the Edit>preferences > ActionScript > ActionScript 3.0 Settings button. The following figure.

-One is strict Mode, which makes the compiler very strict when encountering problems during compilation, and treats it as an error rather than a warning. The other is warnings Mode, and there will be additional warnings, most of the time when you're from ActionScript 2.0 when migrating to As3.0, it will help, and when you choose Warning, you can define the warning you want by editing the enabled attribute in the Enabledwarnings.xml file. Location of enabledwarnings.xml files:
o Windows:c:\program files\adobe\flash 9 public alpha\en\configuration\actionscript 3.0\enabledwarnings.xml
o Mac os:hd| applications| Adobe Flash 9 Public alpha| configuration| ActionScript 3.0| Enabledwarnings.xml

creating clickable and draggable shapes (create clickable and drag bodies)

In this case, you will explore some of the new features of the FLASH9 preview, and you will create a simple form and use the improved class model to make it clickable, and in the following example you will make the body drag, transforming your code into instances of classes and dynamically created classes.

clickable shapes (clickable form)

Now let's start by creating a body that you can click on.

1. Select File > Create a new document and save it as SIMPLEBALL.FLA.
2. Select the Draw Circle tool to draw a positive circle in the scene. Of course, it's OK to hold down SHIFT while drawing.
Note: at the time of drawing, it is true that your object Drawing mode is turned off.
3. Select the Selection tool and double-click the form to highlight it
4. When this form is selected, select Edit Modify>convert to symbol and convert to symbol (press F8) to open the Component Conversion window.
5. Change the name to circle and then click OK to convert it to a movie clip.
6. The component is still selected, and an instance of it on the property panel is named: BALL_MC
7. Cancels the selection of the component to open the Action Panel (F9).
8. Enter the following code on the Action panel:

Code:

Ball_mc.addeventlistener (Mouseevent.click, ClickHandler);
function ClickHandler (event:mouseevent): void {
Trace ("You clicked the Ball");
}

In this code, the BALL_MC instance becomes clickable because you join the event listener to detect whether the user has a click action, and the ClickHandler () function executes whenever the user clicks on the BALL_MC movie clip. This is very similar to the previous version of adding a listening event to the component, such as As2.0 using the Onpress () event to detect if the user clicked on a clip or button.
9. Select Control>test Movie Test Film, when you click on the circle, it will be in the panel output "you clicked the ball."
10. Turn off the SWF file and return to the Flash operating environment, edit your ActionScript code, and add the following line of code to the original code:
Ball_mc.buttonmode = true;
11. Re-test your video, and when your cursor is over a circle, the cursor becomes the shape of a small hand. Used to give the user a hint, which is clickable.

draggable Shapes (drag form)

If you want the user to be able to drag the form in the shadow, you need to add two MouseDown listeners, Mouseevent.mouse_down and MouseUp (MOUSEEVENT.MOUSE_UP), as in the following example.

The following example demonstrates how to add event listeners for MouseDown and MouseUp events

1. Edit our previous example with the following code:

Code:

Ball_mc.buttonmode = true;
Ball_mc.addeventlistener (Mouseevent.click, ClickHandler);
Ball_mc.addeventlistener (Mouseevent.mouse_down, Mousedownlistener);
Ball_mc.addeventlistener (mouseevent.mouse_up, Mouseuplistener);
function ClickHandler (event:mouseevent): void {
Trace ("You clicked the Ball");
}
function Mousedownlistener (event:mouseevent): void {
Ball_mc.startdrag ();
}
function Mouseuplistener (event:mouseevent): void {
Ball_mc.stopdrag ();
}

2. Test your videos. You can drag this round.
Although it didn't take us much time to write this example, but if you were to write a drag form, you might not want to write it, assuming you could convert your code into an external class file connected to a component, and it would automatically create a drag form that would save you a lot of time in the future. Let's look at how to do it below.

Converting code into a class (convert your codes to classes)

The following example creates an ActionScript class that encapsulates the implementation logic of the drag of the entire movie clip. Now whenever you create a new instance of a class that is created, it can be dragged. There is no need to write code for each instance in the scene.

1. Create a new FLA document and save it as a fancyball.fla.
2. Select File>new Select ActionScript file to create a new ActionScript files.
3. Save this ActionScript file as BALL.AS and FLA file for the same path. That's the fancyball.fla you just created.
4. Enter the following code inside:

Code:

Package {
Import Flash.display.MovieClip;
Import flash.events.MouseEvent;
public class Ball extends MovieClip {
Public Function Ball () {
Trace ("Ball Created:" + this.name);
This.buttonmode = true;
This.addeventlistener (Mouseevent.click, ClickHandler);
This.addeventlistener (Mouseevent.mouse_down, Mousedownlistener);
This.addeventlistener (mouseevent.mouse_up, Mouseuplistener);
}
Private Function ClickHandler (event:mouseevent): void {
Trace ("You clicked the Ball");
}
function Mousedownlistener (event:mouseevent): void {
This.startdrag ();
}
function Mouseuplistener (event:mouseevent): void {
This.stopdrag ();
}
}
}

The code above defines a new class named Ball, which inherits the MovieClip class (built into Flash.display package). Note that when you write an external class using As3.0, you must explicitly import the required classes. differs from writing code within the Fla.
5. Save and close the Ball.as document, and then open the Fancyball.fla document.
6. Use the Draw Circle tool to draw a circle in the scene and convert it to MovieClip.
7. Right-click the circle you just created and select the link.
8. Select Export for ActionScript (exported for Action), and enter the class name in the input box for class (classes) ball
9. Click OK to close this panel.
10. It is true that the example of this circle in the scene, the test film. See if the effect is the same as before.
It looks good, and here's an example of how to create a class instance dynamically.

dynamically creating instances of a class (Dynamically creating class instances)

You don't have to always drag components into the scene while authoring, or you can create a new class instance in the library by using the Actionscirpt new action method.

Using the new operator (with a newer action )

The previous ActionScript was created with a new MovieClip or TextField instance by using such as Movieclip.attachmovie (), Movieclip.createemptymovieclip (), or Movieclip.createtextfield (). To create. In ActionScript 3.0, you can create new movieclip,textfield,sprite, and video instances-or your custom classes-by using a method like New Ball (), as follows:
1. Open Fancyball.fla. Delete all instance components in the scene and add the following code to the main timeline:

Code:

var b1:ball = new Ball ();

2. Press CTRL + ENTER Test, note that we will find that nothing appears in the scene, but the output panel will show: "Ball Created:instance1", although Flash created a new instance of ball, but it is not visual, Because you did not use Addchild () to add it to the display list.
3. Edit the code to add the B1 instance to the display list. Test.

Code:

AddChild (B1);

The next time you need to use document class, it will allow you to move the code from the first frame of the main timeline to an external document, similar to the one in the previous example through a component and a class.

using the Document class text box (using the document class input frame)

Here's how to move your code from the main timeline to an external as file.

1. Delete the code on the first frame of the FANCYBALL.FLA.
2. Create a new ActionScript document saved as balldocumentclass.as, in the same directory as FANCYBALL.FLA.
3. Add the following code in BALLDOCUMENTCLASS.AS:

Code :

Package {
Import Flash.display.MovieClip;
public class Balldocumentclass extends MovieClip {
private Var Tempball:ball;
private var max_balls:uint = 10;
Public Function Balldocumentclass () {
var i:uint;
for (i = 0; i < max_balls; i++) {
Tempball = new Ball ();
Tempball.scalex = Math.random ();
Tempball.scaley = Tempball.scalex;
tempball.x = Math.Round (Math.random () * (this.stage.stagewidth-tempball.width));
Tempball.y = Math.Round (Math.random () * (this.stage.stageheight-tempball.height));
AddChild (Tempball);
}
}
}
}

4. Save and close the as document and open the FANCYBALL.FLA.
5. Enter Balldocumentclass in the input box following the document class in the property panel to save the file.
6. Test, you will find that there are 10 different size and location of the components appear in the scene.
Using document class allows you to place your code in an external file, rather than on a timeline, to reuse code in a XU Xu fla file, and to share code more easily in a team Collaboration version control system (CVS).

Summary:

This article is just a simple introduction to As3.0, simply by telling you how to create a simple class, how to use the improved listening event model, and how to use document class.

Ps by Egoldy: After you've learned this article, you'll find that you can also write a program that doesn't see a single line of code in the FLA, it really is the interface and code separation, control, it looks really cool, if you are also learning As3.0, don't forget to share your experience. Cheers J.

Click here to download the source file