Building Adobe AIR Android Apps with free opensource tools

Before we start let’s see what we need:

source code

1. Updated Adobe AIR SDK
2. Android SDKs
3. FlashDevelop
4. Optional Eclipse
5. Command line tools
6. Java JDK

1st Step – Introduction
There are two ways of installing Android SDK.
Since I started development for Android in Java, easiest way for me is to download and manage Android SDKs through Eclipse. Y ou
can download and manage SDKs as standalone but I recommend that you use Eclipse, you never know when you will want to try out
development in Java.
Install Eclipse Java or RCP following this link.
After downloading Eclipse, extract it to suitable location like C:/androeclipse

2nd Step – Android SDK
Now you should download Android SDK archive for your platform following this link. My choice was “android-sdk_r06-windows.zip” for
Windows.

After downloading – unpack it to suitable location.
I like simple paths, so I have chosen it to be inside Eclipse’s folder “C:/androeclipse/androsdk” . Inside that folder you will notice
subfolder “tools” – you need to add it to the system path variable.

Right click “MyComputer->Properties->tab:Advanced->button:EnvironmentVariables”.
Under “System Variables” box double click on “Path” and add your “tools” location, mine was “C:/androeclipse/androsdk/tools”.

3rd Step – Android Development Tools
Time to install ADT (Android Development T ools) plugin for Eclipse. Open Eclipse, go to “Help->Install new software…” and click on
the button “Add” to add new site. In Location field enter “https://dl-ssl.google.com/android/eclipse/” and for Name choose whatever you
like – my choice was “ADT T ools”. After that choose “ADT T ools” under “Work with” dropdown and mark both “Android DDMS” and
“Android Development T ools”, click Next. Agree to terms when asked, complete installation and restart Eclipse.

When you open Eclipse for second time choose “Window->Preferences”, select “Android” on the left and choose location of your
downloaded Android SDK on the right, my location was “C:/androeclipse/androsdk”. Apply, OK and you’re almost finished.
Now we should add some packages to our current SDK. Open “Window->Android SDK and AVD Manager”, new window will open.
Y ou can see that we don’t have any Virtual Devices, leave that for later and click “Available Packages” on the left. I was interested in
development for Android 2.1 and 2.2, and I also needed USB driver to be able to push to phone so I downloaded:

Android SDK T ools, revision 6
Documentation for Android SDK, API 8, revision 1
SDK Platform Android 2.2, API 8, revision 1
Samples for SDK API 8, revision 1
SDK Platform Android 2.1-update1, API 7, revision 2
Samples for SDK API 7, revision 1
Usb Driver package, revision 3
After downloading those packages you can close Eclipse.

4th Step – Download SDKs
I t’s time to download Flex SDK, new AIR SDK, AIR documentation and Android AIR installation packages. First download Flex 4 SDK
following this link. For me it was “flex_sdk_4.0.0.14159_mpl.zip” Open Source Flex SDK 98MB.

Next head to Adobe AIR website to download AIR 2 SDK for Android following this link. Click “Sign-up now to participate in the AIR for
Android prerelease program” link which should lead you to this page where you can login with existing account or create new. I f you
are creating new account it’s a lengthy process where you have to fill in some personal data/preferences. Finally you will end up on
download page where you can download software. Currently displayed downloads are not the only ones, you can find more files using
menu on the left side. These are the files I downloaded:

AIR for Android Extension for Flash CS5 Release Notes.pdf
Developing_AIR_Apps_for_Android.pdf
AIRforAndroid_FlashCS5_061710.zxp
Runtime_Device_Eclair_20100603.apk
Runtime_Device_Froyo_20100617.apk
Runtime_Emulator_Froyo_20100603.apk
Runtime_Emulator_Froyo_20100617.apk

Runtimes are for emulator and for device, Air***.zxp is extension for CS5 to enable packaging Android apps directly from CS5 Flash.

