ActionScript 3 tutorials: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
m (Text replacement - "<pageby nominor="false" comments="false"/>" to "<!-- <pageby nominor="false" comments="false"/> -->")
 
(18 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{stub}}
{{incomplete}}


<pageby nominor="false" comments="false"/>
<!-- <pageby nominor="false" comments="false"/> -->


== Actionscript 3, the programming language shared by Flash and Flex ==
== Actionscript 3, the programming language shared by Flash and Flex ==


This pages is for actionscript concepts that apply to any ActionScript 3.0 authoring environment and any runtime that supports ActionScript 3.0. For the moment, two authoring environment are covered in this wiki, Adobe [[Flash CS3 desktop tutorial|Flash CS3]] and [[Adobe Flex]]. The focus of this page is on programming concepts that are completely tool un-specific (that would work in Flash as well as Flex).
This pages is for actionscript concepts that apply to any [[Flash ActionScript 3 overview|ActionScript 3.0]] authoring environment and any runtime that supports ActionScript 3.0. For the moment, two authoring environment are covered in this wiki, Adobe [[Flash CS3 desktop tutorial|Flash CS3]] and [[Adobe Flex]]. The focus of this page is on programming concepts that are completely tool un-specific (that would work in Flash as well as Flex).


== Disclaimer ==
== Disclaimer ==
Line 30: Line 30:
  var counter:int = 0;
  var counter:int = 0;


* AS3 is an object oriented language. This means that you have the possibility to split your code into specialized classes rather than write a single program of 3,000 lines of code. This contributes to make the code easier to maintain and easier to re-use. You can then design specialized components that will be re-used across different applications. A typical example of such a component would be a calendar object that pops up to let you specify a date.
* AS3 is an object oriented language. This means that you have the possibility to split your code into specialized classes rather than write a single program of 3,000 lines of code. This contributes to make the code easier to maintain and easier to re-use. You can then design specialized components that will be re-used across different applications. A typical example of such a component would be a calendar object that pops up to let you specify a date.
 
The problem then, for a total newbie, is that the use of classes is not optional. *Everything* needs to be organized into classes. You must have at least one class in your program. This can appear quite obscure at first. But because the class definition always uses the same format, that's simply a question of getting used to add these extra lines in your code. Initially you will write short programs that don't justify the use of more than a single class. Don't worry if you don't understand that class concept yet. What matters is that you start going, start writing a bit of code and become able to play around. We will come back on the concept of class soon enough. 
 
// The class definition
public class Game {
    // instance variable of type integer
    var score:int
  // The constructor method
    public function Game () {
          // code that initialize Game instances
    }
   
