Watch Complications (WidgetKit) do not show anything on device

I’m trying to create complications für the Watch using the new WidgetKit. While the complications do show up fine in the preview in Xcode and also in the Simulator, on a real device the complications do never shown anything. The complications are listed and can be selected in the watch face settings, but the preview is always black, and when added to a watch face, it shows nothing. I can tap on this „nothing“ and the App launches, so the complication is actually there. But it doesn’t show anything.

This is also true for the Watch App on the iPhone, which lets me add the complications to a watch face, but it also shows nothing.

But in the Simulator everything works as expected, the complications show their content just fine. So it looks like the code is fine.

The iPhone runs the iOS 16.1, and the watch runs watchOS 9.1 (right now the latest public releases)

Does anyone having the same issue and maybe a solution or a hint, what exactly I should check?

OK, I think I've found the reason for this problem: The problem seems to be the size of the image I try to show in the complications. I could not find any information about the concrete sizes of the different complication variations (these might be larger on larger watches than on the smaller models). So I initially tried a size of 128x128 px. This caused runtime errors in the Xcode preview and inspecting the error message saying that the image size was too large and the maximum would be 124x124px (circular) and 93x93px (corner) etc. (the numbers can be slightly different)

Therefore I created matching images of these sizes and have used these. This works fine for the simulator and the previce in Xcode.

But when I run the complications on a real device, the allowed image sizes seem to be even smaller. Unfortunytely there are no error messages or console messages when running complications on a real device, so we are debugging blind... So reducing the image sizes even further made the complications appear on the device as well. This actually leads to the problem that for the circular complication on most watch faces an image size of 120x120 is too large, but for the cirular complication for the „large numbers“ watch face this image size is too small to be not blurry.

The final question is, where can we find information about how large images should or can be for the different kinds of complications? When these images are too small, they look blurry, if they are too big, they waste space or cause errors. But what are the sizes which should be used?

Hello, did you find a better solution for this?

Currently without much official information, I ended up finding a "solution" I get the available size informed via Geometry <- which can be inconsistent or via context.displaySize which is consistent... and multiply by 2. So I was able to make it work on Apple Watch of different sizes and with a good quality.

Because for example on Apple Watch Ultra it is a limit and on Apple Watch Series 6 it is another size...

Really the part of WidgetKit besides being poorly documented seems to be a "gambiarra" does not seem like something that was so well planned, it lacks several functions that already had in ClockKit.

Hugs.

I ran into the same problem with images, so I used a 512x512 SVG and it works fine. It may not be suitable for your images, but it is easier than making separate sized PNGs.

This is all rather painful isn't it! There is a page with sizes on here - you need to go really small! 42px. Make sure you add the 2x and 3x versions of you image to avoid it looking blurry.

https://developer.apple.com/design/human-interface-guidelines/complications#Circular

Watch Complications (WidgetKit) do not show anything on device
 
 
Q