Constants that indicate the rendering mode for a widget.
The system can modify the appearance of accessory family widgets. For
example, it renders widgets on the Lock Screen on iPhone using the
``WidgetKit/WidgetRenderingMode/vibrant`` mode, while it renders
widget-based complications in watchOS using either the
``WidgetKit/WidgetRenderingMode/fullColor`` or
``WidgetKit/WidgetRenderingMode/accented`` modes, depending on the watch
face and the user's settings.
You can read the rendering mode from the environment values using the
`.widgetRenderingMode` key.
``` swift
@Environment(\.widgetRenderingMode) var widgetRenderingMode
```
You can then customize your widget's design based on the rendering mode.
Members (4)
get · iOS 16.0+
description
TypeScript
get description(): string
Swift declaration
var description: String { get }
A textual representation of this instance.
Calling this property directly is discouraged. Instead, convert an
instance of any type to a string by using the `String(describing:)`
initializer. This initializer works with any type, and uses the custom
`description` property for types that conform to
`CustomStringConvertible`:
struct Point: CustomStringConvertible {
let x: Int, y: Int
var description: String {
return "(\(x), \(y))"
}
}
let p = Point(x: 21, y: 30)
let s = String(describing: p)
print(s)
// Prints "(21, 30)"
The conversion of `p` to a string in the assignment to `s` uses the
`Point` type's `description` property.
get · iOS 16.0+
vibrant
TypeScript
static get vibrant(): WidgetRenderingMode
Swift declaration
static let vibrant: WidgetRenderingMode
The system desaturates the widget, making a monochrome version that it
uses to create an adaptive, vibrant effect.
The system displays vibrant widgets on the Lock Screen on iPhone.
get · iOS 16.0+
accented
TypeScript
static get accented(): WidgetRenderingMode
Swift declaration
static let accented: WidgetRenderingMode
The system divides the widget's view hierarchy into an accent group and
a default group, applying a different color to each group.
In watchOS, the system displays accented widget-based complications on
many watch faces. For example, when the user selects a color, the
Infograph watch face uses white for the default group, and the
user-selected color for the accent. However, these colors can change
from face to face. In the X-Large watch face, the system applies the
selected color to the default group, and colors the accent group white.
Other faces use system-defined colors for both groups; for example, the
Solar Dial face defines both an accent and a default color, and changes
these colors based on the time of day.
When applying the colors, the system treats the widget's views as if
they were template images. It replaces the view's color --- rendering
the new colors while preserving the view's alpha channel.
To control your view's appearance, add the
<doc://com.apple.documentation/documentation/swiftui/View/widgetAccentable(_:)>
modifier to part of your view's hierarchy. The system adds that view and
all of its subviews to the accent group. It puts all other views in the
default group.
``` swift
var body: some View {
VStack {
Text("MON")
.font(.caption)
.widgetAccentable()
Text("6")
.font(.title)
}
}
}
```
get · iOS 16.0+
fullColor
TypeScript
static get fullColor(): WidgetRenderingMode
Swift declaration
static let fullColor: WidgetRenderingMode
The system renders the widget in full color.
In this mode, the system doesn't alter or filter the widget's colors.
The system displays full-color widget-based complications on some watch
faces, such as the Infograph face, on the Home Screen or Today View in
iOS or iPadOS, and in Notification Center on macOS.
> Note: The Infograph face only uses full-color rendering when the user
sets the face to multicolor. If the user selects an accent color, the
system uses ``WidgetKit/WidgetRenderingMode/accented`` instead.
