Skinning the SpinnerList for Flex 4.6 Mobile

May 28, 2012

The SpinnerList component for Flex 4.6 mobile comes with a standard look and feel. When I incorporated this into one of our mobile views, we wanted to personalize it. I started by referencing the following post on the adobe site, Use of a SpinnerList in a mobile application.

Hilite the Currently Selected Item in SpinnerList
One of the desires was to make the currently selected item to appear to be selected. The default behavior of the spinner list is to have the selected item in the center of the component and, by default, is displayed under the selection indicator. We wanted to skin the box around the selected item a light blue to enhance the impression/appearance that it was the selected value. The initially referenced adobe article said to create a custom skin for the SpinnerListContainer.

Continue reading

Flex 4.6 Mobile Resizing TextArea Component to Fit Content – Part 2

May 25, 2012

Now that the view sets the height of the TextArea component after it has been created as discussed in Part 1, what do we need to do when the user rotates the view from portrait to landscape and back again. The TextArea component continues to reuse the number of lines of text from the previous orientation view. We need to force the component to resize itself and then recalculate the number of lines to display so we can reset the height to the appropriate value.

Continue reading

Flex 4.6 Mobile Resizing TextArea Component to Fit Content – Part 1

May 25, 2012

The TextArea component was updated in Flex 4.6 to use the native StageText(StyleableStageText skin) instead of the previous flash TextField(StyleableTextArea skin). I wanted to just use the TextArea component to display multi-line text to the user. The problem was that the height of the component was not being set to display all of the content when I integrated this component into the mobile app. The landscape view especially was cropping off the text which was to be displayed.

After a few googles, this post on stackoverflow discussed how to implement the TextArea component so that all the text would be displayed to the user.

The quick synopsis is as follows:

  1. Setup your TextArea component to use the TextAreaSkin class
  2. Add a creationComplete event on the view that will call a method to calculate the height of the component
  3. Calculate the height of the TextArea component in the creationComplete method

My TextArea component was declared thusly:
Continue reading

Android Mobile Issue – Display local html/xml pages via StageWebView

May 14, 2012

When working on the pocketnotes to go mobile app, I ran into a problem viewing local xml files via the StageWebView component on an Android device. It turns out that special handling is involved which I found out after reading Air on Android: Displaying local web pages in StageWebView.

In essence, you have to copy your read only xml/html files from the installed .apk file on your device, which is located in the application directory, to the application storage directory.

The post has a brief explanation on how to accomplish this with a few lines of code. To make it consistent across android and ios devices, I found a blog discussing Local File Access/Editing for Android and ios.

Testing for the Android OS version using Actionscript 3.0

May 9, 2012

In my previous post, I had run into a problem using XSL transforms on XML files stored on the client side of an Android device. The following will illustrate how I handled the problem using Flex and AS3.

The first thing that I did was in my project mxml file, I added a method that will be called when the app dispatches an Initialize event.

Continue reading

XSL on XML Transform Issue Occurs Client Side on Android Device

May 9, 2012

After uploading the NIM Pocketnotes On The Go app on the Google Play Market, I had a fellow co-worker try it out on their Droid X phone. I had tested the app on my husband’s Motorola Xoom tablet which I had handy and everything was working fine. When the app rendered the Pocket Notes on the Droid it looked AWFUL. All the text was jumbled and there was no text formatting being done. Uh-oh, not good.

Continue reading

Google Play Market Submission

May 8, 2012

List of Items needed to deploy your app via Console
After becoming a Google Play Developer, you can then deploy your app via the Developer Console. You need to create graphic assets/images for your app, a description of what your application does and also the app.apk file.

The list of graphic assets for your application is listed on the android developer site. A key point is even though some of the promotional assets are listed as optional, it is highly recommended that they are treated as required. I was trying to determine where each image was to be displayed to try to figure out what I should be creating for each asset. I found two sites that were of great help.

Android Market Submission Pain Part 2, provided a nice synposis of items needed during an android google play submission process.

ThisIsATest is a meta-app for Android developers to illustrate what happens with respect to the promotional assets that are included with an app when it is published.

Self Signed Certificate
I initially tried to use our AIR Based GlobalSign certificate when packaging the android app. Unfortunately, the Google Play market has a requirement that the certificate be valid until October 22, 2033. The GlobalSign certificate was only good for a year and the Google Play Developer Console balked at letting me upload the app. So I went back to Flashbuilder and generated a self signed certificate which is valid until October 22,2033. Then repackaged my Android app using this self signed certificate and the Google Play Developer Console happily accepted the app. This certificate needs to be used for all updates to the app.