A template for displaying an image encircled by a configurable progress ring


class CLKComplicationTemplateUtilitarianSmallRingImage : CLKComplicationTemplate


This template belongs to the CLKComplicationFamily.utilitarianSmall family. Figure 1 shows the layout of the data and where a template of this type might appear on the clock face.

Figure 1

Layout of a utilitarian small ring image template

Diagram showing the layout of an image inside a small progress ring.

Table 1 lists the dimensions of the image you use in this template. All dimensions are in pixels. All images must be specified as @2x images for display on Apple Watch, so the point-based dimensions are half the listed size.

Table 1

Image dimensions

Apple Watch Size



38 mm

28 pixels

28 pixels

40 mm

28 pixels

28 pixels

42 mm

28 pixels

28 pixels

44 mm

32 pixels

32 pixels

Instead of providing multiple images with different resolutions, you can provide a single, scaleable PDF asset. For more information, see Manage Assets.


Setting the Complication Data

var imageProvider: CLKImageProvider

The image to display in the complication.

var ringStyle: CLKComplicationRingStyle

The style of the progress ring.

var fillFraction: Float

The fraction of the ring to fill.


Conforms To

See Also

Utilitarian Small

class CLKComplicationTemplateUtilitarianSmallFlat

A template for displaying an image and text in a single line.

class CLKComplicationTemplateUtilitarianSmallRingText

A template for displaying text encircled by a configurable progress ring.

class CLKComplicationTemplateUtilitarianSmallSquare

A template for displaying a single square image.