Beginners Tutorial Part 3

So far in this series we have looked at setting up flashdevelop, starting a project, adding some text with an embedded font, and changing the way the text looks.

In this final section we will be looking at buttons and event handling.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
package
{
import flash.display.Sprite;


/**
* ...
* @author Rageace
*/

public class Main extends Sprite
{

public function Main():void
{


//Create a new instance of a Sprite to act as the button graphic.
var button0:Sprite;
button0 = new Sprite();

//Set the color of the button graphic
button0.graphics.beginFill(0x0066CC);

//Set the X,Y, Width, and Height of the button graphic
button0.graphics.drawRect(50, 0, 20, 20);

//Apply the fill
button0.graphics.endFill();

//Add useHandCursor, buttonMode, and mouseChildren if required
button0.useHandCursor = true;
button0.buttonMode = true;

//Add Button Sprite to stage
addChild(button0);

}




}

}

 

The following code builds on the examples we have covered previously.

It adds a blue button to the stage.

You should go through the code and check you understand it. It is all commented and should be easy to understand.

Using your new found knowledge I give you following task – create 3 buttons – button0, button1 and button2, of 3 different colours and put them on the stage.

Once you’ve given it a go have a look at my solution.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
package
{
import flash.display.Sprite;


/**
* ...
* @author Rageace
*/

public class Main extends Sprite
{

public function Main():void
{

//Create a new instance of a Sprite to act as the button graphic.
var button0:Sprite;
var button1:Sprite;
var button2:Sprite;
button0 = new Sprite();
button1 = new Sprite();
button2 = new Sprite();


//Set the color of the button graphic
button0.graphics.beginFill(0x0066CC);
button1.graphics.beginFill(0xFF0000);
button2.graphics.beginFill(0x009900);

//Set the X,Y, Width, and Height of the button graphic
button0.graphics.drawRect(50, 0, 20, 20);
button1.graphics.drawRect(70, 0, 20, 20);
button2.graphics.drawRect(90, 0, 20, 20);

//Apply the fill
button0.graphics.endFill();
button1.graphics.endFill();
button2.graphics.endFill();
//Add useHandCursor, buttonMode, and mouseChildren if required
button0.useHandCursor = true;
button0.buttonMode = true;
button1.buttonMode = true;
button2.useHandCursor = true;
button2.buttonMode = true;

//Add Button Sprite to stage
addChild(button0);
addChild(button1);
addChild(button2);


}




}

}

Event Handling

Now we want our buttons to actually do something, so we need to think about event handling.

When our buttons are pressed, or rolled over, or whatever, an event is triggered. We need to respond to this event.

Now if we have 3 buttons (as we do), a red, a green and a blue, we could create 3 different functions.

redButtonPressed, blueButtonPressed, greenButtonPressed, and when the relevant button is pressed this function is called.

//You can put this in your main method

//Add event listeners
button0.addEventListener(MouseEvent.MOUSE_DOWN, blueButtonPressed);
button1.addEventListener(MouseEvent.MOUSE_DOWN, redButtonPressed);
button2.addEventListener(MouseEvent.MOUSE_DOWN, greenButtonPressed);

We also need to make sure we import the mouse events, so add this to the top.

import flash.events.MouseEvent;

Now we create separate functions with these names which are called when the Mouse Down event occurs on the button.

private function blueButtonPressed(event:MouseEvent):void
{
trace("blue");
}
private function redButtonPressed(event:MouseEvent):void
{
trace("red");
}
private function greenButtonPressed(event:MouseEvent):void
{
trace("green");
}

So now lets save it and run it.

It works :)

