Implementing Apple Watch Widget Complications

230 Views Asked by At

I am trying to add Widget Complications to an existing Apple Watch app. I added the WatchOS widgets extension and followed instructions to create static, non-updating complications to merely launch the app from the watch home screen.

Here is my code in the widget extension:

import WidgetKit
import SwiftUI

struct Provider: TimelineProvider {
    
    func getSnapshot(in context: Context, completion: @escaping (SimpleEntry) -> Void) {
    }
    
    func getTimeline(in context: Context, completion: @escaping (Timeline<SimpleEntry>) -> Void) {
    }
    
    func placeholder(in context: Context) -> SimpleEntry {
        SimpleEntry(date: Date())
    }
    
    func snapshot(in context: Context) async -> SimpleEntry {
        SimpleEntry(date: Date())
    }
}

struct SimpleEntry: TimelineEntry {
    let date: Date
//    let configuration: ConfigurationAppIntent
}

struct TrapScores_WidgetsEntryView : View {
    
    @Environment(\.widgetFamily) var widgetFamily
    var entry: Provider.Entry
    
    var body: some View {
        
        switch widgetFamily {
        case .accessoryCorner:
            ComplicationCorner()
        case .accessoryCircular:
            ComplicationCircular()
        case .accessoryRectangular:
            Text("TrapScores")
        case .accessoryInline:
            Text("TrapScores")
        @unknown default:
            //mandatory as there are more widget families as in lockscreen widgets etc
            Text("AppIcon")
        }
    }
}

@main
struct TrapScores_Widgets: Widget {
    let kind: String = "TrapScores_Complications"
    
    var body: some WidgetConfiguration {
        StaticConfiguration(kind: kind, provider: Provider()) { entry in
            TrapScores_WidgetsEntryView(entry: entry)
                .containerBackground(.fill.secondary, for: .widget)
        }
        .configurationDisplayName("TrapScores")
        .description("This will launch TrapScores App")
        .supportedFamilies([.accessoryCorner, .accessoryCircular])
    }
}
    
    struct ComplicationCircular: View {
        var body: some View {
            Image("Graphic Circular")
                .widgetAccentable(true)
                .unredacted()
        }
    }
    struct ComplicationCorner: View {
        var body: some View {
            Image("Graphic Circular")
                .widgetAccentable(true)
                .unredacted()
        }
    }
    
    #Preview(as: .accessoryCircular) {
        TrapScores_Widgets()
    } timeline: {
        SimpleEntry(date: .now)
    }

The complications appear fine in the preview: Accessory Corner

Accessory Circular

The complication can be added to the watch face but no image comes with it and just a black circle is shown:

No complication icons

Any suggestions on what I'm doing wrong?

0

There are 0 best solutions below