haXe

Search

Options

Langs

Getting started with haXe/Flash

Documentation > 始めるには > Getting started with haXe/Flash

Developing Flash applications is really easy with haXe. Let's see our first HelloWorld sample :

HelloWorld

This is a very simple example showing the most of the toolchain.

Test.hx

Create this class into a file named Test.hx

class Test {
    static function main() {
        trace("Hello World !");
    }
}

compile.hxml

Create the file compile.hxml in the same directory with the following content.

-swf test.swf
-main Test

test.swf

To compile, you can simply double-click on the compile.hxml file or run the command haxe compile.hxml. If an error occur, it will be displayed.

test.html

If everything went smoothly like it should, this will produce a file named test.swf that can be embedded into an HTML page such as this one :

<html>
<head><title>haXe Flash</title></head>
<body bgcolor="#dddddd">
<object    classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
        width="400"
    height="300"
    id="haxe"
    align="middle">
<param name="movie" value="test.swf"/>
<param name="allowScriptAccess" value="always" />
<param name="quality" value="high" />
<param name="scale" value="noscale" />
<param name="salign" value="lt" />
<param name="bgcolor" value="#ffffff"/>
<embed src="test.swf"
       bgcolor="#ffffff"
       width="400"
       height="300"
       name="haxe"
       quality="high"
       align="middle"
       allowScriptAccess="always"
       type="application/x-shockwave-flash"
       pluginspage="http://www.macromedia.com/go/getflashplayer"
/>
</object>
</body>
</html>

If you put this code into a file named test.html and open it with your webbrowser, it should display Hello World with information about file and line the trace occured.

Drawing a Square

So far we've been only using pure haXe, not Flash-specific API. The trace function is implemented by default so that it will trace on the screen. Let's see now how to draw a square on the screen. For that we need to get a drawing context, which is called a MovieClip in Flash. Modify your Test.hx file with the following content :

class Test {
    static function main() {
        var mc : flash.MovieClip = flash.Lib.current;
        mc.beginFill(0xFF0000);
        mc.moveTo(50,50);
        mc.lineTo(100,50);
        mc.lineTo(100,100);
        mc.lineTo(50,100);
        mc.endFill();
    }
}

What this code is doing is getting the current MovieClip and using the Flash drawing API to display a square. Run the compile.hxml file to compile again and open the test.html to display a red square.

Using the Library

In Flash, you store assets (graphics, sounds, fonts...) inside the Library. Resources can have an identifier called a linkage name. When you create a SWF file from a Library using the Flash IDE or other third party open source tools such as the recommended SwfMill, it will contain the resources that can be referenced from haXe using their linkage names.

For example, let's say you have a SWF named resource.swf containing a MovieClip with linkage name button. Modify your code so that it will display this resource :

class Test {
    static function main() {
         var but = flash.Lib.current.attachMovie("button","but001",0);
         but._x = 10;
         but._y = 20;
    }
}

This sample will attach a button from the library at depth 0 and with identifer but001 (there can be only one unique object per identifier and depth). It will then place the button at position (10,20) on the screen.

In order to display the button, we need to tell haXe to use our resource.swf file to look for resources. Edit the test.hxml file with the following content :

-swf test.swf
-swf-lib resource.swf
-main Test

You can now run the test.hxml file to compile the project. The test.swf created this way will include the entire content of the resource.swf as well as the haXe compiled code. You can test it by opening the test.html file.

Please note that the test.swf will also use the same parameters (width, height, background color, flash version and frames-per-second) as specified the resource.swf while without resource, it will use haXe default parameters. However most of these parameters (except the frames-per-second and flash version) can be overridden in the HTML source as you can see inside the index.html file.

Changing SWF properties

The SWF properties can be changed by using the -swf-header commandline flag. Edit your HXML and add the following :

-swf test.swf
-main Test
-swf-header 200:300:40:FF0000

That will set the SWF size to 200x300 pixels at 40 FPS with a red background color. Please note that the size and background are redefined in the HTML properties.

You can also choose to target a specific Flash Player version, by using the -swf-version commandline flag. haXe will process accordingly :

  • version 6 : will generate bytecode for Flash Player 6.0 (slower since it doesn't use registers). The flash API are not disabled with this version so be careful to only use the API classes/methods available for this player version.
  • version 7 : will generate bytecode for Flash Player 7, while disabling Flash 8 API
  • version 8 : will generate bytecode for FP8 (same as FP7) but enable Flash 8 new API
  • version 9 : will target Flash Player 9 and use the ActionScript3 API

Going Further

Now that you can do such easy things, all you need to go further is to learn the Flash API needed to implement your application. haXe is conservative about the API so you can read the Adobe Livedocs in order to get full help about it (see ActionScript reference which will references all the classes).

There is a small number of differences between haXe Flash API and ActionScript 2 Flash API, which are listed there :

  • the standard classes such as Date, Array, String can have some changes in haXe since they are common to all haXe platforms. Watch the haXe API documentations for more details.
  • the XML and XMLNode classes are merged into one single Xml class, and provides and extended API.
  • all the core Flash classes MovieClip, TextField... are in the flash package. You need then to use flash.MovieClip instead of MovieClip, or add an import flash.MovieClip; statement at the beginning of your class.
  • use flash.Lib._root instead of _root, flash.Lib._global instead of _global and flash.Lib.current to access the local root (different from _root if the haXe code SWF was loaded).

Apart from these small changes, you can easily use all existing Flash API if you know them already.

version #1320, modified 2008-05-08 02:30:38 by argenisleon
(c) 2007-2008 Motion-Twin · Powered by haXe