If it doesn’t work then here is my code, try and see where the code differs to spot your mistakes.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
package
{
import flash.display.Sprite;
import flash.events.MouseEvent;



/**
* ...
* @author Rageace
*/

public class Main extends Sprite
{

public function Main():void
{


//Create a new instance of a Sprite to act as the button graphic.
var button0:Sprite;
var button1:Sprite;
var button2:Sprite;
button0 = new Sprite();
button1 = new Sprite();
button2 = new Sprite();


//Set the color of the button graphic
button0.graphics.beginFill(0x0066CC);
button1.graphics.beginFill(0xFF0000);
button2.graphics.beginFill(0x009900);

//Set the X,Y, Width, and Height of the button graphic
button0.graphics.drawRect(50, 0, 20, 20);
button1.graphics.drawRect(70, 0, 20, 20);
button2.graphics.drawRect(90, 0, 20, 20);

//Apply the fill
button0.graphics.endFill();
button1.graphics.endFill();
button2.graphics.endFill();
//Add useHandCursor, buttonMode, and mouseChildren if required
button0.useHandCursor = true;
button0.buttonMode = true;
button1.buttonMode = true;
button2.useHandCursor = true;
button2.buttonMode = true;
//Add event listeners
button0.addEventListener(MouseEvent.MOUSE_DOWN, blueButtonPressed);
button1.addEventListener(MouseEvent.MOUSE_DOWN, redButtonPressed);
button2.addEventListener(MouseEvent.MOUSE_DOWN, greenButtonPressed);

//Add Button Sprite to stage
addChild(button0);
addChild(button1);
addChild(button2);


}//end main method

private function blueButtonPressed(event:MouseEvent):void
{
trace("blue");
}
private function redButtonPressed(event:MouseEvent):void
{
trace("red");
}
private function greenButtonPressed(event:MouseEvent):void
{
trace("green");
}





}

}

 

Now there is another to handle events. At the minute for each button we have a separate function dealing with the event. Notice that each of these functions receive the MouseEvent object as an argument.

This MouseEvent object holds some useful information, so we can use this to see where it came from, basically to see which button created the event.

In this final example I use a switch statement, to compare where the object came from, to the different button objects.

When we have a match, we know that must be the object that created the event.

Another thing to bear in mind here is the scope of functions and variables.

In this next example I have declared the buttons at the top, so their scope is over the whole class (scope is beyond the ‘scope’ of this tutorial, but think of it as the braces it is defined in).

Have a look at the final example.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
package
{
import flash.display.Sprite;
import flash.events.Event;
import flash.text.TextFormat;
import flash.text.TextField;
import flash.events.MouseEvent;
import flash.text.TextFieldAutoSize;


/**
* ...
* @author James W
*/

public class Main extends Sprite
{
//Allocate 3 sprite objects
private var button0:Sprite;
private var button1:Sprite;
private var button2:Sprite;
//Allocate textformat object
private var myTextFormatter:TextFormat;

//allocate text field
private var myTextField:TextField;


public function Main():void
{






//Now we create a TextFormat object.
//This basically represents character formatting information - it lets us make the text look pretty :)


//var myTextFormatter:TextFormat = new TextFormat();//Give it an imaginative name
myTextFormatter = new TextFormat();
myTextFormatter.color = 0x0066CC;//Setting the colour,


myTextFormatter.size = 32;//Setting the size


//Now we will create the text field
myTextField = new TextField();//Imaginatively named myTextField
//Remember now we are dealing with the text field, not the TextFormat object



myTextField.wordWrap = true; //We want word wrap - this means that if we have too much text for the line
//we will start a new line


myTextField.defaultTextFormat = myTextFormatter;//Remember the text format object we made earlier?
//Well now we are saying that we want this object to be used to format this text field.

myTextField.autoSize = TextFieldAutoSize.LEFT;//how we want the box to autosize



myTextField.text = "The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.";//The text in our text field

myTextField.width = 500;//The width of the text field

myTextField.x = 50;//The x position of the text field
myTextField.y = 50;//The y position of the text field

myTextField.selectable = true;//Can we select thet text

addChild(myTextField);//Add the text field

/**
* The following code is not part of the tutorial, but for demonstration
*/



//Create a new instance of a Sprite to act as the button graphic.
button0 = new Sprite();
button1 = new Sprite();
button2 = new Sprite();
//Set the color of the button graphic
button0.graphics.beginFill(0x0066CC);
button1.graphics.beginFill(0xFF0000);
button2.graphics.beginFill(0x009900);
//Set the X,Y, Width, and Height of the button graphic
button0.graphics.drawRect(50, 0, 20, 20);
button1.graphics.drawRect(70, 0, 20, 20);
button2.graphics.drawRect(90, 0, 20, 20);
//Apply the fill
button0.graphics.endFill();
button1.graphics.endFill();
button2.graphics.endFill();
//Add useHandCursor, buttonMode, and mouseChildren if required
button0.useHandCursor = true;
button0.buttonMode = true;
button1.useHandCursor = true;
button1.buttonMode = true;
button2.useHandCursor = true;
button2.buttonMode = true;
//Add event listeners
button0.addEventListener(MouseEvent.ROLL_OVER, buttonHandler);
button1.addEventListener(MouseEvent.ROLL_OVER, buttonHandler);
button2.addEventListener(MouseEvent.ROLL_OVER, buttonHandler);
//Add Button Sprite to stage
addChild(button0);
addChild(button1);
addChild(button2);


}//End Main method

//Define button handler
private function buttonHandler(event:MouseEvent):void
{



///We will use a switch block
switch (event.target)
{
case button0 :

myTextFormatter.color = 0x0066CC;//Setting the colour of the textformater object,
myTextField.setTextFormat(myTextFormatter);




break;
case button1 :
trace(1);
myTextFormatter.color = 0xFF0000;//Setting the colour of the textformater object,
myTextField.setTextFormat(myTextFormatter);



break;
case button2 :
myTextFormatter.color = 0x009900;//Setting the colour of the textformater object,
myTextField.setTextFormat(myTextFormatter);


break;
}//End switch
}//endclickhandler


}//End main class



}//End package

 

