Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 28 additions & 0 deletions website/docs/ios/development/developing-live-activities.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,32 @@ const variants = {
}
```

To customize the system Lock Screen chrome, pass an object with `content` and `activityBackgroundTint`:

```typescript
const variants = {
lockScreen: {
activityBackgroundTint: '#101828',
content: (
<Voltra.VStack>
<Voltra.Text>Your content here</Voltra.Text>
</Voltra.VStack>
),
},
}
```

`activityBackgroundTint` is applied via SwiftUI's `activityBackgroundTint(...)` modifier on iOS. Voltra currently accepts the same color formats handled by the native iOS parser:

- Hex colors such as `#RGB`, `#RGBA`, `#RRGGBB`, and `#RRGGBBAA`
- `rgb(...)` and `rgba(...)`
- `hsl(...)` and `hsla(...)`
- Named colors: `red`, `orange`, `yellow`, `green`, `mint`, `teal`, `cyan`, `blue`, `indigo`, `purple`, `pink`, `brown`, `white`, `gray`, `black`, `clear`, `transparent`, `primary`, `secondary`

Use `clear` or `transparent` to make the Live Activity background transparent.

If the string cannot be parsed as one of those formats, iOS ignores the tint.

### Dynamic Island

The `island` variant defines how your Live Activity appears in the Dynamic Island (available on iPhone 14 Pro and later). The Dynamic Island has three display states:
Expand Down Expand Up @@ -47,6 +73,8 @@ const variants = {
}
```

`keylineTint` uses the same iOS color parser and accepted formats as `activityBackgroundTint`.

### Supplemental Activity Families (iOS 18+, watchOS 11+)

The `supplementalActivityFamilies` variant defines how your Live Activity appears on Apple Watch Smart Stack and CarPlay displays. This variant is optional and works seamlessly with your existing lock screen and Dynamic Island variants.
Expand Down
Loading