Extend Your App’s Controls Across the System - WWDC24

Peter Yaacoub •

Introduction

With iOS 18, you can now extend your app’s controls across the system, making them accessible from the Control Center, the Action Button, or the Lock Screen. These controls provide quick access to key actions and information, enhancing user experience and engagement.

Set-up

Controls are created using WidgetKit, similar to the widgets introduced in iOS 14. You can use a ControlWidget or a specialized widget like ControlWidgetToggle with an Image or Label. These controls can be either a toggle or a button and come in three different sizes for various use cases.

Static Controls

For static controls, use StaticControlConfiguration along with a ControlValueProvider. This provider has currentValue() and previewValue properties. The currentValue() updates asynchronously, while the previewValue is displayed in the Controls Gallery or Action Button settings.

Configurable Controls

For configurable controls, use AppIntentControlValueProvider and the promptsForUserConfiguration() view modifier.

Invalidation

Controls can be invalidated in three ways:

  1. Action Performed: When the control’s action is executed.
  2. App Request: When the app requests a reload using the reloadAllControls() method.
  3. Notification: When the app sends a notification coupled with the ControlPushHandler.

This capability makes the control powerful in the sense that it can sync between the user’s devices when change is required.

Display

To ensure the control is presented as expected, use the following modifiers:

  • controlWidgetActionHint(_:): Modifies the text shown on the Dynamic Island or next to the Action Button.
  • controlWidgetStatus: Changes the control’s status.
  • displayName and description: Customize how the control appears in the Controls Gallery and Action Button settings.

Example Code Snippet (Display Customization):

ControlWidgetToggle("Toggle Control", systemImage: "star.fill")
    .controlWidgetActionHint("Toggle Star")
    .controlWidgetStatus(.enabled)
    .displayName("Star Toggle")
    .description("A toggle for stars")

Conclusion

By extending your app’s controls across the system, you enhance user interaction and provide quick access to essential functionalities. Following these guidelines and using the provided code snippets will help you integrate controls seamlessly into your app.