Hiding the Android ActionBar

31 Flares 31 Flares ×

With the introduction of the AppCompat library in SDK 3.3.0, the Android ActionBar is displayed by default. However, there are times when your app’s user interface calls for no ActionBar at all. In this blog post I’ll show you three different ways of hiding the ActionBar.

Method 1 : Hiding and Showing at will

The Titanium ActionBar object contains hide() and show() methods which allow you to control the ActionBar at will.

To hide:


To show again:


These methods are useful for apps like news readers, where you’d like to give your user the option of maximizing the screen space upon clicking a button. One disadvantage of using this method is that it includes a smooth transition/animation while hiding and showing, so if you wish to open up your app with no ActionBar, you’ll still see the ActionBar hiding.

Method 2 : Changing the App Theme

As you saw in my previous blog post, you can manipulate the overall settings of your app using Android’s build-in theming system. This method will change your app so there will be no ActionBar at all. Your app will be completely full screen and you’ll have to build all your window titles and screen navigation by code.

Define the settings for your custom theme, for example, your theme at /platform/android/res/values/customtheme.xml could be:

< ?xml version="1.0" encoding="utf-8"?>


Then, activate this theme on your tiapp.xml:


Method 3 : Specifying the theme to be used by each window

This method is only available with SDK 3.3.1 and up. At the time of this writing 3.3.1 is not yet available as GA, so in order to compile this project you’ll have to download 3.3.1 and manually install it.

To use this method, create as many Android themes as needed, for example one theme called NoActionBar and one called YesActionBar:

< ?xml version="1.0" encoding="utf-8"?>


Define the the global app theme on your tiapp.xml just like before to set your app to launch without ActionBar. Now, if you want to open a Window that does have an ActionBar you can specify the new Window to use the YesActionBar theme:

