Building A Mobile App Using Flash Builder four.5

Executive Summary

Adobe has currently launched Flash Builder 4.5. This launch permits builders to construct “Mobile Apps” for a number of mobile device platforms, further to developing internet applications and desktop programs using MXML and Actionscript three.

This launch seems squarely centered at handling the recent comments from Steve Jobs and others, and the following debate over whether or not Flash is lifeless, given the competencies of HTML five and other technological trends.

Since that is quite a first-rate launch for Adobe and a vital new functionality for us Flex builders we idea we’d go through the process of developing a smallish App and enforcing it on some of the devices. The concept of being able to increase Mobile Apps for an extensive range of mobile devices the usage of an unmarried code base is actually an attractive one.

Overall, the developer enjoys that Adobe has added with Flash Builder four.5 is pretty impressive, even though there are one or two quite essential omissions. Given the differences in Operating System, display screen length, display screen decision, and handset functionality deploying a Mobile App for a range of gadgets is a daunting task. Whilst it doesn’t resolve all problems, Flash Builder four.5 is absolutely a great start.

Target Market

Flash Builder four.Five would not goal every cell tool available on the market. It objectives cellular gadgets running Android 2.2 and upwards, iOS (iPhone 3G, iPhone four and iPad) and QNX (Blackberry Playbook Tablet). These are basically the excessive functionality modern Operating Systems for Smartphones and Tablet PCs. That covers around 50% of the prevailing cell device established the base and pretty possibly a miles better percentage of recent mobile device income. The vital omissions to the goal structures to be had are Symbian, Blackberry Smartphones and Windows Mobile 7.Mobile App

Development Environment and Experience

Overall, the usage of Flash Builder 4.5 to expand Mobile Apps is broadly just like using it to increase computer applications for Adobe Air or internet applications running on the Flash Player. The Flash Builder development surroundings are well integrated with the rest of Adobe’s services inclusive of Creative Suite 5.5 and Flash Catalyst so that you can broaden belongings in those packages and import them into Flash Builder without problems. Developers use MXML and Actionscript to increase the App, however, there may be a greater confined variety of consumer controls. Importantly there is the identical connectivity to records services the use of Web Services, AMF, HTTP and similar.

Differences to Developing an Air or Web Application

The ViewNavigatorApplication Tag

The first difference you be aware of developing Mobile Apps is that as opposed to an Application tag that is used for developing Air and internet packages, you have a ViewNavigatorApplication tag. With the Application tag you typically region a navigation manipulate after which vicinity infant additives (efficiently the distinctive views) within the navigator manage. This gives developers the capability to recognize what additives are being used irrespective of how deep they may be buried in the reporting hierarchy. With ViewNavigator however, while you navigate to a distinctive View you “pop” a different View onto the display by way of call. You can then pop other perspectives later in reaction to events and user movements. You need to move again to the house display screen via the same view order but in the opposite.

With the Application tag because you are aware of what components represent your toddler screens you may configure the application to skip any required facts from the primary utility to the child components. Since homes are commonly strongly typed, Flash Builder will give build time mistakes if you are trying to get right of entry to or skip belongings that do not exist. With Mobile Apps and the ViewNavigator tag, the compiler would not genuinely see the opposite Views which might be a part of the application till runtime as a consequence the developer loses a critical degree of blunders checking before runtime. In addition, Views best have an unmarried “Data” assets. The Data belongings can be any object, so you can bypass a collection of all the records you require but construct time mistakes checking is lost on whether properties inside the records being handed truly exist.device

No Drop Down List

There isn’t a drop-down listing in Flash Builder Mobile. No, there, in reality, is not. To me, this seems the largest oversight and I count on in Flash Builder five, or with any luck earlier than that, they’ll repair it. However, for now, the workaround is to have a button that seems like a drop-down list (has pores and skin with a drop-down listing icon) and then when the person clicks the button, to pop up a thing based totally around the “SkinnablePopUpContainer” with a listing of your objects inside it. So you can come to be with something that appears to the person like a drop-down list but is sincerely a button that calls a pop up with a listing of objects.

No MX Components Except Charts

No MX components will work besides charts. The MX namespace is not available in Mobile Apps so most of the MX components are not to be had inside the drop-down menu inside the intellisense editor. In addition, a number of the Spark additives (eg dropdown list) are “Not Mobile Optimized” which is Adobe’s way of announcing they probably may not paintings. In preferred but, there are enough controls to create the screen you want.