  // instance method
    public function updateScore ():void {
        // code to execute when updateScore () is invoked
    }
 
With the structure in class comes another concept, the one of package. A package is a conceptual container. It is used to group classes that operate together within a physical region of their own. Its main function is to help organize the code for large applications. Another complex concept to grasp for a total beginner. The recommendation here is the same as for classes. In a first time, simply use the syntax without worrying too much about what it is for. Your are likely to write programs that stand within a single package for a few weeks, so don't worry about not understanding it. We will take the time to explain this in more details, as soon as you are up to it.


== Enough technicalities, let's program! ==
== Enough technicalities, let's program! ==
Line 69: Line 50:
=== Stage 3, Intermediate ===
=== Stage 3, Intermediate ===


Drawing rectangles and interactive buttons on the screen is all good, but that doesn't get you very far, is it? Here you learn to write more complex programs, like mini-games. These programs are too complex to hold on a single page of code. You are introduced to the gist of some OO concepts. At this level; we have code spread over multiple files, class-based code organisation, inheritance, composition, dispatching events across objects, reading xml data or embedding assets stored locally.
Drawing rectangles and interactive buttons on the screen is all good, but that doesn't get you very far, is it? Here you learn to write more complex programs, like mini-games. These programs are too complex to hold on a single page of code. You are introduced to the gist of some OO concepts. At this level, we have code spread over multiple files, class-based code organisation, inheritance, composition, dispatching events across objects, reading xml data or embedding assets stored locally.


Go to [[AS3 Tutorials Intermediate|Intermediate]]
Go to [[AS3 Tutorials Intermediate|Intermediate]]
Line 77: Line 58:
All you need to know to write the next killer web 2.0 application that will make you rich or to become a professional freelance developer. You get to learn about design patterns and data services. The advanced tutorial will be shared between AS3 and Flex and would assume basic knowledge of Flex.  
All you need to know to write the next killer web 2.0 application that will make you rich or to become a professional freelance developer. You get to learn about design patterns and data services. The advanced tutorial will be shared between AS3 and Flex and would assume basic knowledge of Flex.  


Well, this may remain underdeveloped till I reach that stage myself. Give me a few months. I challenge you to make more rapid progresses than I will and actively contribute to the writing of that section!  
Well, this may remain underdeveloped till I reach that stage myself. Give me a few months. I challenge you to make more rapid progress than I will and actively contribute to the writing of that section!  


Go to [[AS3 Tutorials Advanced|Advanced]].
Go to [[AS3 Tutorials Advanced|Advanced]].
Line 85: Line 66:
* [[AS3 simple examples]]
* [[AS3 simple examples]]
* [[AS3 Useful links]]
* [[AS3 Useful links]]
** [[AS3 Links Tutorials|Tutorials]]
** [[AS3 Links Tutorials|On-line Tutorials]]
** [[AS3 Links Documentation|Reference Manuals and Cheatsheets]]
** [[AS3 Links Documentation|Reference Manuals and Cheatsheets]]
** [[AS3 Links Documentation|Books]]
** [[AS3 Links Documentation|Books]]
** [[AS3 Links Toolkits|Toolkits, Libraries, Reusable Components, Reusable Code]]
** [[AS3 Links Toolkits|Toolkits, Libraries, Reusable Components, Reusable Code]]
* Ideas and Information for programming projects
** [[ProgrammingProjects_Fractals|Fractals]]
** [[ProgrammingProjects_Tessalation|Tesselation]]
** [[ProgrammingProjects_Patterns|Patterns and Symmetry]]
** [[ProgrammingProjects_Puzzles|Puzzles]]
** [[ProgrammingProjects_etivities|Interactive Learning Activities]]
** [[ProgrammingProjects_Games|Games]]
** [[ProgrammingProjects_Makers|Makers]]
** [[ProgrammingProjects_Visualisation|Data Visualisation]]
** [[ProgrammingProjects_MiniApps|MiniApps]]


== Related pages ==
== Related pages ==
Line 94: Line 85:
* [[ActionScript 3 event handling tutorial]]
* [[ActionScript 3 event handling tutorial]]
* [[ActionScript 3 interactive objects tutorial]]
* [[ActionScript 3 interactive objects tutorial]]
* [[AS3 Useful links]]


[[Category: Technologies]]
== Credits ==
 
This tutorial was for a good part written at a time where Marielle Lange (widged) was visiting fellow at the [http://www.macs.hw.ac.uk/ School of Mathematical and Computer Sciences, Heriot-Watt University] (Edinburgh, UK). I am most thankful for the office space and collegial environment offered during my 3 months there.
 
 
 
[[Category: Multimedia]]
[[Category: Multimedia]]
[[Category: Actionscript 3]]
[[Category: Actionscript 3]]
[[Category: Flash]]
[[Category: Flash]]
[[Category: Flex]]
[[Category: Flex]]
[[Category: ActionScript tutorials]]

Latest revision as of 17:48, 22 August 2016


Actionscript 3, the programming language shared by Flash and Flex

This pages is for actionscript concepts that apply to any ActionScript 3.0 authoring environment and any runtime that supports ActionScript 3.0. For the moment, two authoring environment are covered in this wiki, Adobe Flash CS3 and Adobe Flex. The focus of this page is on programming concepts that are completely tool un-specific (that would work in Flash as well as Flex).

Disclaimer

We write these pages as (recent) learners of the language. We are not experts.

EcmaScript Specification

ActionScript 3.0 is based on the EcmaScript 4th edition language specification. This specification can be viewed on the wiki of the Ecmascript Organisation. That specification also forms the chore of the Javascript 2.0 language contributed by the Mozilla foundation (see tamarin project at Mozilla.org).

Overview

ActionScript 3.0 is an object-oriented language for creating applications and media-content that can then be played back in Flash client runtimes (typically the Adobe Flash Player, more recently the AIR framework).

For those already familiar with a Flash authoring environment, it needs to be mentioned that quite important changes have been introduced in the ActionScript language between version 2 and version 3. Version 2 was somehow a scripting language targeted at unexperienced programmers. Version 3 has all characteristics of any serious programming language.

This may make it slightly more difficult for complete beginners to jump in. These changes, however, don't prevent a person who would have never programmed before to learn the language. This is in part because the authoring environment let you define content and basic actions without having to care about code. Progressive learning can take place.

The reason these changes were introduced is simply because the benefits of the changes introduced in version 3 far outweight any possible inconvenience to the complete newbie.

Two main aspects of the language:

  • AS3 is a strongly typed language. This means that whenever you use a variable, you must provide information about the type of data that this variable is expected to hold. If you want to use a counter and keep track of the counter progress in a variable, the type of data to be held in this variable will be of integer type (non negative numbers). To define that counter variable in AS3, you will type something like
var counter:int = 0;
  • AS3 is an object oriented language. This means that you have the possibility to split your code into specialized classes rather than write a single program of 3,000 lines of code. This contributes to make the code easier to maintain and easier to re-use. You can then design specialized components that will be re-used across different applications. A typical example of such a component would be a calendar object that pops up to let you specify a date.

Enough technicalities, let's program!

Whatever your level, make sure that you read the instructions on How to compile an AS3 program and that you are successful at compiling the first example given on that page.

Stage 1, Absolute Novice

What you need to get started. This assumes absolutely no prior experience with programming whatsoever. Because of this, it can be perceived as a bit dumb and slow-paced for persons who have already done some coding. In this case, simply rapidly browse through, have a look at the demo examples. Because each one explores a simple technique in isolation, they can be used as reference to Beginner and Intermediate coders.

Go to Novice

Stage 2, Beginner

This assumes that you have a very basic understanding of the general format and syntax of an AS3 program and know how to compile it. You know how to draw a rectangle on the screen by slightly adapting the code provided, but that's about it. You are a bit lost when it comes to writing your own program from scratch, even the simplest one. Well, you will be given the basic knowledge required to transform simple ideas into simple programs mixing graphics and interactive components. You learn about basic data types and control statements as well as how to use instance functions to organize your code more efficiently.

Go to Beginner

Stage 3, Intermediate

Drawing rectangles and interactive buttons on the screen is all good, but that doesn't get you very far, is it? Here you learn to write more complex programs, like mini-games. These programs are too complex to hold on a single page of code. You are introduced to the gist of some OO concepts. At this level, we have code spread over multiple files, class-based code organisation, inheritance, composition, dispatching events across objects, reading xml data or embedding assets stored locally.

Go to Intermediate

Stage 4, Advanced

All you need to know to write the next killer web 2.0 application that will make you rich or to become a professional freelance developer. You get to learn about design patterns and data services. The advanced tutorial will be shared between AS3 and Flex and would assume basic knowledge of Flex.

Well, this may remain underdeveloped till I reach that stage myself. Give me a few months. I challenge you to make more rapid progress than I will and actively contribute to the writing of that section!

Go to Advanced.

Resources

Related pages

Credits

This tutorial was for a good part written at a time where Marielle Lange (widged) was visiting fellow at the School of Mathematical and Computer Sciences, Heriot-Watt University (Edinburgh, UK). I am most thankful for the office space and collegial environment offered during my 3 months there.

Retrieved from "https://edutechwiki.unige.ch/mediawiki/index.php?title=ActionScript_3_tutorials&oldid=59576"