Adobe is updating those files so you might experience problems when testing if Runtimes doesn’t match in versions, that’s why I wrote
exact version numbers. Y ou will also need to download AIR SDK which is:
AIR25_win_sdk_20100617.zip

After downloading all those files it’s time to prepare SDKs. I ’ll use simple paths.
a) Create folder like D:/AIR
b) Move all our downloads to simple location like D:/AIR/downloads
c) Extract Flex SDK to D:/AIR/flexsdk
d) Extract AIR SDK to D:/AIR/airsdk
e) Create folder for merger of those two SDKs D:/AIR/flexairmerge
f) Copy D:/AIR/flexsdk to D:/AIR/flexairmerge
g) Copy D:/AIR/airsdk to D:/AIR/flexairmerge on top of Flex SDK (you can do it manually, comparing, or overwrite)

5th Step – More downloads
One more download. Download FlashDevelop following this link (see “latest release” yellow box). Install it and remember – for this
tutorial I will use D:/AIR folder as default folder for Adobe AIR Android projects.
Since we will be using command line I recommend that you download Microsoft Power T oy “Open Command Window Here”
CmdHere.exe which enables “Open Command Window Here” when you right click on a folder – follow this link. You can also download
WinKey and asign keyboard shortcuts to open batch .bat files to speed up development process although FlashDevelop also allows
executing batch files “right click + Execute” option.
FlashDevelop requires .NET2.0 to work and to use Android SDK you’ll need Java JDK (you can also go directly to Sun website).
Remember to update your flash player, go to Adobe and do that.
Enough with downloads.

6th Step – FlashDevelop advanced settings
Open FlashDevelop, press F10 or go to “T ools->Program Settings…”. Click “AS3Context” on the left side and on the right enter “Flex
SDK Location” like “D:/AIR/flexairmerge”. Remember that we have merged those two SDKs. Now you can proceed to the next step.

7th Step – First application
Start FlashDevelop so we can finally start developing our first application. Go to “Project->New Project…”. Choose “AIR AS3
Projector”, name our application “HelloWorld”, choose location “D:/AIR”, leave package empty, make sure “Create directory for
project” is checked – it will create appropriate subfolder “D:/AIR/HelloWorld”, and press “OK” button.

You will see basic AIR project structure on the right. Expand folder “src”. I f you see any files there – delete them. Right click on that
folder and choose “Add->New Class”, write Name: “HelloWorld” and click “OK”. Now right click on that file and choose “Always
Compile”. This step is important since we are compiling AS3 project. Here is “HelloWorld” example:

source code

package
{
 import flash.display.Sprite; 
 import flash.text.TextField; 
 import flash.text.TextFormat;
 
 public class HelloWorld extends Sprite
 { 
  public function HelloWorld() 
  { 
   var myTextField:TextField = new TextField(); 
   myTextField.text = "Hello, World!";
   myTextField.width = 480;
   var myFormat:TextFormat = new TextFormat();
   myFormat.color = 0xAA0000;
   myFormat.size = 60;
   myFormat.italic = true;
   myTextField.setTextFormat(myFormat);
   stage.addChild( myTextField ); 
  } 
 }
 
}

Press F5 to test movie, you should see our HelloWorld simple example. Now we should tell compiler that we are making mobile
application. Open up “application.xml”. I f you haven’t read “Developing_AIR_Apps_for_Android.pdf” you should, there is nice
introduction on this file. I ’ll leave this file for my next post/tutorial. For now – just replace everything inside with this XML:

source code

<?xml version="1.0" encoding="utf-8" standalone="no"?> 
<application xmlns="http://ns.adobe.com/air/application/2.5">
 <id>test.example.HelloWorld</id> 
 <filename>HelloWorld</filename> 
 <name>HelloWorld</name> 
 <versionNumber>1.0</versionNumber>
 <supportedProfiles>mobileDevice</supportedProfiles>
 <initialWindow>
  <content>HelloWorld.swf</content>
  <visible>true</visible>
 </initialWindow>
