How to style a bottom-tabgroup on Android

[Topener]

So, it's been a very long time since I last looked into styling a bottom-style TabGroup on Android, and now I need to know how to do this.

I've got a TabGroup set up with 4 tabs, icons are in place, background-colour now takes the primary colour from my theme, but I need the tabs to have a different colour.

My relevant tss is this:

"#tg[platform=android]": {
    theme: "Theme.Titanium.NoTitleBar",
    style: Ti.UI.Android.TABS_STYLE_BOTTOM_NAVIGATION
}

But of course I'll need a theme file, which currently is this:

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="android:textColorHint">@color/colorHint</item>
    </style>
</resources>

Which properties do I need to change/add the following?

• background colour for selected/not selected tab
• colour for icon on selected/not selected state
• colour for ripple

[m1ga]

You can style that in tss now:

Tab: backgroundColor, activeTintColor, tintColor for the tabs or the selected tab/icon
TabGroup: tabsBackgroundColor, activeTitleColor, titleColor for the main background (green) and the title colors

"#tab" : {
    style: Titanium.UI.Android.TABS_STYLE_BOTTOM_NAVIGATION,
    tabsBackgroundColor: "accent",
    activeTitleColor: "#fff",
    titleColor: "#333"
}
"Tab" : {
    tintColor: "#333",
    activeTintColor: '#fff'
}
"TabGroup" : {
    navBarHidden: true,
    theme: "Theme.AppCompat.NoTitleBar"
}

"#tab1": {
    backgroundColor: 'red'
}

"#tab2": {
    backgroundColor: 'blue'
}

I think there is a ticket about the ripple color

[Matt-Ferraz]

Thanks! I was looking for it.