var w=Ti.UI.createWindow({
        backgroundColor: "red",
        theme: "Theme.YesActionBar" // this is only available starting on 3.3.1

// since we're using the ActionBar in this Window
// then we need to add the close function to the
// "up caret"
    var actionBar=evt.source.activity.actionBar;
    if (actionBar){


I’ve created Github repos for each of these methods so you can try it for yourself. Just remember that method 3 uses SDK version 3.3.1.v20140724072512, so you’ll have to download and install the SDK by hand.

31 Flares Twitter 15 Facebook 1 Google+ 15 LinkedIn 0 Email -- 31 Flares ×


  1. All 3 ways working fine. Thanks.

  2. Frank Winston

    How can this be achieved on alloy? Since upgrading to Titanium 3.3, I have been unable to figure out how to correctly add and modify a theme to hid the action bar. I can hide it manually via javascript, but it when opening a new window it will still display for a split second before it vanishes, and I would like to prevent that from ever happening.

    • Ricardo Alcocer


      All three examples are using Alloy. The behavior you mention is the expected behavior of “method 1”. If you don’t want the “hiding animation” you’ll have to use Android’s built-in theme system explained in “method 2”. Feel free to clone the repo and test it out yourself.

    • Andy Greenstreet

      I logged this on jira sometime ago:


      I personally think the move to appcompat in the waning days of Android pre 4.0 was a questionable decision.

      I’ve tried all kinds of things. The use of the theme property when creating a window (ala 3.3.1) seems to work the best, but in my testing this does not work on the 1st window you open. Again, I really question the move to this as Android pre 4.0 is fading.

      • Raymond Verbruggen

        Confronting all users migrating from earlier versions of Ti with a suddenly appearing ActionBar is totally unacceptable.

        For backward compatibility showing the ActionBar must be off!

        Actionbar.hide() is not a professional solution. Adding a theme does not work for my, and yes, I followed all the guidelines strictly! Even using the Tiapp.xml from a newly generated project having a theme without ActionBar does not help.

        • Ricardo Alcocer

          @Raymond, does the code on the Github repo works for you?

          • Raymond Verbruggen

            I found what caused the problem.
            My app is multi platform eg. iOS and Android (that’s why I use Ti). My windows are all similar in design. When I goto the next window I open it having opacity=0, the “onOpen” event animates the opacity from 0 to 1 in 250ms. This results in a smooth fading-in of the new window over the old one; a common behaviour both in iOS and Android.

            The effect what I notice now is a kind of zoom-in effect.

            I do not want themes, I will take care of that myself.

            the appcelerator guys should pay much more attention to the basic grounds of Titanium and that is creating multi platform applications!!

            How can I get rid of Android themes? I want my clean app back!!

          • Ricardo Alcocer

            I don’t think you can get rid of Android themes as they are an essential building block of native Android development. You could however set the theme to No ActionBar (2nd example in the blog post), which will give you a full screen app right from the beginning, to which you’ll then have to add all navigation controls by code.

        • Daniel

          also we have the same problem. Use the ActionBar enabled by default without an easy way to remove it is not professional. In createTabGroup there is no way to permanently remove this toolbar.

  3. Ben Hull


    Thanks so much for this info. Was going round in circles trying the old method.

    This works for the main app window, however, I have a second Window which opens as modal: true and this displays the action bar again. I used the custom theme method.


    • Ricardo Alcocer

      Hi, I suggest you download the latest 3.4 CI Build from http://bit.ly/1r91u5r and try the third method, the window-level theme. It should work.

      • Hi!
        I’m having problems removing the ActionBar on a modal Window.

        I’m really not happy at all with downloading 3.4 which is an SDK still in development, since my app is already live.

        I’ve tried all 3 steps with no success on removing the ActionBar on a Window with modal=true

        • Rodrigo

          Add this at the end of the window declaration:
          if (Ti.Platform.osname === ‘android’) {


          return self;

          • aqeel hashem


            i used this code :
            if (Ti.Platform.osname === “android”) {


            and finally it works 🙂

  4. Gregg

    Any hint on where this /platform folder is? I can’t find it anywhere. If I have to create it, where does it go?

  5. christoffer
    • Ricardo Alcocer

      The ActionJackson example is for using the ActionBar, so hiding it defeats the purpose.

  6. Fred


    I am struggling with an app that was build with an old titanium sdk. I updated to the new 3.4, and have this actionBar problem, which is always visible. I tried to follow your method 2 (as this seems to be for me the best and easiest), but somehow, when I put in my tiapp.xml the corresponding theme :
    In the Androidmanifest I find in the build folder my theme is never there, it will always put android:theme=”@style/Theme.AppCompat” on the application element, and android:theme=”@style/Theme.Titanium” on the activity element. I would really appreciate some help here, I am new to Titanium and had to take over this project, I hope you can help me out! 🙂 Thank you in advance. Cheers

  7. Rana El-Shenaity

    Hello, i am not using alloy, when i run the app on ios the action bar doesnt appear but when i rin it on android device it appears, i tried to use win.addEventListener(‘open’, function(){

    it did what i want but it opens the window first then hides the action bar so there is a lag so any solutions ??

    • Ricardo Alcocer

      @Rana, that’s exactly what I explained above about that method. Please clone all repos and select the method that works best for your app.

  8. Paul

    Where I am suppose to find /platform/android/res/values/ on my mac? Whats the full path to that directory? Thanks

    • Ricardo Alcocer

      @Paul, this folder lives in the root of your app, at the level of your tiapp.xml. Learn more about it here: http://docs.appcelerator.com/titanium/3.0/#!/guide/Android_Themes

      • Paul

        Thanks! I am coming from a legacy app, so I guess I have to create it.

        • Paul

          There is a minor error in the code of method 2. There is a space in the first line between the “<" and the "?". That will cause a compiler error with invalid token message. Thanks again for your post!

  9. Greg

    I realize that I am kind of late on this, but I cannot get this to work for the life of me. I was able to do method 1 fine but I would prefer to use method 2 and it is giving my trouble. I am using Classic (No Alloy) and I was wondering if that had anything to do with it. The problem I get is when I add the path: /platform/android/res/values and I put in the custom_theme.xml the app will fail to package therefore not being able to install on my android device. Any suggestions? Feel free to point out if I am making a dumb mistake (I probably did).

    • Ricardo Alcocer

      Could you share a Gist or Github repo with your project?

  10. Rorellanam


    I am using version 3.4.1 and I am using method 3, and hide the actionBar, however when I try to show in other activity the content of my windows gets over the actionBar so I have to press the Esc key in order to see the actionBar, any thoughts?

    • Ricardo Alcocer

      Could you share a Gist or Github repo with an example that replicates this issue?

  11. Nikita

    FYI, action bar is still visible when using method 2 on modal windows, windows with opacity 0 or windows defined in controllers. Workaround for this seems to be defining theme:”NoActionBar” for the window that still shows action bar.

  12. Nadeem

    Hi Ricardo,
    I have seen these solutions and I have applied them previously they all work fine.
    Since I am working on Appcelerator Studio, When I apply them it gives me error [ERROR] : Failed to package application: (can’t post full console but this is a common error and you will understand.)
    Now after spending some time and seen the solutions of different people the only solution to this is not using the APIS above 20 meaning can’t use features of 21 , 22 and so on; This is very unacceptable. Can you please guide me on this ?


    • Nadeem

      I mean when I apply THEME (not them). I get the error mentioned in my comment. And with activity hiding actionbar is not very professional looking so I wanna avoid that.

Comments are closed.

Sign up for our blog!

computer and tablet showing Appcelerator software
Start free, grow from there.
31 Flares Twitter 15 Facebook 1 Google+ 15 LinkedIn 0 Email -- 31 Flares ×