App Evolution

Yesterday we released WordPress for Android 2.0. The app has had a wild ride since I started it out as wpToGo over 3 years ago. Check out how it has evolved over the years:

wpToGo circa 2008, the only thing you could do in the app was create a new post!

WordPress for Android 1.0, released February 2010.

WordPress for Android 2.0, bringing sexy back to mobile blogging!

I wonder what 3.0 will look like?

10 Tips for Developing Android Apps

Over the course of developing WordPress for Android there have been a lot of speed bumps along the way of various issues.  After figuring out how to resolve them I’ve typically thought about how nice it would have been to have known that when I started out developing for Android.  If you’re an Android beginner, here’s a list of these things so you don’t have the same problems!

1. Use a Global Theme

Using a theme can save you from having to change styles for every Activity in your app.  Depending on the look and feel for your app, you should at least use the built in Light or Dark themes.  For WordPress for Android, we use the Light theme and tweak some of those styles in sub-activities if needed:

<application android:icon="@drawable/app_icon" android:theme="@android:style/Theme.Light"
 android:label="WordPress" android:name="WordPress">

2. Design Flexible Layouts

Android can run on multiple screen sizes these days. Make sure to use layout designs that stretch their content to fit the screen. Use “fill_parent” and “wrap_content” in the layout xml where appropriate to adapt the content of your application to the screen size automatically. Here’s the comment view of WordPress on different screen sizes:

Check out row.xml to see how the content is set up to expand in the comment view row.

3. runOnUiThread() is Your Friend

If you’re running threads in your application and need to display something to the user, you’ll discover that the application won’t actually display anything unless it is called from the main thread. You can use runOnUiThread() to ensure that your code is run in the UI.

4. Use Selectors as View Backgrounds, Not Images

A common mistake when coming from the web world is to set the background for buttons and lists with an image file. Since Android has multiple states for views, you should create a custom selector in xml that details what should display when the view is at different states:

xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true"
        android:drawable="@drawable/menu_button_bg" />
    <item android:state_pressed="true" android:state_selected="false"
        android:drawable="@drawable/menu_button_bg" />
    <item android:state_selected="false"
        android:drawable="@android:color/transparent" />
</selector>

5. Handling Device Rotation

If you do nothing in your activity to handle device rotation, Android will default to restarting your activity. This is especially annoying if you are running a ProgressDialog while the application is working on something. You can override onConfigurationChanged() to have your activity stay alive when the device is rotated:

@Override
public void onConfigurationChanged(Configuration newConfig) {
  //ignore orientation change
  super.onConfigurationChanged(newConfig);
}

and in your manifest xml:

<activity android:name="selectCategories" android:configChanges="orientation|keyboardHidden"></activity>

6. Test on all Compatible Android Versions

We target Android 1.6 with WordPress for Android, but it is compatible with 1.5 or higher. I typically dev and build on my G1 with 1.6 installed on it. One time I was testing on the device as well as a 2.0 emulator, but forgot to check it on a 1.5 emulator. Some of the listview layouts were displaying incorrectly on the 1.5 device even though it looked fine on all of the later versions. Whoops! Now I have 4 emulators up at once, to test each version the app can run on (currently 1.5, 1.6, 2.0 and 2.1).

7. Optimize Your ListViews for Smooth Scrolling

Wrap your ListView rows in a container class for faster loading and scrolling. StackOverflow has a good example.

8. Use DIP instead of PX

A wise man once said: “May your dips be dips, and your pixels be pixels.” To ensure that your margins and padding appears the same on different screen sizes and resolutions, make sure to use ‘dip’ instead of ‘px’ so that Android adjusts accordingly for the device:

<button id="@+id/example_button"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:textSize="20dip"
             android:text="Use Dips!"/>

9. Android is Already Fragmented

Because Android is so open, device manufacturers have run with it and changed a lot of the Android core. This can cause oddities to occur in your application. For example, take a look at how WordPress appears on the Motoblur platform:

Ahg, those black buttons! Motorola replace the default Android buttons with black ones to fit their ‘dark’ theme for motoblur. In order to correct this we are going to have to create our own buttons for the app.

10. Use the Dev Tools Application

Google created an excellent application that is installed by default in the emulators, but you can also install it on your device. My favorite tool in the app is the ‘Monitor CPU Usage’ option, which will put a few bars at the top of your device that show how much CPU your app is using in real-time! Learn more about the Dev Tools here.

There we go! Android is a great platform to develop for, and I hope this article helps you get started!