I try to style a tab group's navigation bar background- and tint colors in such a way that both the 4 showing tabs as well as the the automatic More tab holding any other tabs look exactly the same. This seems impossible.

Run the following code:

Ti.UI.backgroundColor = '#0F0';

var tabGroup = Titanium.UI.createTabGroup({

    barColor: '#F00',

    // Doesn't do anything     navTintColor: '#FFF',

    // Doesn't do good         tintColor: '#FFF'

});

function createTab(nr) {

    var win = Titanium.UI.createWindow({

        backgroundColor: '#fff',

        barColor: '#f00',

        title: 'Window ' + nr,

        navTintColor: '#FFF'

    });

    var label = Titanium.UI.createLabel({

        text: 'Label ' + nr

    });

    win.add(label);

    var tab = Titanium.UI.createTab({

        icon: 'KS_nav_views.png',

        title: 'Tab ' + nr,

        window: win

    });

    return tab;

}

for (var i = 1; i <= 20; i++) {

    tabGroup.addTab(createTab(i));

}

tabGroup.open();

More-Tab extendEdges

When you're on one of the first 4 tabs you'll see the green of Ti.UI.backgroundColor shine through the tab bar, like shown in screenshot A. But on the More tab, the tab bar is grey-ish like shown in screenshot B. It looks like this window has extendEdges for bottom enabled by default and setting extendEdges to NONE on the TabGroup doesn't change this.

More-Tab barColor

The above is also true for the nav bar, which is clear red instead of translucent like on the other tabs (screenshots A and B).

More-Tab edit-dialog barColor

When you press the Edit button on the More tab, you will see that the nav bar for the modal window that pops up is grey-ish (screenshot C), instead of the red I've set on the tab group. Again, I could not find a way to change this.

More-Tab navTintColor

If you go to one of the tabs you find under the More tab, you'll see the back arrow is white (screenshot D) because I've set the navTintColor of all windows to green. Now when you return to the More tab by pressing that arrow, you'll notice the Edit button of the More tab now also changed to white (screenshot E and compare B)! You would think you can set navTintColor on the TabGroup as well, but this has no effect. On the other hand, when you set tintColor it does change the Edit button's color, but also the color of the active tab's icon, all icons in the Edit window that are currently not in the tab bar, as well as the Done button on that window (screenshot F). And since we cannot change the barColor of that Edit window, this leaves you with a lot of white-on-white.

More-Tab title

The color of the nav bar titles nicely changes to white when you set UIStatusBarStyle to UIStatusBarStyleLightContent. However, only on the More tab the title will still be black and I cannot see how to change this (screenshot G).