Styling and Sizing for Different Devices

When developing a Mobile App there are numerous issues that make styling for a number of devices though. In no specific order they may be:

Different display sizes;

Different display screen density. This is measured in dpi. Since an iPhone four has double the dpi of the iPad, any button of the identical pixel measurements will be 1/2 the dimensions in the iPhone four;

Different device unique gestures and built-in features For instance inside the iPhone email purchaser a swipe gesture outcomes in a delete button stoning up, and some devices have a lower back button constantly available as part of the gadget.
From the look of it then, being able to provide you with something in an effort to appear desirable on each display looks as if project impossible. However, Flash Builder comes with built-in capabilities that help appreciably. Firstly, you can say what display screen density you’re focused on after which whilst the App hundreds if the device getting used has a distinct display density, the App will cut back and amplify buttons and other components as required. Flash Builder categorizes each tool as having certainly one of 3 display screen densities, either 160, 240 or 320 dpi.

Bitmap pix, however, cut back and grow very poorly so the above technique is not appropriate. To manage this, Adobe has supplied the “MultiDpiBitmapSource”. This is where if you are using a bitmap as the icon for a button, you may offer 3 unique variations of the same bitmap to the button, every sized to goal display screen density 160, 240 or 320. Flash Builder will then detect what the tool is and use the correct bitmap as the icon.

Finally, you may also offer exceptional settings for your css document that permit you to exchange settings for exceptional display densities, and also special Operating System.

The end result is that you can code as soon as after which and then after spending some effort making sure it looks as excellent as feasible in numerous situations, it will appear quite right in most gadgets. If you are concentrated on the overall spectrum of gadgets you’ll need to have some type of alternate-off of time spent on styling v the payback for each device. Some research into the target audience size for each device and then prioritization will allow you to make appropriate decisions on what the main tool has to be after which how much time should be spent styling for the opposite devices.Flash Builder

Testing the App in Flash Builder

Flash Builder comes with a very good technique of being capable of seeing what your display will look like on different devices. Firstly at layout time you may select from a drop-down listing of gadgets and spot the effects. Then via deciding on special run configurations with the aid of Operating System and device, you could run the application and notice the consequences of each tool.

Other than styling issues there failed to appear to be any variations in how the App behaved on each device in phrases of runtime mistakes.

Testing Your App on A Device

Once you have advanced and styled your App using Flash Builder you’ll likely want to check it at the actual machines themselves prior to deploying it to the marketplace region. The simulator within Flash Builder gives an inexpensive approximation of ways the App will look on each tool however it’s not the same as using it as the real tool.

There are a massively wide variety of smart telephones available so in preference to buying each character tool and trying out it on each, you’ll possibly decide on to test on one of each of the three working systems which are Android, iOS (iPhone and iPad) and QNX (Blackberry Tablet). With Android gadgets, the procedure is quite easy. Essentially you create a dummy certificates using Flash Builder and then you could join and download your App to your tool.

Apple devices are notably more tough to test on. You have to follow to Apple to get a developer license which presents you with a developer key, then get a key to your device and use the two keys to installation it to iTunes and then use iTunes to put in it for your device.

The Blackberry Playbook continues to be quite new and has now not had demonstrably rave opinions so the wide variety of your users on the way to honestly installation your App on a Blackberry Playbook might be at this factor quite small. A practical alternative to buying the real gadget is to check it at the Blackberry Playbook Simulator which runs via VMWare. This offers a greater superior illustration of what the App will look and feel like as compared to the simulator in Flash Builder.

Deploying the App

Once your App is ready for deployment you have to go to the various App shops and undergo their person processes of deployment.

Summary

Adobe has regarded the challenge and possibility that mobile gadgets constitute and have devoted a considerable amount of advertising, development and promotional muscle to getting the discharge into the marketplace. For skilled Flash Builder developers, developing a working model of a Mobile App is a very similar process to what they’re used to in developing an internet or computer utility because the improvement environment could be very comparable.

Styling the App for all gadgets but can soak up numerous time and development attempt has to be prioritized in step with the devices predicted for each undertaking. However, the mission that Adobe has set themselves in being able to construct mobile Apps for a mess of devices the usage of Flash Builder is an ambitious one that they have got largely accomplished.