[TIMOB-23276] Windows: Unable to change titleColor/activeColor of Ti.UI.Tab

GitHub Issue	n/a
Type	Improvement
Priority	Medium
Status	Closed
Resolution	Fixed
Resolution Date	2016-06-27T18:55:05.000+0000
Affected Version/s	n/a
Fix Version/s	Release 5.4.0
Components	Windows
Labels	Windows, Windows-Phone, qe-5.4.0
Reporter	Niels Kok
Assignee	Christopher Williams
Created	2016-04-08T09:22:08.000+0000
Updated	2016-06-28T17:22:34.000+0000

Description

I believe it's not possible to change te color of the Tab title. Can't find anything in the documentation. I have tried things that work for Android and iOS, but that didn't work for Windows. index.xml

<Alloy>
    <TabGroup>
        <Tab id="tab1" title="Tab 1">
            <Window id="win1" title="Tab 1">
               <Label id="label1" color="#000">I am Window 1</Label>
            </Window>
        </Tab>
        <Tab id="tab2" title="Tab 2">
            <Window id="win2" title="Tab 2">
                <Label id="label2" color="#000">I am Window 2</Label>
            </Window>
        </Tab>
    </TabGroup>
</Alloy>

index.tss

'TabGroup': {
	backgroundColor: '#E6E6E6'
}
'TabGroup[platform=ios]': {
	tintColor: 'red'
}

Attachments

File	Date	Size
Windows-screenshot.png	2016-04-08T09:17:47.000+0000	8743

Comments

Nazmus Salahin 2016-04-10

Hello [~NLKok], Thanks for sharing your experience with us. I believe you are trying to change the color of the tab title in Windows Phone. But the code you gave does not seem to do that. It will be helpful for us if you share the technique you used that worked for Android and iOS but not Windows. Thanks
Niels Kok 2016-04-19

Hi Nazmus, That's correct. My code doesn't change the Tab title color on Windows Phone. I believe that isn't possible at the moment and that's why I created this ticket. On iOS and Android it seems to work a little different. TintColor worked for me on iOS and on Android I created a theme for the action bar. I hope this helps you fix it for Windows. Niels
Nazmus Salahin 2016-04-20

Hello, On android I am able to change tab title color using theme. For the given code with default theme on Android I got the following output. [Screenshot1| http://s31.postimg.org/ucu4yw9uj/Android_Default.png] Then I add theme for Android action bar in tiapp.xml. <android xmlns:android="http://schemas.android.com/apk/res/android"> <manifest> <application android:theme="@style/Theme.Actionbarstylename"/> </manifest> </android> The theme is defined in "res/values" folder in a XML file. <?xml version="1.0" encoding="utf-8"?> <resources xmlns:android="http://schemas.android.com/apk/res/android"> <style name="Theme.Actionbarstylename" parent="Theme.AppCompat.Light"/> </resources> After defining the theme for the same code I got the following output. [Screenshot2| http://s31.postimg.org/bwraij26z/Android_Themed.png] It is apparant that changing tab title color is possible using theme on Android. *Environment*: *Device info:* Nexus7 (android 6.0.1) *Node.js Version:* 0.12.7 *npm Version:* 2.11.3 *Titanium SDKs:* 5.2.2.GA and 5.2.1.GA *Java Development Kit Version:* 1.8.0_73 *Titanium CLI Version:* 5.0.5 *Appcelerator CLI Version:* 5.2.2 *Appcelerator Studio:* 4.5.0
Christopher Williams 2016-05-04

It'd be useful to know exactly which properties we need to deal with here. The most relevant ones appear to be: - Ti.UI.TabGroup.tabsTintColor - http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.TabGroup-property-tabsTintColor - Ti.UI.Tab.activeTitleColor - http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Tab-property-activeTitleColor - Ti.UI.Tab.titleColor - http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Tab-property-titleColor

Kota Iguchi 2016-06-20

Test case:

   var tab = Titanium.UI.createTab({
       title: 'Tab 2',
       window: win,
       activeColor:'orange',
       titleColor: 'blue'
   });

Josh Longton 2016-06-27

*Reopening* The property activeColor should be named activeTitleColor to have parity with iOS http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Tab-property-activeTitleColor
Christopher Williams 2016-06-27

Pushed fix to rename activeColor to activeTitleColor on Ti.UI.Tab.
Josh Longton 2016-06-28

Verified as fixed. Tested on: Microsoft Lumia 640 (8.1) Windows Simulator (8.1) Microsoft Lumia 640 (10) Windows Simulator (10) Windows 10 Pro Studio: 4.7.0.201606150733 Ti SDK: 5.4.0.v20160627224205 Appc NPM: 4.2.7-2 App CLI: 5.4.0-20 Node v4.4.4 *Closing Ticket.*

JSON Source