Monday, June 27, 2011

Flash Builder 4.5 Mobile Application for Acer Iconia A500 Tablet

This blog post will discuss making a simple mobile application using Flash Builder 4.5. I will be targeting the Acer Iconia A500 Tablet because it is currently the only mobile device that I have access to, but it should be relevant to other mobile devices too. The Acer Iconia A500 Tablet runs on Google Android 3.0 (Honeycomb). For a full review of the tablet, read this article. It sells for around $450 for the 32GB version.

Step 1 - configure the tablet

On the tablet go to Settings - Applications - Development
Check the USB Debugging option. This allows Flash Builder to debug applications straight on to the tablet through USB. Next, connect the tablet to your computer using the USB cable provided.

Step2 - create a mobile project

Inside Flash Builder, create a new Flex Mobile Project.
Give it a name like TabletApp. Click Next.

Select the desired target platform(s). For the Acer Iconia and other Andoid tablets, check the Google Android checkbox. You can choose the mobile app template to use here as well.
Important: your mobile application might need to have access to the internet, the file system, the gps, etc. Under the Permissions tab, choose the Google Android platform, and check any of the permissions that your application needs.
For my sample application I chose the INTERNET, WRITE_EXTERNAL_STORAGE, and ACCESS_FINE_LOCATION (GPS) permissions.


Click next. Set up the build path if necessary, or leave it to the default values.

Once the project is created, Flash Builder will open the two main files - TabletApp.mxml (the main application file), and TabletAppHomeView.mxml (the default home view component). Add in some components to the home view like a button or a label.

Step 3 - Run the application on the tablet

Now, to test our your application on the Acer Iconia Tablet, make sure it is connected by USB, and that you followed the step above on the tablet to enable USB debugging.

Under the Run menu, choose Debug Configurations.... Add a new Mobile Application launch configuration. Choose your project and application, and the target platform (Google Android in this case).
Under where it says "Launch method", choose the On device radio button. If you have trouble connecting, then read the Device connection help page.

If all works as planned, you should see on the tablet the simple application that you created.

Step 3b - Run the application on the desktop

If you want to test out your application without running it on the tablet, you can run it on the desktop by choosing the other radio button option - On desktop. There is a list of pre-configured devices, but the Acer Iconia tablet isn't in the list. So click Configure... and then Add to add it to the list. Here are the specs:

I've put together a simple app that shows some of the properties available to mobile applications. Click the screenshot below to see the full size.
You can download the project file here. In Flash Builder choose "File - Import...", and then choose "Flash Builder - Flash Builder Project", and select the downloaded fxp file.

18 comments:

brianrusseldavis said...

Hey there -- This is very interesting. I wondering if there are some topic we would like to see work or samples on can we suggest them? Let me know

Brian
brian@brianrusseldavis.com

Joomla Development said...

Informative blog. I like your describing style on this blog. I understand this very easily. And this is useful for me.

Android development said...

Good information. And i alway like to read the quality content. And i am really happy to found this information on your blog. Thanks for sharing this opportunity to leave a comment.

flex developer said...

Thanks.. Chris.

You have done good job. Its really nice and descriptive post. I was wondering information on the same topic. Thanks again sharing valuable information for flex developer.

Anonymous said...

Great blog. I am new to flex and this information is very helpful me to develop my flex based application.

flex developer india said...

Good post. Thank you for sharing it with us.

annaharris said...

Hi, your post is helped me all the way in finishing my project, I am also giving a reference link of your weblog in my case study. Thanks for posting such informative content.

Mobile App Builders said...

I like your blog. Everyone wants to have an app just like that! But every new technology always has such things in the beginning.Thanks!!

Sara said...
This comment has been removed by a blog administrator.
Sami Dorro said...
This comment has been removed by a blog administrator.
celine sanderson said...
This comment has been removed by a blog administrator.
John Dudley said...
This comment has been removed by a blog administrator.
John Dudley said...
This comment has been removed by the author.
Cado Magenge said...
This comment has been removed by a blog administrator.
Fernand Feukeu said...

Thanks for sharing up–to-date on this subject! I find it is very informative and very well written one! Keep up on this quality!

Amy Cooper said...
This comment has been removed by a blog administrator.
Cado Magenge said...
This comment has been removed by a blog administrator.
Webwing Technologies said...
This comment has been removed by a blog administrator.