[Guide] How to use FlashDevelop with Stencyl

How to use FlashDevelop to code for Stencyl

This post will show you what are the steps needed to use FlashDevelop to code your behaviors.
We will NOT simply use FlashDevelop to edit the behavior files, we will have all the advantages of using a proper IDE, and that means proper code completion and hints (Intellisense), code generation, debugging, compiling, and of course syntax highlighting.

What we assume

• This guide assumes FlashDevelop and haxe are not installed.
• This guide assumes the use of a Windows based OS
• This guide assumes that the user can change the system path without problems
• This guide assumes that a new blank game will be used to test things
• This guide assumes the user will use the correct paths if he uses this guide
• This guide assumes that the user can find the games-generated folder
• This guide assumes that if any of the above will fail, then the user will not read any further

What do we need to do ?
First install FlashDevelop, but do NOT install any package when you're presented with a window to install additional content.

When the installation completes close FlashDevelop, because we need to add 2 locations to the system path:
D:\Program Files (x86)\Stencyl\plaf\neko-win\ and D:\Program Files (x86)\Stencyl\plaf\haxe\
Replace with the correct path for your system

Create a new game (I named mine design), with a scene and a code mode scene behavior (make sure the behavior is attached to the scene) and TEST THAT GAME inside Stencyl. Testing the  game will create the necessary directory structure in the games-generated folder, and so there is no need to actually add something in the behavior created above. Do remember the name of the game as it will be needed in the next step.

Setup FlashDevelop

Open FlashDevelop and create a new Project. In the New Project window you must pick an Empty haxe Project, and for the name you must type the name of the game you created in Stencyl. The Location MUST point at the games-generated folder.


After you press ok you'll get a warning that you can ignore (something's actually wrong if you don't get that warning), and in the side view you should see the entire directory structure that Stencyl created when we tested the game.


Let's tell FlashDevelop where haxe is installed

In Flashdevelop go to Project -> SDK -> Manage
In the window that pops up open InstalledSDK[] Array and you should get the following window where you must add the path to the haxe folder:

The Name and Version do not matter so use whatever you want for those.

I restarted FlashDevelop after this step.

 Back to FlashDevelop

Let's continue to setup FlashDevelop to make it recognize all the classes available in Stencyl, so let's go back to the Project Properties:
 - In the Output tab select Lime as the Platform and project.xml in the Output field:

Don't worry about the Dimensions, color and framerate. They will get set automatically

 - In the Classpath tab click on Edit Global Classpaths... and from there click on Add Classpath. Locate the following folder and add it in the path:


At this point I restarted Flashdevelop again and now we can compile the game from within Flashdevelop:

 but...


 Almost there

We're currently working in the games-generated folder, so any file that we edit now (located in Source -> scripts)will be deleted the next time we test the game from within Stencyl.

To fix that, we will copy all the files from the scripts folder back into the games folder. To do that we must create a text file   that will be placed in the C:\ drive. So create a text file, name it exclude.txt and paste the following inside it:

Code: [Select]

Design
SceneEvents_0
MyAssets
MyScripts
StencylPreloader

And for the last time (for this project) we need to go back into the Project Properties into the Build tab and add the following into the Post-Build Command Line:

Code: [Select]

c:\windows\system32\cmd.exe /C copy "$(ProjectDir)\Source\scripts\Design*.hx" "$(ProjectDir)\..\..\games\$(ProjectName)\snippets\"
c:\windows\system32\cmd.exe /C xcopy "$(ProjectDir)\Source\scripts\*.hx" "$(ProjectDir)\..\..\games\$(ProjectName)\code\" /Y /exclude:c:\exclude.txt



From now on you can add code and compile the game without the need to have Stencyl opened.

 The Problems:

 - You must follow this tutorial for every game you want to work on.
 - The change to any design mode behavior will not be permanent or it will not work. Only work on code mode behaviors.
 - Any new class that you wish to attach to a scene or actor must be created in Stencyl and the game must be tested in Stencyl first.
 - After the creation of a new Scene you must test the game in Stencyl.
 Contributors:

This was possible thanks to the following contributors :
 - Hectate
 - Justin
 - MdotEdot

A few notes of my own:

FlashDevelop works fine enough being set as an external text editor directly from Stencyl. This tutorial, on the other hand, allows you to compile from within FlashDevelop and (perhaps more importantly) see code completion prompts when coding.

It's probably best to only have open either Stencyl or FlashDevelop but not both at the same time, to prevent conflicts over file access.

Breakpoints in FlashDevelop work and can be great debugging tools. SadiQ has indicated in chat that he's not been able to get them to run if they're in the main updated loop; on my side, however, they work fine in my custom classes and code. Especially nice is being able to see the values (and potentially change them) of all the variables in play at that point.

As SadiQ noted; be sure to add new things from within Stencyl so that it recognizes that they exist (it records them in XML files so it knows what to display in the dashboard). After that you can edit in FD again if desired.

Update: one 'thing' that needs to be added in Stencyl to be remembered after a Stencyl-compile; new key controls. It's possible to modify MyAssets.hx to have these included, but Stencyl will overwrite this file (because it's creating it from an XML file) and your changes will be lost.
Thankfully, if you name the controls correctly in your code (e.g. "space") and give them the same name in Stencyl, it will be immediately recognized on next compile (even from within Stencyl).

I've found a way to code Behaviors using Flash BuilderDevelop, with its completion code features, and continue to use Stencyl to compile. It's really useful if you add something like libraries to Stencyl Haxe Engine. It's not simple to produce a tutorial but I can give you some ideas to try. The basical idea is use mklink to create some 'virtual' link to reconstruct the paths of classes.

An Example:

Code: [Select]

mklink D:\haxe\FDStencylProjects\Redemption\scripts\redevogames\redevoclient\data\retreive\cardsmanagement\GetDeckPerId.hx c:\Users\David\AppData\Roaming\Stencyl\stencylworks\games\Redemption\code\GetDeckPerId.hx
Otherwise you need to import libraries Stencyl has inside. Personally I use the same mklink concept as the following example:

Code: [Select]

mkdir D:\haxe\FDStencylProjects\RedemptionFDQuattroFDTerzi\com
mklink /D D:\haxe\FDStencylProjects\Redemption\com\stencyl "C:\Stencyl\3.0\plaf\haxe\lib\stencyl\1,00\com\stencyl"
mklink /D D:\haxe\FDStencylProjects\Redemption\com\nmefermmmtools "C:\Stencyl\3.0\plaf\haxe\lib\console\1,00\com\nmefermmmtools"
Produce a single statement for any element of your library can bore yourself, but consider you must produce a single line only for new Behavior or Freeform Code you want to code using Code Mode.
With a bit of reverse engineearing you can produce a suite can fill a log file with mklink statements automatically, but mklink application must be done with Administrator privileges.

Let me know if you want to test this way and if you need support. I'm going to think about the automatical suite.
David.

Edit: My logical workflow, brought me to post my little guide to debug with Flash Develop, is:
1. Have two instances of FlashDevelop opened, one with a FD code project, other one with a FD debug project;
2. Code in FD code project;
3. Compile in Stencyl;
4. Debug in FD debug project.
In this way I can modify my code and debug it in some little steps. Otherwise sometimes I type code in wrong FD instance and some curses come out from my mouth

Unfortunately I never used FlashBuider, and since I don't know the benefits it has compared to FlashDevelop I never even looked into it.
Your setup method seems quite complex thou, especially if you need to make a link like that for every class that you want to create. That step is not required with flashdevelop (but I guess you could do the same with any editor/IDE).
Maybe try to create a tutorial for it, just in case someone already familiar with FlashBuilder wants to use that instead of FlashDevelop?