</application>

Save. When you press F5 you will notice that player size has changed now that it knows that we are making mobile application.
Before making AIR application and APK Android install package we have to do 3 things:
1. Generate certificate
2. Create emulator image of Android OS
3. Prepare batch files for conversion

8th Step – Generating certificate
First we need to generate self-signed certificate for our AIR application. I f you wonder why you should do that please read here (here
you will find info about the process and how to acquire commercial certificate). We can do that from within FlashDevelop. Actually
FlashDevelop has already created batch file “CreateCertificate.bat” for us. Open it for editing in FlashDevelop. Replace everything
inside with this:

source code

@echo off
 
:: Path to Flex SDK binaries
set PATH=%PATH%;D:\AIR\flexairmerge\bin
 
:: Certificate information
set NAME=SelfSigned
set PASSWORD=mypass
set CERTIFICATE=SelfSigned.pfx
 
call adt -certificate -cn %NAME% 1024-RSA %CERTIFICATE% %PASSWORD%
if errorlevel 1 goto failed
 
echo.
echo Certificate created: %CERTIFICATE%
echo With password: %PASSWORD%
echo.
goto end
 
:failed
echo.
echo Certificate creation FAILED.
echo.
 
:end
pause

Password is required when generating self-signed certificate. Couple of things are important here: first is the correct location of SDKs
where you mixed AIR and Flex SDK, your password as you should remember it and the certificate file name. Right click
“CreateCertificate.bat” inside FlashDevelop and choose “Execute”. Soon “SelfSigned.pfx” file should be created at the root of your
project. We will use this certificate to sign our application. Y ou should wait couple of seconds after creating certificate before using it in
signing process. Y ou can reuse your certificate as much as you want.

9th Step – Creating emulator image
Time to create our testing emulator image. I f everything went well, open Eclipse and go to “Window->Android SDK and AVD
Manager”. Using Eclipse is the easy way. We can also access AVD Manager from command line or by going to
“C:/androeclipse/androsdk” and double-clicking “SDK Setup.exe”. There are already nice instructions for using AVD command line
tool, all tools are located inside “tools” subfolder of Android SDK.

Now that GUI “Android SDK and AVD Manager” is open click on “Virtual Devices” on the left and then “New…” button on the right. I will
make image according to my phone which is Motorola Milestone.

Name: Moto22
Target: Android 2.2 – API Level 8
Size: 60 MB
Skin – Built-in: WVGA854

Before clicking on “Create AVD” let me explain couple of things. First – why I choose Android 2.2. I had some minor problems
installing AIR Runtime on 2.1 Emulator image, while it went perfect installing runtime on my Motorola Milestone 2.1 phone. I ’m using
this because I know it works this way, your AIR app tested on 2.2 emulator will work perfectly on 2.1 phone. For now there are only
runtimes for 2.1 Eclaire and 2.2 Froyo Android. Next is the size of virtual SD card where 60MB is more than enough for me. Since
native resolution of my Motorola Milestone is 854×480 I ’ve chosen “WVGA854″. Y ou can choose your specific set of options or create
as many emulation images as you like.

10th Step – Running emulator image
Although I prefer command line to Eclipse for running emulator images (when developing Android AIR app I keep Eclipse closed), you
can choose to run it with Eclipse. While “Android SDK and AVD Manager” is open you can select your image and press “Start…”
button. But before that you might want to scale down it’s size – why – because my image is 854×480px and because of the difference
in DPI it resizes to the full height of my screen – which is huge. That’s why I always apply scale before starting it. T o do it automatically
in Eclipse (every time you start emulator) choose “Window->Preferences”, expand “Android” on the left and choose “Launch”. Write “-
scale 0.8″ in “Default emulator options:” field. Remember to press “Apply” button.