Extension

As an extension for you try and use 3 different embedded fonts, and make the buttons change the font of the text.

 

 

This concludes the series.

 

Beginners Tutorial Series Part 3

In part 1 of this tutorial we installed Flash develop, in part 2 we programmed the infamous Hello World! program. In this part we will be looking at how to embed fonts in actionscript 3 using Flashdevelop, and different ways to make our text look pretty!

Preliminaries

  • You should have a basic understanding of text objects, and the Main.as file opened. Check out part 1 and part 2 of this series to get to grips with this.
  • You should create a folder named assets in your folder structure.
  • You can do this by on the top level folder, going to add and then new folder
  • You will also need some fonts, you can use True Type Fonts, or Open Type fonts.
  • I recommend Dafont for free fonts

How to embed a font in Actionscript 3

  • We need the following imports
1
2
3
4
5
import flash.display.Sprite;
import flash.text.TextField;
import flash.text.Font;
import flash.text.TextFormat;
import flash.text.TextFieldAutoSize;
  • Now in the main function we want the following code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
//First we will embed the fonts.
[Embed(source='../assets/Topsy.ttf', fontFamily="Topsy",embedAsCFF="false")]
var topsyEmbedded:Class;
//allocate font objects
var topsyFont:Font = new topsyEmbedded();

//Allocate textformat object
var myTextFormatter:TextFormat = new TextFormat();
//Creating Font Objects
myTextFormatter.font = topsyFont.fontName;//Setting the font
myTextFormatter.color = 0x0066CC;//Setting the colour,

myTextFormatter.size = 32;//Setting the size
//allocate text field
var myTextField:TextField;

//Now we will create the text field
myTextField = new TextField();//Imaginatively named myTextFieldTextField;

myTextField.defaultTextFormat = myTextFormatter;//Remember the text format object we made earlier?
//Well now we are saying that we want this object to be used to format this text field.

myTextField.embedFonts = true;//We want to use embedded fonts

myTextField.wordWrap = true; //We want word wrap - this means that if we have too much text for the line
//we will start a new line
//myTextField.autoSize = TextFieldAutoSize.LEFT;//how we want the box to autosize

myTextField.embedFonts = true;//We want to use embedded fonts

