watchOS 2 Complication with image

Question

So I was trying to get my watchOS 2 complication to show an image. Research landed me with these links:

https://www.bignerdranch.com/blog/watchkit-2-complications/ http://techotopia.com/index.php/A_watchOS_2_Complication_Tutorial https://developer.apple.com/library/prerelease/watchos/documentation/ClockKit/Reference/CLKImageProvider_class/index.html#//apple_ref/occ/cl/CLKImageProvider https://forums.developer.apple.com/thread/7426

I have tried using the image assets for the complication as well as just importing the individual image into the project. My code for loading the image is as follows:

lazy var utilitarianImageProvider: CLKImageProvider? = {
    if let image = UIImage(named: "Complication/Utilitarian") {
        return CLKImageProvider(onePieceImage: image)
    }
    else {
        print("Cannot find image named 'Complication/Utilitarian'")
    }
    return nil
}()

But that only ever results in this image:

The image I am trying to load is:

I have tried both a coloured image and a monochrome image and I always get the same result.

I have tried with an alpha channel, without an alpha channel, black background, white background, same results. In this example it is a black background as per Apple's suggestion — Tim
Hmm. Try to make the black background to be transparent instead? I can get my image to be showing properly in the simulator. — Valent Richie
ok that worked. Do you want to post it as an answer so I can accept it? :) — Tim

Valent Richie Valent Richie · Accepted Answer · 2015-11-26T07:18:48

Try to set the black background to be transparent. The images are treated as alpha-only, which means all color in the image file will discarded and the watch will colorise it accordingly.

watchOS 2 Complication with image

1 Answers