[TIMOB-24085] iOS: Add ability to style subtitle in native UITableViewCell templates

GitHub Issue	n/a
Type	Improvement
Priority	Low
Status	Closed
Resolution	Fixed
Resolution Date	2016-11-03T10:11:17.000+0000
Affected Version/s	n/a
Fix Version/s	Release 6.1.0
Components	iOS
Labels	n/a
Reporter	Hans Knöchel
Assignee	Hans Knöchel
Created	2016-10-30T10:30:20.000+0000
Updated	2016-11-21T19:38:19.000+0000

Description

We have some really cool system list view item templates since 3.x that allow the user to use native styles for their cells, e.g. - Ti.UI.LIST_ITEM_TEMPLATE_CONTACTS - Ti.UI.LIST_ITEM_TEMPLATE_SETTINGS - Ti.UI.LIST_ITEM_TEMPLATE_SUBTITLE Although we can already tint the title of those using the color property that is mapped to it, the subtitle cannot be tinted, yet. Introducing a subtitleColor and selectedSubtitleColor property along with the existing properties color and selectedColor would allow this through all system templates and would not influence any other API's, so it's save to implement.

Comments

Hans Knöchel 2016-10-30

PR: https://github.com/appcelerator/titanium_mobile/pull/8565 Unit-Test: https://github.com/appcelerator/titanium-mobile-mocha-suite/pull/9 Test-case:

   var win = Ti.UI.createWindow({
       backgroundColor: "#fff"
   });
   
   var list = Ti.UI.createListView({
   	sections: [Ti.UI.createListSection({
   		items: [{
   			template: Ti.UI.LIST_ITEM_TEMPLATE_CONTACTS,
   			properties: {
   				title: "My Title",
   				subtitle: "My Subtitle",
   				color: "blue",
   				subtitleColor: "red",
   				selectedColor: "green",
   				selectedSubtitleColor: "green"
   			}
   		},{
   			template: Ti.UI.LIST_ITEM_TEMPLATE_SUBTITLE,
   			properties: {
   				title: "My Title",
   				subtitle: "My Subtitle",
   				color: "blue",
   				subtitleColor: "red",
   				selectedColor: "green",
   				selectedSubtitleColor: "green"
   			}
   		},{
   			template: Ti.UI.LIST_ITEM_TEMPLATE_SETTINGS,
   			properties: {
   				title: "My Title",
   				subtitle: "My Subtitle",
   				color: "blue",
   				subtitleColor: "red",
   				selectedColor: "green",
   				selectedSubtitleColor: "green"
   			}
   		}]
   	})]
   });
   
   win.add(list);
   win.open();

Abir Mukherjee 2016-11-21

Used this environment for the fix: NPM Version: 2.15.9 Node Version: 4.5.0 Mac OS: 10.12.1 Appc CLI: 6.0.0 Appc CLI NPM: 4.2.8 Titanium SDK version: 6.1.0.v20161121004950 Appcelerator Studio, build: 4.8.0.201611121409 Xcode 8.1 GM I installed the demo code on both Simulator and Device. I observed three list items were created, and that subtitle color can be set independently. Furthermore, when I selected any list item , the color for the main text and the subtitled text turned green. When I selected a different list item, the new items turned green, and the item I clicked away from returned to blue for the main text, and red for the subtitled text. The improvement appears to work as expected.

JSON Source