How can I design for accessoryRectangular?

Asked on 2024-07-22

1 search

To design for accessoryRectangular in watchOS 11, you can use the new view template API called AccessoryWidgetGroup. This template allows you to create a view in an accessory rectangular widget that can contain up to three different pieces of content, enhancing glanceability.

Here are the key points to consider:

  1. Components: The AccessoryWidgetGroup consists of two main components: label and content.

    • Label: By default, it will display the name of the app's widget extension bundle, but you can provide a custom label or text view.
    • Content: You can include up to three views. If more than three views are provided, only the first three will be shown. Each view can be interactive or can deep link to different parts of your app.
  2. Preconfigured Settings: The font sizes, content view size, and content margins are preconfigured, allowing you to focus on the content of the widget.

  3. Empty Views: If there are fewer than three views, the system will automatically insert empty views to ensure that three views appear in the widget. These empty views will launch the app when tapped.

  4. Styling: You can use the accessoryWidgetGroupStyle view modifier to specify the masking shape of the content views, either circular or rounded square. The default is circular if unspecified. Additionally, you can customize the colors:

    • Background: Tint using the containerBackground view modifier.
    • Label: Tint using the foregroundStyle view modifier.

For more detailed guidance, you can refer to the session What’s new in watchOS 11 (07:51).

Relevant Sessions

If you need more specific details or have other questions, feel free to ask!