I'm really sorry I think Flash Develop (FD) and write Flash Builder. I'm working with Flash Develop. Mine it's not a simple method but I find it useful.  I'm going to understand better your tutorial in order to comprehend if it can be useful for my needs.

A question,  when you copy the modified files from generated-games folder, it's possible to copy some nested folder like image attached? One of the limit I've found in Stencyl is the lack of a hierarchical code structure. Hx files are always in the same folder and this not help to write an orderly code. This is one of my main needs.

David.

We're using the games-generated folder to allow us to code and test the game with flashdevelop, and if the build was successful we copy all the files into the games folder that stencyl uses.
Copying an entire directory structure should be achievable by changing the post build command we use (I mentioned them in the tutorial). Look at the xcopy manual for that.

What I haven't tried yet is to actually install additional libraries on top of stencyl's version of haxe, so I don't know if that part actually works. I will have to try it, but I have some extra coding to do before I get to that point.

Sadiq, thanks again for this guide.
I've some problems to setup 3.5beta version in flashdevelop cause changing of structure of haxe dir.
Have you try to use flashdevelop with this new version?

Thanks, David.

Unfortunately I don't have access to the beta version so I can't try it yet, but a different haxe structure should still work. Do you have errors or anything?

First of all, references are not presents in flashdevelop project. Then "($CompilerPath)/haxelib" return only "/haxelib".
Thanks for interest.
David.

Essentially the old structure have haxe with with std and bin in same folder. Now they are splitted in some folder as you can see in attached image.
David.

Maybe you need to add haxe to the system path?
If you open a command prompt in windows you can get the haxelib path using haxelib config. That's the path that must bee added to your system path, and the same result must show up if you try from the command prompt in FlashDevelop.
Since I don't have the beta it's hard to test and see where things fail.

If possible, I think it would be better to be able to launch FlashDevelop/HaxeDevelop without actually modifying system properties. So I'm looking over the guide with that in mind.

Okay, it's not too difficult to get it working. This is with no modification to the system path or FlashDevelop's global classpath.

First time setup:
- Install FlashDevelop/HaxeDevelop
- Run the launcher script (see below)
- Tools > Program Settings > HaxeContext > Installed Haxe SDKs > Add one pointing to {Stencyl}\plaf\haxe-bin\windows

Per-game setup:
- Create new project, choosing "Empty Project" from the "Haxe" category. Select folder from games-generated, uncheck "create directory for project"
- Project > Properties:
  Output tab:
    Platform: Lime

The launcher script. Set the three paths before running it.

Code: [Select]

set SW_PLAF=C:\Stencyl\plaf
set SW_WORKSPACE=C:\stencylworks
set FD_PATH="C:\Program Files (x86)\HaxeDevelop\HaxeDevelop64.exe"

set HAXEPATH=%SW_PLAF%\haxe-bin\windows
set HAXE_STD_PATH=%SW_PLAF%\haxe-std\std
set HAXELIB_PATH=%SW_PLAF%\haxe\lib
set NEKO_INSTPATH=%SW_PLAF%\neko-win
set HXCPP_HOME=%SW_WORKSPACE%\prefs
set HXCPP_CONFIG=%SW_WORKSPACE%\prefs\.hxcpp_config.xml
set LIME_CONFIG=%SW_WORKSPACE%\prefs\.lime_config.xml

set PATH=%HAXEPATH%;%NEKO_INSTPATH%;%PATH%

start "" %FD_PATH%

Alternatively, you could manually set your system environment as the script does, and launch FlashDevelop/HaxeDevelop normally.

Actually I've installed from scratch haxe and openfl 4.9.2 and mount it on FD. Then I'd copy all dirs from {Stencyl}/plaf/haxe/lib to {HaxeToolkit}/haxe/lib. Seems works fine.
In next install I'm going to try Justine advice.

Thanks a lot both!
David.