Well, this may be a simple case to write. But there is a chance that you may get it wrong in the first go. Thats for this kind of loop has got a slightly different syntax.
The syntax for a for-loop in haxe looks as below
for(i in min...max)
{
trace('This is inside for loop.');
}
This loops from a value of “min” to “max” and “i” is the iterator.
Thats quite simple, even simpler than for-loops in other languages!
Happy haXe-ing 
Well moving ahead with haXe and NME is as exciting as the new release of NME library. Though this is a minor release to RC4, but looking at the speed of its release cycle, it seems we are just fine learning the new options in NME, where the NME development team is doing their best to give us new features soon.
If you are like me and coding in MAC then there is definitely a point when you think how to install the new libraries into my development environment. Actually its as simple as putting the downloaded library in right folder and setting the current environment to point to the latest version.
It may be required depending upon your machine settings that you may require to configure your machine so as to show all the hidden and system files, which are generally hidden.
All the supporting libraries of haXe, remains inside haXe folder. So just navigate to
/usr/lib/haxe/lib
And there you will find all the library folders.Now go inside “nme” folder and the current version of the library will be present there. All we have to do is, download a new version of the library and put it in this folder. I have recently downloaded the 3.1RC4 and extracted it into this folder. The main folder name I kept as “3,1,RC4″, keep a note these are comma (3,1,RC4) thats how haXe reads them. So its just a practice. Now there is a file inthis folder with name “.current”(This file is generally hidden). Here the currently active version of the lib is specified. Open this file in a text editor and remove everything else (If there is anything at all there). Then type “3.1.RC4″ as the only text in the file. Just remember when we name our folder as comma separated values, haXe reads them as dot(.) while reading from the “.current” file, so we have to just follow this instruction.
That all to it. If you fire up the Terminal in MAC and type
haxelib list
then the output will show something like
nme: 3.0.1 [3.1.RC4]
The version with a square bracket is the currently active version.
So get the latest lib and activate it in development environment and have fun
We are going to write an application, which will just draw out different color circles to the HTML5 canvas. Once the number of circles reaches 1000, we are going to clean it up and start over again.
There are 2 files, the first one is the program entry point Main.hx and then there is an ApplicationStage.hx. Basically we are not going to write anything in the program entry class, rather we will keep it clean all the time. So for us, the first class to write some code is ApplicationStage.hx. Below is the code for the two files;
class Main
{
public static function main()
{
new Main();
}
public function new()
{
var as:ApplicationStage = new ApplicationStage();
Lib.current.addChild(as);
}
}
We are not doing anything on Main class, rather creating an object of ApplicationStage and adding it to the stage. So the code for ApplicationStage looks as below.
package ;
import flash.display.Graphics;
import flash.display.Sprite;
import flash.events.Event;
class ApplicationStage extends Sprite
{
private var count:Int;
private var max:Int;
public function new()
{
super();
this.init();
}
private function init():Void
{
this.count = 0;
this.max = 1000;
this.addEventListener(Event.ENTER_FRAME, onEachFrame);
}
private function onEachFrame(e:Event):Void
{
//count
this.count++;
//draw
var g:Graphics = this.graphics;
g.beginFill(Math.round(Math.random()*(256*256*256)),Math.random());//Math.random() * 256, Math.random()
//g.beginFill(0xFF0000,1);//Math.random() * 256, Math.random()
g.drawCircle(Math.random() * 600, Math.random() * 400, Math.random() * 50);
//g.drawCircle(20,40,10);
g.endFill();
//clear everything
//trace(this.count);
if (this.count>this.max)
{
g.clear();
this.count = 0;
}
}
}
If you are coming from Flash, it should look as if you are writing Actioinscript ! So no worries.
Now the last thing is to write the nmml file for NME. We save it with name compile.nmml and it looks as below.
<pre> <?xml version="1.0" encoding="utf-8"?> <project> <app title="haXe_Day_8" file="haXe_day_8" main="Main" package="com.example.saumyaray" version="1.0.0" company="saumya"></app> <window width="600" height="400" fps="30" orientation="portrait" resizable="false" ></window> <set name="BUILD_DIR" value="Export" ></set> <classpath name="src" ></classpath> <haxelib name="nme" ></haxelib> <ndll name="std" ></ndll> <ndll name="regexp" ></ndll> <ndll name="zlib" ></ndll> <ndll name="nme" haxelib="nme" ></ndll> </project> </pre>
Finally the command for compiling it to HTML5 will go as below in the commandline.
haxelib run nme test compile.nmml html5
Well, that all to it.
The source files are here for your reference.
Lets get down to coding. The first class of ours in haXe is the main class or the program entry point class. The name of the class may be anything but the point to remember here is the entry point is a static function named main. So the first class of a haXe application looks as below.
package;
class Main {
public function new(){
}
public static function main() {
trace("Hello haXe !");
new Main();
}
}
If you keep a closer look, the main class is not a display object, unlike the typical Flash application. Rather we have a general class here which is saved as “Main.hx” and this class has a method called “main()”. This is typical haXe and thats all we need to compile our program to a SWF.
We can save our compiler parameters in a file named “compile.hxml” or something similar as long as we can refer to it as a build file and having a “.hxml” extension. This file is run by the haxe compiler. In our particular case this file looks as
-swf9 bin/swf/Main.swf
-main Main
-cp src
Here we are defining the target type to be produced from the haXe compiler. Then the program entry class and next is class path.
Running this will produce a SWF named “Main.swf” in the folder “bin/swf/Main.swf”.
Quite straight forward and simplicity at its best.
Well developing in a language without a specific IDE for itself might be too much for a beginner. Fortunately we have some very cool and nice IDEs available for us.
1. FlashDevelop (Based on SciTE)
2. FDT5 (Based on Eclipse)
While both these IDEs are free, FlashDevelop is windows only. But I am surely in love with FlashDevelop. FDT is good but being on Eclipse, it takes up a lot of memory, on the other hand FDT runs on all platforms. So choose your weapons and get ready to haXe it all.
The bare bone basic of haXe language is one must need an Entry point to the Application. This could be any class, but then one must specify the entry point function, which is “main()” , the signature of function looks like
public static function main() {}
Constructors in HAXE are written as “new()” as below
class GameStage
{
public function new(){}
}
the package declaration ends with a semicolon (unlike any other major laguages, it does not contain curly braces)
package com.saumya.haxe.helloWorld;
class GameStage
{
public function new() {}
}
If you are extending an display object, then “super” must be called from the constructor. It snot optional, its mandatory.
Every line of code must end with “;” semicolon, again this is mandatory not optional.
Every class file is saved with “.hx” extension.
The haxe compiler file is saved with “.hxml” extension.
The NME compiler file is saved as “.nmml” extension.
A typical “.hxml: file looks as
-swf bin/swf/inTheBigBrain_as3_FP10.swf -main Main -swf-header 800:600:30:000000 -cp src
Similarly to compile from NME, you have to create a “.nmml” file.
A typical “.nmml” file description is here.
for compiling a .hxml file, you fire up the following command,
haxe test.hxml
Have a look at the detailed options.
To compile a nmml file, you have to fire up one of these commands. But the very basic is
haxelib run nme test my.nmml flash
The detailed options are here.
Hope that gives you the very basics of the language.
What is it all about ? Well its all about another language. Not really, if you know ECMA script like javascript or actionscript, haXe is just another home. It does not hurt to learn the simplicity of the language. That does not mean, its not capable! The capability of this language is, it compiles to a lot of platforms! Are you serious?! Yeah, you heard it right. It compiles to almost all the platforms we have now. Starting from AVM1 and AVM2 swfs to native windows, mac, linux applications.
The simplicity of a scripting language and the robustness of C, the best of both worlds! Awesome. For a quick overview of all the platforms, head over to the official page here.
Now haXe comes with a lot of libraries on top of the basic language, which makes it even interesting. And one of the such libraries is NME. After working in NME for a week, I am not kind of addicted to it. It simply allows the code to be compiled to HTML5 and iDevices like iPhone/iPad. The complete list of supported devices are listed here in the official page.
Hope that should already have been making you interested in haXe.
If you still need to see some hands on coding and examples, join me this sunday, where I am doing a workshop on haXe and NME for flash developers.
Happy haXe -ing.
Well, after a continuous month of learning and posting about javascript and canvas, I am up for a new learning. And this time its haXe with NME. Yeah, the excitement is tremendous and I can not explain in words about what I got in last few days. HAXE is truly a life saver in many occasion.
As I will go on on my study of the language and the compiling options I am planning to post it here.
So let the party begin.
After all these tutorials in pure javascript, lets see is there is any other help from any where for our javascript programming. The best thing to happen is haXe. If you have not heard about it yet, haXe is a language on its own! But why I need to learn another language?! Well, there is not much difference in javascript and haXe. As you have already seen, inside javascript also we have different libraries and we need to learn them to use them, lets look at haXe, for now, as another library (which is obviously not). Now, you will be amazed to know that after you know haXe and start writing on haXe, your code can be compiled to whole lot of different languages including C++,PHP and javascript.
First of all one need to download and install haXe. The installation is quite straight forward and the help at its own website is quite nice. I do not think you will get stuck there, but if it is, please drop me a line here or best is ask in their forum.
The hello world application for javascript I am writing here is straight out of haXe documentation. I am just putting it here for I got stuck at the compiling time and want you to get going in haXe without ever stopping anywhere.
I hope by this time, you have installed haXe on your machine. Lets write our first haxe class.
package ;
class Main
{
public static function main()
{
trace('Hello');
}
}
The purpose is to show a message we passed in “trace” function. We will write an HTML file to use the javascript file compiled from the above haXe code. Now save the above in a file with a name say “Main.hx”. Yep, “.hx” is the native HAXE extension. Suppose we are going to save the generated javascript file inside the “js” folder and with name “my.js”. Lets say that our HTML file is named as “HelloWorld.html”. So the folder structure looks as below.
src
Main.hx
bin
HelloWorld.js
js
my.js
So our “Main.hx” is on “src” folder and all our generated code is inside “bin” folder. The generated javascript is inside “js” folder, which is inside “bin” folder. You may be asking, where are the javascript and html files?! Well, we have decide the structure of our application first and now we will move on and create those files in necessary folder. First lets see the HTML file code, which is as below.
<div id="haxe:trace"></div> <script src="js/my.js"></script>
Basically we need a div element with id “haxe:trace”, so that all our “trace()” function calls in our “.hx” file will be written inside this div . We are ready for action now. All we need is to compile our haXe code to javascript.
Open command prompt (terminal in Mac) and move to the src folder, where we have stored our “.hx” file. Now write the code below in the terminal and press enter.
haxe -main Main.hx -js ../bin/js/my.js
Now go inside “bin/js/” folder and you will be amazed to see our “my.js” file is created there. Open the html file in a browser to see the result of it. The “Hello” we typed in trace is now written to the HTML page div tag. Sweet, is not it!
Suppose we want an real alert, a javascript alert, then modify the haxe code as below.
package ;
class Main
{
public static function main()
{
js.Lib.alert('Hello World');
}
}
Next process, I hope you know already . Compile it in HAXE compiler as below to generate the JS file with the modified code. This means fire up the command prompt and put the same command as we did before, which is as below.
haxe -main Main.hx -js ../bin/js/my.js
Now open the same html file in the browser again to see the alert message.
Yeehaa we got a nice javascript code generated from haXe.
Here is the source files with comments in it for you to play with.
Happy haXeing