Mobile-specific application

Version 3.7


In this tutorial you will create a basic Flex mobile application that displays a basemap. Before doing this, you will need to make sure you have the following:

  • Adobe Flash Builder 4.5.1 (or later)
  • The updated Adobe AIR SDK overlayed on the Flex SDK. If you are uncertain of how to do this, see Adobe's document, Overlay AIR SDK on Flex SDK.

    Flex users will need to download the original AIR SDK without the new compiler. Mac users click here Windows users click here.

  • Downloaded copy of the ArcGIS API for Flex.

Create a new mobile project

The following steps illustrate what you will need to do to create a new mobile project using Flash Builder 4.5.1 or higher. In this specific tutorial, we are targeting an Android device. The steps provided below will work the same regardless of whether you choose to target an Android device or iOS.

  1. In Flash Builder, click File > New > Flex Mobile Project.
  2. Specify a project name, e.g. MyBaseMap and a project location.
  3. Specify the Flex SDK you configured to embed the Adobe AIR SDK into Flex SDK, click Next. More information on how to do this can be found here.

    If this SDK is not listed, click the Configure Flex SDKs... link and browse to the location of the newly configured SDK.

    Create new mobile project dialog

  4. Under the Mobile Settings tab, check Google Android and keep the default settings and click Next.

    Mobile Settings

  5. (Optional) click the Permissions button and you can specify which permissions are allowed on the device at runtime. For the purpose of this tutorial, keep the defaults, click Next.

    Create new mobile project

  6. Under the Server Settings tab, keep all defaults, click Next.

    Server Settings dialog

  7. Under the Build Paths tab, click Add SWC... and browse to the location of the downloaded Flex API. Keep the defaults for folder, file, and ID names.

    For the purpose of this tutorial, we are not changing the Application ID. This is not practical in a real-world deployment scenario. Here, you would want to give your Application ID a fully qualified domain name, e.g. com.mydomain.myApp.

    Mobile build paths dialog

Write code

Currently, the app does not contain anything. In this next section we will provide the code to add a simple basemap to the app.

In Flash Builder, make certain the MyBaseMapHomeView.mxml (or whatever name you called your application) tab is active and the file is visible.

Package Explorer

Inside the Editor view, add the following code and save.

<?xml version="1.0" encoding="utf-8"?>
   title="A tiled map service">

   <esri:Map id="myMap"
         <esri:Extent xmin="-19325128" ymin="-10948057" 
           xmax="-539964" ymax="18364625">
            <esri:SpatialReference wkid="102100"/>



Run the app

Now that you added the code portion to your project, you are ready to run it. Although it is always preferable to debug and test your app on an actual physical device, it is possible to test it out directly on your desktop. Flash Builder provides easy functionality that makes this possible. The steps below go over this:

  1. With the MyBaseMapHomeView.mxml (or whatever name you called it) open and active, click the Run button.
  2. In the Run Configurations dialog box, make certain that Google Android is the target platform.
  3. Do not change the AppID.
  4. Under the Launch method dropdown, select On AIR Simulator.
  5. Under the Launch Configuration dropdown, select a device. E.g. Motorola Droid, click Apply and Run.

    Run Configurations Dialog

    The result should display similar to the screen capture below.

    Resulting mobile app


If using version 3.4 or above, you may receive an error upon running, Class mx.controls:: DateField could not be found. Class com.esri.ags.skins.fieldClasses::CalendarField could not be found . If this occurs, please see Mobile applications with Flex and/or the section discussing it in the FAQs.

Additional Information

The steps provided above are given as a basic tutorial and are not all-encompassing. For further information, please refer to Adobe's document for developing mobile applications.

The ArcGIS API for Flex provides mobile samples that demonstrate some of the above functionality. If you wish to explore these samples, please see the ArcGIS API for Flex samples on GitHub.


If you are using certain mx components, you will need to include the mx.swc among the project libraries. You might also want to include sparkskins.swc. See Mobile applications with Flex for more information.


There is a known-limit when working with pop-up windows in mobile applications created with version 3.1. If doing so, please note that you will need to either: Add both mx.swc and sparkskins.swc to your project, or update PopUpRendererSkin and remove references to the RelationshipInspector.