Appcelerator Blog

The Leading Resource for All Things Mobile

New in 3.3.0 : Android AppCompat Library

19 Flares 19 Flares ×

Appcelerator’s Android support just got better with the AppCompat library. If you remember from this post and this other one, Android apps built with Titanium didn’t have the ActionBar activated by default, and your Windows looked something like this:

/wp-content/uploads/android-plain-win-Bvd9cN4yqm.png

You then had to open up your tiapp.xml and add some lines of code to activate the proper theme that will give you the ActionBar and set it to use API Level 11 (Android 3.0), and since the ActionBar was not available to versions below 3.0, you had to rework your app’s UI to accommodate to those cases. This was not a Titanium problem though, but an Android one, which was fixed by the creation of the AppCompat Library, now supported by Titanium.

What does this mean for you? Well it means that your Android apps now support the ActionBar on devices running Android 2.1 (API Level 7) and up, and this without making any special changes to your code. For example, a simple window like this,

var w=Ti.UI.createWindow({
    title: 'Plain Vanilla App',
    backgroundColor: '#fff'
});

w.open();

will give you this result.

/wp-content/uploads/actionbar_all-qO9y77lLCe.png

Your Android apps will now follow the Android’s UX guidelines, as far as the ActionBar is concerned, even on devices running old versions of Android.

Customizing and branding your Android apps

You can customize the look your ActionBar to match your app’s branding by creating custom ActionBar themes. Themes now, however, need to inherit from AppCompat and not from Holo like before. If your app was using Holo, Holo Light or Holo Light DarkActionBar, this guide shows you how to create the AppCompat equivalents.

When creating custom themes using the Android Action Bar Style Generator you simply need to make sure that you specify AppCompat compatibility as shown below.

/wp-content/uploads/abstyle-VXjrzhiEnL.png

Then download the resources like before and save them to /platform/android/res and add it to your tiapp.xml, for example:

Based on this example, your app with a custom Green ActionBar Theme will look like this:

/wp-content/uploads/abstyle_all-1ZAyvVLABK.png

Feel free to download the examples from Github and test them out yourself.

19 Flares Twitter 0 Facebook 0 Google+ 0 LinkedIn 19 Email -- 19 Flares ×

11 Comments

  1. This is really great news. Thank you TI and Android. We had to jump hoops when developing our apps.

    Thank you

    Robert

  2. Titanium is a revolution in my life, thank you all

  3. Dharmik

    It really nice to see this . Thanks to Ti and it really helps to all developer .

    Thanks,
    Dharmik

  4. William Diaz

    How I can hide the action bar after updating to 3.3.0 now is showing the bar in all my apps and I don’t use it.

    • Ricardo Alcocer

      @william, I’ll be writing about that in the next couple days.

      • William Diaz

        Thanks @Ricardo Alcocer is very important because I tried everything and still doesn’t work and my releases are stuck until a I solve that issue.

    • Ricardo Alcocer

      Here’s the blog post on how to hide the ActionBar: http://www.appcelerator.com/blog/2014/08/hiding-the-android-actionbar/

  5. When will there be support in Titanium for the creation of android extension files for apps larger than 50mb?

    Or if it’s not planned, Can there be some instructions posted about how to best make extension files from existing (over 50mb) apps?

  6. GaneshKumar

    I couldn’t able to hide the actionbar header in 3.3.0. “navBarHidden:true”, is not working.

Comments are closed.

Sign up for updates!

Become a mobile leader. Take the first step to scale mobile innovation throughout your enterprise.
Get in touch
computer and tablet showing Appcelerator software
Start free, grow from there.
19 Flares Twitter 0 Facebook 0 Google+ 0 LinkedIn 19 Email -- 19 Flares ×