Hide the action bar on Android on Titanium/ Alloy/ Appcelerator

Question

How do I hide the action bar on Android on Alloy/ Titanium. I have tried the following:

$.index.activity.actionBar.hide()

but it just throws the error:

 Cannot read property 'hide' of undefined

The full error message is as follows:

[ERROR] :  TiExceptionHandler: (main) [1605,1605] ----- Titanium Javascript Runtime Error -----
[ERROR] :  TiExceptionHandler: (main) [0,1605] - In /alloy/controllers/index.js:359,27
[ERROR] :  TiExceptionHandler: (main) [1,1606] - Message: Uncaught TypeError: Cannot read property 'hide' of undefined
[ERROR] :  TiExceptionHandler: (main) [0,1606] - Source:     win.activity.actionBar.hide();
[ERROR] :  V8Exception: Exception occurred at /alloy/controllers/index.js:359: Uncaught TypeError: Cannot read property 'hide' of undefined

Answer 1

There are few things that you need to look at:

Ques 1 - Do you want to hide Action Bar for all windows (means for whole app)?

Ques 2 - Do you want to hide Action Bar after a window is opened and upon performing some action (means on some click or scroll)?

Ques 3 - Do you want to hide Action Bar for few windows and show it for other windows?

---

Answer 1: - Using in-built Titanium themes

Method 1 - use this tag in tiapp.xml file:

<android xmlns:android="http://schemas.android.com/apk/res/android">
    <manifest>
        <application android:theme="@style/Theme.AppCompat.NoTitleBar"/>
    </manifest>
</android>

Method 2 - set theme property in app.tss:

"Window[platform=android]":{
    theme : 'Theme.AppCompat.NoTitleBar'
}

---

Answer 2:

This is the case where you faced that issue. Hiding action bar by code in .js file is only possible when window is opened. You will have to use window's onOpen event to run this code:

$.index.activity.actionBar.hide();

So, it must be like this:

$.index.addEventListener('open', function () {
   $.index.activity.actionBar.hide();
});

Or you can run hide() method on some button click because you will be able to click on a button when obviously that window is opened, like this:

$.someButton.addEventListener('click', function () {
   $.index.activity.actionBar.hide();
});

---

Answer 3:

By using Method 2 of Answer 1, you can apply theme in .tss or .xml file to hide action bar on respective windows and do not apply any theme on windows which will have action bar.

Read more here on Titanium Android Themes