I'm unable to find sample code that demonstrates how to support a custom Live Activity layout for Apple Watch. I have read the documentation and have added the supplementalActivityFamilies with small and medium. However, I am not able to detect when the activityFamily is set to small.
This is what I'm trying to use without success:
struct MyWidgetLiveActivity: Widget {
@Environment(\.activityFamily) var activityFamily: ActivityFamily
var body: some WidgetConfiguration {
ActivityConfiguration(for: MyWidgetAttributes.self) { context in
if activityFamily == .small {
Text("Apple Watch! \(activityFamily.description)")
} else {
Text("Not small family: \(activityFamily.description)")
}
} dynamicIsland: { context in
return DynamicIsland {
DynamicIslandExpandedRegion(.leading) {
Text("Leading")
}
DynamicIslandExpandedRegion(.trailing) {
Text("Trailing")
}
DynamicIslandExpandedRegion(.bottom) {
Text("Bottom")
}
} compactLeading: {
Text("CL")
} compactTrailing: {
Text("CT")
} minimal: {
Text("M")
}
}
.supplementalActivityFamilies([.small, .medium])
}
}
This code shows "Not small family: medium" on my Apple Watch. Could somebody provide some insight into why this doesn't work for me?
Thank you for your link to the video that shows the use of activityFamilies. My goal is to show a more compact layout for the Live Activity on Apple Watch and show the normal layout on iPhone.
My issue was that I had declared the @Environment line in the wrong place. In the WWDC session, the View is created in the Dynamic Island configuration and the @Environment is configured in that new view. This allows the activityFamily to be correctly set to small for Apple Watch. In my sample code above it was only set once when the activity is created on the iPhone.
struct DeliveryActivityContent: View {
@Environment(\.activityFamily) var activityFamily
var context: ActivityViewContext<DeliveryActivityAttributes>
var body: some View {
switch activityFamily {
case .small:
DeliverySmallContent(context: context)
case .medium:
DeliveryMediumContent(context: context)
@unknown default:
DeliveryMediumContent(context: context)
}
}
}