HaxeFlixel step by step installation guide

HaxeFlixel is a 2D game engine designed to work with the Haxe programming language. HaxeFlixel is therefore a robust platform that allows for singular code to be natively compiled in a variety of different programming languages. In this post you will learn how to install HaxeFlixel in your computer and how to start making games with it on the Visual Studio Code development environment.

Games developed with HaxeFlixel can be compiled to work on iOS, Android, HTML 5, Flash and more. Haxe has been used to make award winning and commercially successful games like Northgard, Papers, Please, and the popular indie-game Friday Night Funking. This guide with pictures will cover the installation process of the HaxeFlixel game engine using VS Code.

Install Haxe

The installation of HaxeFlixel begins with the installation of Haxe, the base programming language. Haxe is open-source and available for free to use by anyone. You should be able to find the latest version online by going to the Haxe website: https://haxe.org/download/. For this guide we will be using a Windows-64 bit installation, but you should download the package appropriate to your Operating System. Run the installer and follow the prompts until the installation of Haxe is complete.

The installation of Haxe is the first step in installing HaxeFlixel — Fig. 1. Installation wizard of Haxe on a Windows computer.

Once the installation is complete you may need to restart your computer before proceeding.

Install HaxeFlixel

The installation of HaxeFlixel is done through an elevated command prompt. Use the sear tool in Windows to fund cmd.exe and run it as an administrator. You should get a command window like the one shown next.

Cmd window during the installation of HaxeFlixel — Fig. 2. Command window ready for command input.

The first command that you need to run is

haxelib install lime

Type the command into the command window and then press enter. The command window will take a while to start your command and then you will see progress until it is successful. Now you have to install Open FL, type the following command into your command window.

haxelib install openfl

Again the system will run the command and install Open FL in your computer. You should see something close to the following progress bar.

Installing Open FL during the installation of HaxeFlixel — Fig. 3. Command window during the installation of Open FL.

You should now install Flixel using the following command:

haxelib install flixel

We should now install additional libraries and examples using the following command:

haxelib run lime setup flixel

The Command window will take a while to download and install the additional packages. Once it is done, setup lime using this command:

haxelib run lime setup

We are not done with the Command window yet so don’t close it, but before proceeding make sure lime is installed by typing lime as a command.

Lime successfully installed during the installation of HaxeFlixel — Fig. 4. A successful installation of lime.

Testing Lime in Visual Studio Code

We are now going to test that lime is working properly by running some examples in Visual Studio Code, open the IDE. Create a new project, give it any name you want and then open a command terminal. To open a new terminal you can click on the menu “Terminal” on the top of the IDE and then select “New Terminal”.

Creating a new terminal in Visual Studio Code — Fig. 5. Navigating the Terminal menu to open a new terminal.

Most likely, Visual Studio Code will open a PowerShell terminal instead of a Command Prompt, make sure you change the terminal by selecting the arrow next to the plus sign on the terminal window and selecting Command Prompt from the dropdown menu.

Switching a terminal to Command Prompt in Visual Studio Code — Fig. 6. Switching to a Command Prompt terminal with Visual Studio Code.

Now that you have a Command Prompt you can input the command to create one of lime’s included examples. We will use the SimpleImage example in this tutorial. Input the following command:

lime create SimpleImage

This will have created a new folder in your system with the name “SimpleImage”, it is filled with the example files. Go into this folder with the following command:

cd SimpleImage

Now that you are inside the folder you can test lime’s compilation into different languages. Let us test html5. In order to test html5 we just need to run this command:

lime test html5

After a little while, the program will compile and a new window in your web browser will open with the following image:

Simple Image example testing the installation of Lime — Fig. 7. Test of SimpleImage in HTML5, opens in a new web browser window.

Here are some other tests that you can do. Please notice that flash is no longer supported by current web browsers.

lime test html5 -Dcanvas
lime test html5 -Ddom
lime test neko
lime test neko -Dcairo
lime test flash

Configuring lime for different platforms