myTextField.text = "The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.";//The text in our text field

myTextField.width = 500;//The width of the text field

myTextField.x = 50;//The x position of the text field
myTextField.y = 50;//The y position of the text field

myTextField.selectable = true;//Can we select the text
addChild(myTextField);//Add the text field

 

  • In this example I used a font called Topsy. I embedded it with this code
[Embed(source='../assets/Topsy.ttf', fontFamily="Topsy",embedAsCFF="false")]
var topsyEmbedded:Class;
  • The source is the location of the font file, in this case it is a font called Topsy in the assets folder. If you want to know the location of your file and are using Flashdevelop, you can right click on the file, and go to insert into document. This will give you some of the embed code – including the location, but you will have to add the fontFamily part, and very importantly the embedAsCFF=”false”
  • In this code, we also set the colour of the text, and the size of text.
  • The important idea to get your head around with all of this code is using the TextFormat object.
  • This object is used to control some features like the font, so we can control how our text is displayed.
  • Looking at this code I have commented it to it should be clear for you to follow and understand what is going on.
  • In this code we show how to set the x and y position of the text field, change the colour of the text field , set the font size, set the font, and the autosize settings.
  • Have a play around with the code changing the values.
  • Using my code as an example, you could try the following challenge.
  • Start a new blank project, embed a font of your choice, put some text on the screen at position x =100, y = 50, in size 32 font, saying “Part 3 complete”. Set the colour of the text to green. The text in the field should not be selectable.
  • Here is my code for the challenge.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
package
{
import flash.display.Sprite;
import flash.text.TextField;
import flash.text.Font;
import flash.text.TextFormat;
import flash.text.TextFieldAutoSize;


/**
* ...
* @author Rageace
*/

public class Main extends Sprite
{

public function Main():void
{
//First we will embed the fonts.
[Embed(source='../assets/Topsy.ttf', fontFamily="Topsy",embedAsCFF="false")]
var topsyEmbedded:Class;
//allocate font objects
var topsyFont:Font = new topsyEmbedded();

//Allocate textformat object
var myTextFormatter:TextFormat = new TextFormat();
//Creating Font Objects
myTextFormatter.font = topsyFont.fontName;//Setting the font
myTextFormatter.color = 0x006600;//Setting the colour,


myTextFormatter.size = 32;//Setting the size
//allocate text field
var myTextField:TextField;



//Now we will create the text field
myTextField = new TextField();//Imaginatively named myTextFieldTextField;

myTextField.defaultTextFormat = myTextFormatter;//Remember the text format object we made earlier?
//Well now we are saying that we want this object to be used to format this text field.

myTextField.embedFonts = true;//We want to use embeded fonts

myTextField.wordWrap = true; //We want word wrap - this means that if we have too much text for the line
//we will start a new line
//myTextField.autoSize = TextFieldAutoSize.LEFT;//how we want the box to autosize


myTextField.embedFonts = true;//We want to use embeded fonts

myTextField.text = "Part 3 complete";//The text in our text field

myTextField.width = 500;//The width of the text field

myTextField.x = 100;//The x position of the text field
myTextField.y = 50;//The y position of the text field

myTextField.selectable = false;//Can we select thet text
addChild(myTextField);//Add the text field

}



}

}

To conclude, in this section of the series we have seen how to:

  • Embed fonts
  • Create text fields
  • Set the font size of text fields
  • Set the font colour of text fields
  • Position a text field

 

If there are any parts of the code above that you don’t understand then feel free to comment.

Beginners Tutorial Series – Part 2

This is the second part of the Beginners Actionscript 3 tutorial series. If you have successfully installed Flashdevelop then carry on here, if not go back to part 1

So far you should have a new project set up, and be eager to actually do some coding!

Now looking at the project we have started, and the Main.as file, we can see that Flashdevelop has added some code, a lot of which we don’t really need for this tutorial.

