CLKComplication tintColor not working

Question

I am trying to change the colour of text in watch app complication (Modular large tall body), but whatever I do, the text stays white.

Here's my code, of the lines that include tintColor, I've tried them together and each of them one by one.

let secondTemplate = CLKComplicationTemplateModularLargeTallBody()
secondTemplate.tintColor = UIColor.greenColor()
secondTemplate.headerTextProvider.tintColor = UIColor.greenColor()
secondTemplate.bodyTextProvider.tintColor = UIColor.greenColor()
secondTemplate.headerTextProvider = CLKSimpleTextProvider(text: location.uppercaseString)
secondTemplate.bodyTextProvider = CLKSimpleTextProvider(text: "It's 4:20")
let secondEntry = CLKComplicationTimelineEntry(date: dateOf420, complicationTemplate: secondTemplate)
entries.append(secondEntry)

I've looked for questions involving CLKComplication tint color, but I didn't find anything, I hope you can help!

Saks

Are you trying it on a multicolor face? The tint color is currently only used on the Modular face when it’s set to “multicolor” and the Utility face. Otherwise, the complication will use the face’s tint color. – Berneicebernelle

Thanks! That was it, I didn't know I had to set the watch face to multicolor – Saks

@NoahWitherspoon Could you post that as an answer so I can accept it? – Saks

Answer 1

Tint colors in complications are currently only used in two places:

• Modular face when it’s set to “multicolor”
• Utility face

Elsewhere, the complication will use the face’s tint color.

Berneicebernelle

Answer 2

Unfortunately, the answers here are misleading ... I refused to take "only gray is available" as an answer, so the experimentations began:

Yes, this is my app running with full color and white text for the body. Here is the relevant code:

let headerTextProvider = CLKSimpleTextProvider(text: data.headerText)
headerTextProvider.tintColor = UIColor.yellowColor() // data.headerColor

let textProvider = CLKTimeTextProvider(date: data.date)

let template: CLKComplicationTemplate

switch family {

...

case .ModularLarge:
    let textTemplate = CLKComplicationTemplateModularLargeTallBody()
    textTemplate.headerTextProvider = headerTextProvider
    textTemplate.bodyTextProvider = textProvider
    template = textTemplate

}

template.tintColor = UIColor(red: 0.99, green: 0.99, blue: 0.99, alpha: 1)
return template

Don't ... I have no idea why this even works, but it sure smells like a bug. Could be the colorspace, could be hack, ... we mortals will never now.

Isidora

And also in WatchOS 4... it seems like a white color is automatically turned into gray, but (0.99,0.99,0.99,1) isn't detected as white. Nice workaround to fix Apple's troubles. – Abridgment

My experiment shows that: only header can change color, but if you set template tintColor, the header will be changed, and the body will changed to white. – Pentecostal

Answer 3

There are other important changes you should have to know about the tint colors for complications with public watchOS2.

1. You can't customize tint for Utility Face. Only Modular with Multi Color can be tinted.

2. You can't customize tints for all elements on complication except elements that are designed to be tinted. For instance, with ModularLargeTallBody or ModularLargeStandardBody You can customize tint for only header text provider. Other tints of elements will ignored and will be shown as gray.

3. What if you give tintColor to template itself, It will be used as tapping feedback color(It is totally wrong documented by Apple), and it also makes elements that are not tinted in complication to bright white color instead of gray.

It's reasonable behavior IMO, however the Apple's documentation is not reasonable.

Shortfall

Answer 4

My experiment:

• only header can change color, body will remains grey.
• but if you set template tintColor, the header will be changed to that tintColor, and the body will changed to white.

So basically you can choose to set header's tintColor (body is grey) or template's tintColor (body is white).

Pentecostal