{ "id": "133880", "key": "TIMOB-17842", "fields": { "issuetype": { "id": "1", "description": "A problem which impairs or prevents the functions of the product.", "name": "Bug", "subtask": false }, "project": { "id": "10153", "key": "TIMOB", "name": "Titanium SDK/CLI", "projectCategory": { "id": "10100", "description": "Titanium and related SDKs used in application development", "name": "Client" } }, "fixVersions": [ { "id": "16723", "description": "Windows Platform Support, ListView updates, Vector overlays in maps", "name": "Release 4.1.0", "archived": false, "released": true, "releaseDate": "2015-07-08" } ], "resolution": { "id": "1", "description": "A fix for this issue is checked into the tree and tested.", "name": "Fixed" }, "resolutiondate": "2015-05-06T23:47:52.000+0000", "created": "2014-07-30T01:40:13.000+0000", "priority": { "name": "High", "id": "2" }, "labels": [ "TCSupportTriage", "tabgroup", "tabsTintColor" ], "versions": [ { "id": "15972", "description": "Release 3.4.0", "name": "Release 3.4.0", "archived": false, "released": true, "releaseDate": "2014-09-28" } ], "issuelinks": [], "assignee": { "name": "cng", "key": "cng", "displayName": "Chee Kiat Ng", "active": false, "timeZone": "America/Los_Angeles" }, "updated": "2015-06-19T23:23:56.000+0000", "status": { "description": "The issue is considered finished, the resolution is correct. Issues which are closed can be reopened.", "name": "Closed", "id": "6", "statusCategory": { "id": 3, "key": "done", "colorName": "green", "name": "Done" } }, "components": [ { "id": "10206", "name": "iOS", "description": "iOS Platform" } ], "description": "h5. Problem Description \r\ntabsTintColor is not being honored\r\n\r\nh5. Test Code\r\n{code}\r\nvar tabGroup = Ti.UI.createTabGroup( { \r\n activeTabIconTint:'#FFFFFF',\r\n tabsTintColor:'#6c8d90',\r\n tabsBackgroundColor: '#000000',\r\n //tabsBackgroundImage:'/images/tabBar@2x.png',\r\n //translucent: true,\r\n});\r\n\r\nvar tabMatches = Ti.UI.createTab({\r\n\ticon: '/images/tabBuddies@2x.png',\r\n\tactiveIcon: '/images/tabBuddies@2x.png',\r\n\ttitle: 'BUDDIES', activeIconIsMask:false, iconIsmask:false,\r\n\twindow: matchesWin\r\n});\r\nmatchesWin.containingTab = tabMatches;\r\n{code}\r\n\r\nh5. Test Result \r\ntabsTintColor is not being honored, it is always set to #929292", "attachment": [ { "id": "55217", "filename": "iOS Simulator Screen Shot 4 May 2015 3.56.52 pm.png", "author": { "name": "cng", "key": "cng", "displayName": "Chee Kiat Ng", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2015-05-04T08:17:59.000+0000", "size": 31102, "mimeType": "image/png" }, { "id": "55219", "filename": "KS_nav_ui_blue.png", "author": { "name": "cng", "key": "cng", "displayName": "Chee Kiat Ng", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2015-05-04T08:19:05.000+0000", "size": 2497, "mimeType": "image/png" }, { "id": "55218", "filename": "KS_nav_views_blue.png", "author": { "name": "cng", "key": "cng", "displayName": "Chee Kiat Ng", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2015-05-04T08:19:06.000+0000", "size": 2427, "mimeType": "image/png" }, { "id": "50128", "filename": "Screen Shot 2014-07-29 at 9.39.39 PM.png", "author": { "name": "underlabs", "key": "underlabs", "displayName": "Joseph Sachs", "active": true, "timeZone": "America/Montreal" }, "created": "2014-07-30T01:40:13.000+0000", "size": 11496, "mimeType": "image/png" } ], "flagged": false, "summary": "iOS: tabsTintColor is not being honored", "creator": { "name": "underlabs", "key": "underlabs", "displayName": "Joseph Sachs", "active": true, "timeZone": "America/Montreal" }, "subtasks": [], "reporter": { "name": "underlabs", "key": "underlabs", "displayName": "Joseph Sachs", "active": true, "timeZone": "America/Montreal" }, "environment": "Ti SDK 3.3.0\r\nMac OSX 10.8.5", "closedSprints": [ { "id": 398, "state": "closed", "name": "2015 Sprint 09 SDK", "startDate": "2015-04-25T00:00:00.000Z", "endDate": "2015-05-09T00:00:00.000Z", "completeDate": "2015-05-11T14:11:17.028Z", "originBoardId": 114 } ], "comment": { "comments": [ { "id": "317823", "author": { "name": "underlabs", "key": "underlabs", "displayName": "Joseph Sachs", "active": true, "timeZone": "America/Montreal" }, "body": "The issue has been raised by several Q&As found here:\r\n- http://developer.appcelerator.com/question/158266/tabgroup-inactive-tabcolor\r\n- http://developer.appcelerator.com/question/160613/how-can-i-change-the-default-tintcolor-of-inactive-tabs-icons-in-a-tabgroup", "updateAuthor": { "name": "underlabs", "key": "underlabs", "displayName": "Joseph Sachs", "active": true, "timeZone": "America/Montreal" }, "created": "2014-08-09T12:44:04.000+0000", "updated": "2014-08-09T12:44:04.000+0000" }, { "id": "319880", "author": { "name": "arcticblue", "key": "arcticblue", "displayName": "Mark Duncan", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Can confirm. I've spent most of the day trying to figure out how to work around this with no success. I can generate icons of the color I want to use and set the iconIsMask property to false (the documentation has a typo and refers to this property as iconIsmask which won't work), but the text remains gray no matter what tint settings are applied.", "updateAuthor": { "name": "arcticblue", "key": "arcticblue", "displayName": "Mark Duncan", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2014-08-22T08:37:32.000+0000", "updated": "2014-08-22T08:38:19.000+0000" }, { "id": "327844", "author": { "name": "topener", "key": "topener", "displayName": "Rene Pot", "active": true, "timeZone": "Europe/Berlin" }, "body": "Also confirm. Color does not change for inactive tabs", "updateAuthor": { "name": "topener", "key": "topener", "displayName": "Rene Pot", "active": true, "timeZone": "Europe/Berlin" }, "created": "2014-10-13T14:05:52.000+0000", "updated": "2014-10-13T14:05:52.000+0000" }, { "id": "327915", "author": { "name": "topener", "key": "topener", "displayName": "Rene Pot", "active": true, "timeZone": "Europe/Berlin" }, "body": "This StackOverflow ticket seems to describe how to implement it in iOS: http://stackoverflow.com/questions/22767098/how-to-change-inactive-icon-text-color-on-tab-bar\r\n\r\nAlso, the `updateMoreBar` function is where the functionality probably should go.\r\n\r\nCode below goes into that function, it'll make inactive text red. If that helps anything at all for implementation.\r\n\r\n{code:objective-c}\r\n NSDictionary *theAttr = @{UITextAttributeTextColor: [UIColor redColor],\r\n UITextAttributeTextShadowColor: [UIColor whiteColor],\r\n UITextAttributeTextShadowOffset: [NSValue valueWithUIOffset:UIOffsetMake(0.0, 1.0)],\r\n UITextAttributeFont:[UIFont systemFontOfSize:12] };\r\n [navBar setTitleTextAttributes:theAttr];\r\n [[UITabBarItem appearance] setTitleTextAttributes:theAttr forState:UIControlStateNormal];\r\n// [[UITabBarItem appearance] setTitleTextAttributes:theAttr forState:UIControlStateSelected];\r\n{code}", "updateAuthor": { "name": "topener", "key": "topener", "displayName": "Rene Pot", "active": true, "timeZone": "Europe/Berlin" }, "created": "2014-10-13T19:40:49.000+0000", "updated": "2014-10-13T19:40:49.000+0000" }, { "id": "340152", "author": { "name": "iRonin", "key": "ironin", "displayName": "Cyprian Kowalczyk", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Any update?", "updateAuthor": { "name": "iRonin", "key": "ironin", "displayName": "Cyprian Kowalczyk", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2015-01-21T19:46:26.000+0000", "updated": "2015-01-21T19:46:26.000+0000" }, { "id": "351502", "author": { "name": "cng", "key": "cng", "displayName": "Chee Kiat Ng", "active": false, "timeZone": "America/Los_Angeles" }, "body": "Unfortunately, after some investigation, the native behavior in iOS makes it not possible to preset a tint color for inactive tabs. However, there are work-arounds found online, and titanium is able to use that work around as well.\r\nBasically, you have to preset all your icons to the color you want for inactive icons. After which, you configure it such that for the selected tab (active tab), the icon will become a mask to allow the desired highlight color to show. See below sample code:\r\n{code}\r\nTitanium.UI.setBackgroundColor('#000');\r\n \r\nvar tabGroup = Titanium.UI.createTabGroup({\r\n\ttabsTintColor: 'red'\r\n});\r\n \r\nvar win1 = Titanium.UI.createWindow({\r\n title:'Tab 1',\r\n backgroundColor:'#fff'\r\n});\r\nvar tab1 = Titanium.UI.createTab({\r\n icon:'images/tabs/KS_nav_views_blue.png',\r\n activeIcon: 'images/tabs/KS_nav_views_blue.png',\r\n title:'Tab 1',\r\n window:win1,\r\n activeIconIsMask:true, \r\n iconIsMask:false,\r\n// titleColor: '#6a63d7',\r\n // activeTitleColor: 'red'\r\n});\r\n \r\nvar win2 = Titanium.UI.createWindow({\r\n title:'Tab 2',\r\n backgroundColor:'#fff'\r\n});\r\nvar tab2 = Titanium.UI.createTab({\r\n icon:'images/tabs/KS_nav_ui_blue.png',\r\n activeIcon: 'images/tabs/KS_nav_ui_blue.png',\r\n title:'Tab 2',\r\n window:win2,\r\n activeIconIsMask:true, \r\n iconIsMask:false,\r\n// titleColor: '#6a63d7',\r\n // activeTitleColor: 'red'\r\n});\r\n\r\nvar win3 = Titanium.UI.createWindow({\r\n title:'Tab 3',\r\n backgroundColor:'#fff'\r\n});\r\nvar tab3 = Titanium.UI.createTab({\r\n icon:'images/tabs/KS_nav_ui_blue.png',\r\n activeIcon: 'images/tabs/KS_nav_ui_blue.png',\r\n title:'Tab 3',\r\n window:win3,\r\n activeIconIsMask:true, \r\n iconIsMask:false,\r\n // titleColor: '#6a63d7',\r\n // activeTitleColor: 'red'\r\n});\r\n\r\ntabGroup.addTab(tab1);\r\ntabGroup.addTab(tab2);\r\ntabGroup.addTab(tab3);\r\n\r\n \r\ntabGroup.open();\r\n{code}\r\n\r\nAttached screenshot, and 'blue' png icons. \r\nWill be submitting a PR shortly to include the setting of colors for the tab titles (active and inactive), as well as document updates.", "updateAuthor": { "name": "cng", "key": "cng", "displayName": "Chee Kiat Ng", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2015-05-04T08:15:42.000+0000", "updated": "2015-05-05T01:33:24.000+0000" }, { "id": "351618", "author": { "name": "cng", "key": "cng", "displayName": "Chee Kiat Ng", "active": false, "timeZone": "America/Los_Angeles" }, "body": "PR Here: https://github.com/appcelerator/titanium_mobile/pull/6820\r\nuncomment titleColor and activeTitleColor in above sample code to see it in action.", "updateAuthor": { "name": "cng", "key": "cng", "displayName": "Chee Kiat Ng", "active": false, "timeZone": "America/Los_Angeles" }, "created": "2015-05-05T01:54:41.000+0000", "updated": "2015-05-05T01:54:41.000+0000" }, { "id": "355578", "author": { "name": "lchoudhary", "key": "lchoudhary", "displayName": "Lokesh Choudhary", "active": true, "timeZone": "America/Los_Angeles" }, "body": "Verified the fix by running the code above.\r\n\r\nThe tab changes its color to the \"activeTitlecolor\" set in the code.\r\n\r\nClosing.\r\n\r\nEnvironment:\r\nAppc Studio : 4.1.0.201506151224\r\nTi SDK : 4.1.0.v20150619100430\r\nTi CLI : 4.0.1\r\nAlloy : 1.6.2\r\nMAC Yosemite : 10.10.3\r\nAppc NPM : 4.1.0-1\r\nAppc CLI : 4.1.0-1\r\nNode: v0.10.37\r\nIphone 6 : IOS 8.2\r\n\r\n", "updateAuthor": { "name": "lchoudhary", "key": "lchoudhary", "displayName": "Lokesh Choudhary", "active": true, "timeZone": "America/Los_Angeles" }, "created": "2015-06-19T23:23:40.000+0000", "updated": "2015-06-19T23:23:40.000+0000" } ], "maxResults": 11, "total": 11, "startAt": 0 } } }