Home > OS >  Apply .background() to entire WidgetKit complication
Apply .background() to entire WidgetKit complication

Time:01-29

I'm new to iOS development and I am struggling to make the .background() modifier to a view apply to the entire background. My code is as follows, intended to be an apple watch complication:

struct DrinkCountComplicationsEntryView : View {
    var entry: SimpleEntry

    var body: some View {
        let theCount = getCount()
        let link = URL(string: "myApp://widgetClick")?
            .appending(queryItems: [URLQueryItem(name: "count", value: String(theCount))])
        ZStack {
            Text("DRINK")
                .offset(x: 0, y: -15)
                .foregroundColor(Color.orange)
                .font(.system(size: 10, weight: .semibold))
            Text(String(theCount))
                .font(.title)
                .offset(x: 0, y: 0)
            Text("COUNT")
                .offset(x: 0, y: 15)
                .foregroundColor(Color.orange)
                .font(.system(size: 10, weight: .semibold))
        }
        .widgetURL(link)
        .background()
        .ignoresSafeArea()
    }
}

I thought having .ignoresSafeArea() plus .background() would do the trick, but instead it applies the background as a box around the text. It also flashes on refresh. Thoughts?

It also appears completely broken on both Preview and Simulator.

enter image description here

CodePudding user response:

The issue you are encountering is caused by the fact that, by default, the background will have the same dimensions as the content within that View.
You can use the following modifier on the View, before setting the background, so that it will take the full available width and height, and so will the background.

.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity)

.ignoresSafeArea() in the other end doesn't help because it tells the View to ignore the safe area layout guides, and in your specific case there are no safe areas to respect.

Official SwiftUI frame documentation

  • Related