We are done with VS code for the time being. Go back to your elevated Command Window. We will now setup lime to work with some additional platforms. First we will set it up to work with MS Windows. Input the following command:

lime setup windows

If you are already in Windows, the Command Prompt will relay a message explaining that you only need a Visual Studio C++ Compiler, you got one when you installed Visual Studio Code, so you should be fine. You can now configure lime for Mac and Linux using the following two commands:

lime setup linux
lime setup mac

You can also configure Android and iOS compilers by running the following two commands:

lime setup android
lime setup ios

Please notice that iOS is only supported on macOS. This tutorial is for Windows computers so the configuration of lime for iOS will not be covered here. You can read about it in this page: lime.software – Setup iOS.

lime setup for Android

In order to setup android you need the appropriate Android development tools. You can get these tools by downloading and installing Android Studio from this webpage: https://developer.android.com/studio. You may also need to download a Java JDK, there is one included with the Android Studio installation. The lime setup will prompt you for the path to your Android SDK, you can get that patt during the installation process, right before you commit to install.

Android Studio Setup during the installation of HaxeFlixel — Fig. 8. Verify settings window, you can get the paths to both the Java JDK and the Android SDK from this window.

Something else that you are going to need is an up-to-date installation of the Android NDK. You can install the NDK from within Android Studio. In order to do that open a new project and go to the Tools menu, and click on the SDK Manager option.

SDK Manager option — Fig. 9. Opening the SDK Manager to install the NDK.

There, navigate to SDK Tools and check “NDK (Side by side)” option and click Apply. A new window will pop-up the software will be downloaded and installed. Make sure that you also install “Android 4.4 (Kitkat)” from the SDK Platforms tab.

Preparing to install the NDK — Fig. 10. Installing the NDK using Android Studio.

Once the installation is complete the SDK folder will contain a new folder named “NDK”, inside you will find a numbered folder. The numbered folder is the NDK folder that you must supply to lime setup.

Installing and updating HaxeFlixel tools

Now that lime is installed and configured you can add some new tools to your installation of HaxeFlixel with the following commands:

haxelib install flixel-tools
haxelib run flixel-tools setup

When asked to set the flixel command alias make sure to input yes.

You should keep HaxeFlixel up to date. You can run this command to update it:

haxelib update flixel

And that is it. Your installation of HaxeFlixel is complete.

HaxeFlixel’s “Hello World” example

We will run a very simple example following HaxeFlixel’s very own “Hello World” tutorial, which can be found here. Create a new folder and open it in Visual Studio Code, you may name it however you like, try “Projects”. Now open a Command Prompt terminal and input the following command:

flixel tpl -n "HelloWorld"

This command will create a new folder named “HelloWorld” populated with all the base files that HaxeFlixel needs to run. Visual Studio Code will also open a new window with this folder at its base. It is now good moment to create a git repository and push it to GitHub, if you are so inclined.

Open the file “PlayState.hx” that is inside the source folder. And paste the following lines right below “super.create()”

var text = new flixel.text.FlxText(0, 0, 0, “Hello World”, 64);

text.screenCenter();

add(text);

Text like this is known as FlxText. In order to run the code you must run lime from within the folder that contains the file named “Project.XML” which details all the dependencies of your project. Make sure to save your files before proceeding.

Hello World FlxText for HaxeFlixel — Fig. 11. Playstate.hx has been modified to include the FlxText for Hello World.

Open a new terminal inside the HelloWorld folder and test it targeting different platforms. Try HTML5 first, use the command: lime test html5

Hello World with Haxe Flixel on HTML5 — Fig. 12. Hello World rendered in HTML5 from HaxeFlixel.

Now, let us try neko. Press Ctrl+C to cancel the currently running command and then use this command: lime test neko. A new window should pop-up with the program running. Notice that there is sound.

HaxeFlixel-HelloWorld-neko — Fig. 13. Hello World with HaxeFlixel now targeting neko.

You may try other platforms, but please notice that Flash has been discontinued and unless you have a Flash Player configured to run .swf files automatically lime will just stop the execution of that test.

This concludes the tutorial.

De Levante