Since I don’t like to use Eclipse for building AIR apps I will do it from command line. We can use Android tools anywhere since we
have them in system path (2nd step). Open command line. T o list all available AVD images enter:

source code

android list avds

To start our Moto22:

source code

emulator -avd Moto22 -scale 0.8

And here is example of manually creating AVD. First we can list all available targets IDs with:

source code

android list targets

And then we create AVD using this command:

source code

android create avd -c 60M -t 2 -n Moto22 -s WVGA854

What we do here is create new image with SD card 60MB = “-c 60M”, with target OS 2.2 Froyo whose ID is 2 “-t 2″, with name
“Moto22″ and with skin “-s” WVGA854 (from available: HVGA, QVGA, WQVGA400, WVGA854 ).
Y ou’ll have to wait minute or two before seeing operational Android OS emulated phone. Free up resources to have best performance
of the emulator. Leave emulator working, play with it if you like.

11th Step – Installing AIR Runtime
Remember that we have installed Froyo Android OS 2.2 on our emulator image. Now it’s time to install appropriate AIR runtime. Copy
AIR runtime “Runtime_Emulator_Froyo_20100617.apk” from D:/AIR/downloads to C:/androeclipse/androsdk/tools. Open command
line and install this runtime with handy tool:

source code

adb install Runtime_Emulator_Froyo_20100617.apk

Y ou’ll see it transferring data to the device, wait until you see “Success”. I f it fails first time, try once more – it may fail first time you try it
for no obvious reasons. Later you can check on device “MENU->Settings->Applications->Manage applications” that “Adobe AIR”
(around 17.2MB) is installed. Leave emulator on.
Note – emulator spends a lot of resources, if you leave it inactive minimized for a longer period of time it might get unresponsive. In
that case you should restart it.

12th Step – Creating AIR and APK
Back to the FlashDevelop. What we need now is to create proper batch file to finish creating our AIR and APK application and transfer
it to the emulator for testing purposes. This file is already created “PackageApplication.bat” and we have to change it. Open it for
editing and replace everything with the following:

source code

@echo off
 
:: Path to Flex SDK, ANDROID binaries and AIR binaries
set PATH=%PATH%;D:\AIR\flexsdk\bin
set PATH=%PATH%;C:\androeclipse\androsdk\tools
set PATH=%PATH%;D:\AIR\airsdk\bin
 
:: Application name
set APPNAME=HelloWorld
 
:: Signature file
set CERTIFICATE=SelfSigned.pfx
set SIGNING_OPTIONS=-storetype pkcs12 -keystore %CERTIFICATE%
if not exist %CERTIFICATE% goto certificate
 
:: Output AIR
if not exist air md air
set AIR_FILE=air/%APPNAME%.air
 
:: Output APK
if not exist apk md apk
set APK_FILE=apk/%APPNAME%.apk
 
:: Input
set APP_XML=application.xml 
set FILE_OR_DIR=-C bin .
 
echo Signing AIR setup using certificate %CERTIFICATE%.
call adt -package %SIGNING_OPTIONS% %AIR_FILE% %APP_XML% %FILE_OR_DIR%
if errorlevel 1 goto failed
 
echo.
echo AIR setup created: %AIR_FILE%
echo.
 
echo Signing APK setup using certificate %CERTIFICATE%.
call adt -package -target apk %SIGNING_OPTIONS% %APK_FILE% %APP_XML% %FILE_OR_DIR%
if errorlevel 1 goto failed
 
echo.
echo APK setup created: %APK_FILE%
echo.
 
:: APK INSTALL
echo Installing package... %APK_FILE%
call adb install %APK_FILE%
if errorlevel 1 goto failed2
 
echo.
echo Android setup installed: %APK_FILE%
echo.
goto end
 
:certificate
echo Certificate not found: %CERTIFICATE%
echo.
goto end
 
:failed
echo AIR setup creation FAILED.
echo.
 
:failed2
echo Android install FAILED.
echo.
 