For simplicity we are going to remove this code and start from a blank slate. So delete everything and replace it with this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
package
{
import flash.display.Sprite;

/**
* @author Rageace
*/

public class Main extends Sprite
{

public function Main():void
{

}

}

}

The beginning of this tutorial aims at explaining some of the theory behind what’s going on. You should read it, and try and understand what’s going on, but if it’s all too heavy for you then scroll on down until you get to the heading:
The actual coding starts here!!! Finally!!!

For those of you curious to understand what the code we have removed is for (and although curiosity may have killed the cat, it is good for the coder!), there is an explanation of ‘What if (stage) init();’ means over on StackOverflow (trust me if you haven’t heard of that site yet – you’ll certainly see a lot of it throughout your coding career! If you have a question chances are somebody else has had it, asked it and solved it over on StackOverflow so definitely check it out!).

Now an explanation of what we have here.

package
{

In this tutorial we won’t be talking about packages, however for the curious amongst you, packages are a way for us to better organise our code, and also to aid in code reuse. As is the style with this tutorial series, if something is beyond the scope of this tutorial, or better explained somewhere else then I will link to some further reading. In this case check out the explanation here
We then have a left brace {, remember that we need to close all braces that we open.
Imports

    import flash.display.Sprite;

Here we are importing a the flash.display.Sprite class. You don’t need to know what this means, but you need to understand that a lot of features/functionality is included already in Actionscript 3, which means we don’t have to implement everything from scratch, but instead we need to ‘import’ these chunks of functionality.
Commenting in Actionscript 3
When we program we might want to write comments so that when we return to our code, or when somebody else uses our code, we can understand it. (Also the process of commenting your code will often mean you gain a deeper understanding of your code and can help in spotting problems and making it more efficient).
We have single line and multi-line comments

1
2
3
4
5
6
7
8
9
//This is a single line comment
trace("some text")//traces some text to the output window at the bottom of the screen.
/**
*This is a multi-line comment
*We don't need to put the
asterisks here, it still gets commented out
we use the asterisks for clarity.
We can use multiline comments to comment out big chunks of code.
**/

Defining a class
Next we are defining a class

public class Main extends Sprite
{//start of class

//Methods, variables etc go in here

}//end of class

The following explanation of classes is not necessary to complete this tutorial. If you already understand classes, or just want to get to some actual coding and can’t bear anymore theory then scroll on down to the ‘Defining Functions’ section

Classes – What are classes? What is the instantiation of an object?
In Object Orientated Programming we have – you guessed it – Objects. We can think of everything as an object, and we can think of classes as a blueprint which we use to create an instance of an object from.
When we create a class, we should try and group things together logically.
For example we could be making a game and have a class gun. Now we want the gun object to be able to shoot and reload, and so within this class we define functions for shooting and reloading, and variables ‘clip size’ , ‘bullet range’ and ‘damage’.
Then we could create an instance of this class when we want a gun object. There are many advantages to this, and if you are interested I suggest you do some research into the benefits of object orientated programming. But just to get you thinking, if you have guns which shoot different distance and hold different amounts of bullets, we could use this same class to create them, and just give the variables different values.
Anyway this is a huge topic, and I didn’t even intend to cover it at all in this tutorial so we will leave it here.

Defining Functions
Methods/Functions live inside our classes.

public class Main extends Sprite
public function Main():void
{

}

Here we have the Main function. It’s return type is void (it doesn’t return an object), and its access modifier is public. It also extends the Sprite class. For a beginner you don’t really have to understand everything that is going on here,(and seeing as this part of the tutorial is rapidly tending towards my first year programming course, I think that if you want to understand the different access modifiers, the extending of classes and more details on object orientated programming then you can Google it, or if you ask me really nicely I might write a thorough tutorial series on it, but this series is just to introduce beginners to the shallow end of Actionscript 3 programming, giving them a gentle introduction!)

The actual coding starts here!!! Finally!!!

How do I add text in actionscript?
To add some text we will do the following.

  1. We need to import flash.text.textfield . So add the following import statement to the top of your code, underneath the first opening brace, next to the other import statements.
  2. import flash.text.TextField;
  3. Now we need to define a variable (think of x and y in your maths equations to get a feel for what a variable is), this variable needs to hold our text field.
  4. Copy and paste the following code into your main function
  5. //allocate text field
    var myTextField:TextField;
  6. Now what we did above it basically allocating space for the object, it’s like saying okay we want a text field to live in this space, and we will call it myTextField. What we need to do now is create the object to sit in the space.
  7. //Now we will create the text field
    myTextField = new TextField();//Imaginatively named myTextField
  8. Wordwrap – We want the text field to use wordwrap, that means if the text goes on past the end of the line it wraps around onto the next line.
  9. myTextField.wordWrap = true; //We want word wrap - this means that if we have too much text for the line
    //we will start a new line
  10. Now we actually want to add some text to our text field.
  11. myTextField.text = "Hello World!";//The text in our text field
  12. Now if we were to save (hotkey is CTRL S) and then run (F5), – you can try if you want to, then we will just see a white screen. To actually see our text field we need to add it to the stage (as a child). The ins and outs are not important for this tutorial. What is important is this
  13. addChild(myTextField);//Add the text field
  14. Now try and run it – hopefully you will see some text on the screen
  15. Well done! If you are having any trouble, then your code should look like this:
  16. 1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    package
    {
    import flash.display.Sprite;
    import flash.text.TextField;/**
    * ...
    * @author Rageace
    */

    public class Main extends Sprite
    {

    public function Main():void
    {
    //allocate text field
    var myTextField:TextField;
    //Now we will create the text field
    myTextField = new TextField();//Imaginatively named myTextFieldTextField;
    myTextField.wordWrap = true; //We want word wrap - this means that if we have too much text for the line
    //we will start a new line
    myTextField.text = "The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.";//The text in our text field
    addChild(myTextField);//Add the text field

    }

    }

    }

 

This is the end of Part 2 of the introduction to programming with actionscript 3 series. In this part we have looked at classes, functions, imports, text, and you’ve done the obligatory Hello World program!

Beginners Tutorial Series – Part 1

You can skip this section and head straight to Part 2 if you already have Flashdevelop installed

In Part 1 of this tutorial we will:

  • Install Flashdevelop
  • Add some text to the stage with Flashdevelop
  • Explain some basic programming ideas

Install Flashdevelop

Gone are the days when to make Flash games/application you had to buy the official Flash software, now we have some free open source alternatives!

Head on over to the Flashdevelop site and download the latest version.

I had no problems installing, I just ran the installer and stuck with their default settings.

In older versions I believe that you had to integrate the Flex SDK, but as of v3.3 it configures itself when it is first run.

Opening flash develop and starting a new project

Now load up Flashdevelop.

Start a new project (Go to Project, New Project, AS3 Project)

Give your project a name (a descriptive name is best!)

Set the location where your project files will be stored. It is good practice to start a new project, in a new folder.

Keep the ‘Create Directory For Project’ ticked

Press OK

Now down the right hand side of the screen we can see the folders and files associated with the project.

Navigate to the src folder, and double click on the Main.as file which Flashdevelop has helpfully created for us.

This concludes part 1 of the Introduction to Actionscript 3 series.

Introduction

In this tutorial series I will be explaining the basics of Actionscript 3.

We will cover:

  • How to install and use Flashdevelop
  • How to define variables in Actionscript 3
  • How to define functions in Actionscript 3
  • How to display text and embed fonts in Actionscript 3
  • How to create buttons in Actionscript 3
  • Some basic event handling
  • Some ideas for extension

Below we can see the finished product.

Finished Product

Get Adobe Flash player

Welcome

Welcome to Rageace.com

 

Here you will find Flash games and Actionscript 3 tutorials.

 

Actionscript 3 Beginner Tutorial Series

  • Introduction
  • Part 1 -  Includes adding text and embedding fonts.
  • Part 2 – Adding buttons
  • Part 3 – Handling events
  • Conclusion