:end
pause

Right click on file and “Execute” it. Y ou’ll have to enter your password twice, used when creating certificate file, once for AIR and once
for APK application. At the end it will automatically upload and install your application to running emulator.
On the first run you’ll have to accept Adobe licence and you’ll see our example running. After that you may want to try it out on your
phone. First you have to install proper runtime and then your APK package. Easy, just transfer everything to SD card and open it using
Astro file manager.
Note: you’ll have to set correct paths and application name in “PackageApplication.bat”.

13th Step – Playing with FlashDevelop and CMD
Now that we’ve run our first application it’s time to make our life a little easier by making some modifications.
For example we can make additional toolbar icons to compile our applications and start emulator from FlashDevelop. First, close
FlashDevelop. Download this image and overwrite existing at “C:/Program Files/FlashDevelop/Settings”

Now edit “T oolBar.xml” in the same folder. After last line “button label=” and before “/toolbar” add this code:

source code

 <separator />
 <button label="Run Emulator" click="RunProcess" tag="c:\windows\system32\cmd.exe;/c $(Quote)cd $(ProjectDir)&amp;&amp;RunEmulator.bat$(Quote)" image="192" />
 <button label="Create Certificate" click="RunProcess" tag="c:\windows\system32\cmd.exe;/c $(Quote)cd $(ProjectDir)&amp;&amp;CreateCertificate.bat$(Quote)" image="193" />
 <button label="Package Application" click="RunProcess" tag="c:\windows\system32\cmd.exe;/c $(Quote)cd $(ProjectDir)&amp;&amp;PackageApplication.bat$(Quote)" image="194" />
 <!-- If you want to capture output inside FlashDevelop write RunProcessCaptured instead of RunProcess -->

Note: if you want to add shortcut key to your button just add after “image” attribute shortcut=”CtrlF7″ to have Ctrl+F7 call that batch file.
Now open FlashDevelop and you’ll see 3 new icons on the toolbar. Android opens emulator, lock creates certificate and air icon
compiles AIR and APK application and install it. We already made two batch files but we are missing batch to start emulator images.
Create new batch file in root folder of HelloWorld project “RunEmulator.bat”. Open it for editing and add this code:

source code

@echo off
 
:: Set paths
set PATH=%PATH%;C:\androeclipse\androsdk\tools
 
:: List devices
call android list avds
 
:: Ask for device name
echo.
set /p Input=Enter name of the device to run: 
echo.
 
:: Run emulator
echo Starting %Input%...
call emulator -avd %Input% -scale 0.8

Restart FlashDevelop. When you press Android icon CMD will open and list AVD images. Enter the name of the one you want to start
and press ENTER. Y our development environment is now ready. Y ou can experiment with toolbar and change it’s behavior by putting
“RunProcessCaptured” instead of “RunProcess”, output will be directed to FlashDevelop Output window (it’s useful when you have
only one AVD to test application).

14th Step – More command line tools
As you might have noticed it is possible to install apps via ADB tool. T o use it with the phone you need proper driver – that’s why we
downloaded one from “Android SDK and AVD Manager”. Anyway follow this link to see instructions on installing drivers for different
phone models and basic command line options. Even better – look at this wiki for full set of commands. ADB is powerfull tool you can
use on emulator and connected phone, install and uninstall apps etc.

One more tip. Go to “C:/androeclipse/androsdk/tools” and start “ddms.bat” – it will start gui of “Dalvik Debug Monitor”, besides being
very good debugging tool – you can use it to create screenshots of your running application while the phone is connected.

14th Step – Further reading

gotoandlearn.com
Nice video tutorial on using CS5 to produce APK Android app.

help.adobe.com
Adobe Flash/AS3/AIR/Flex updated online documentation. Use links “Package and class filters:” to filter out what you need. For
example I used this configuration to learn some new features:
- Runtimes: AIR 2 and earlier
- Products: None