中等尺寸Widget背景图片或颜色未能填充整个区域

Question

在尝试使用iOS 14创建一个具有最小尺寸的Widget时，背景颜色或图片拒绝填充Widget两侧的空间。虽然containerBackground修饰符可以实现这一效果，但它适用于iOS 17或更高版本。我也看到过相同的问题，但即使我复制粘贴了完全一样的代码，那个问题下的答案现在不知为何无法正常工作：

struct WidgetEntryView : View {
var entry: SomeEntry
var body: some View {
    VStack(alignment: .leading) {
        Spacer()
        Text("Aardvark Exactlywhat")
            .font(.largeTitle)
            .bold()
            .padding(.bottom, 20)
            .padding(.leading, 20)
            .padding(.trailing, 20)
            .minimumScaleFactor(0.5)
            .foregroundColor(.white)
            .shadow(
                color: Color.black,
                radius: 1.0,
                x: CGFloat(4),
                y: CGFloat(4))
    }
    .frame(maxWidth: .infinity, maxHeight: .infinity)   // << this one !!
    .edgesIgnoringSafeArea(.all)
    .background(
        backgroundImage()
            .resizable()
            .scaledToFill()
    )
}

gsm2009 · Answer

一种解决方法是在图片上添加负的水平内边距。

我测量到的间隙为16pt，但如果图片只是一个占位符，并且不介意有充足的溢出部分，则可以作为预防措施将其尺寸设置得更大一些。

.background(
    backgroundImage()
        .resizable()
        .scaledToFill()
        .padding(.horizontal, -16)
)

gsm2009 · Answer

gsm2009 谢谢您的回答，实际上我发现问题在于，在较早版本的iOS中一切都能正常工作，但从iOS 17开始，应该使用.containerBackground属性来实现背景填充。

gsm2009 · Answer

您需要创建一个包装函数，该函数在可用时使用.containerBackground，并在必要时回退到使用.background：

extension View {
    @ViewBuilder func widgetBackground(@ViewBuilder content: () -> T) -> some View {
        if #available(iOS 17.0, *) {
            containerBackground(for: .widget, content: content)
        }else {
            background(content())
        }
    }
}

.widgetBackground {
    backgroundImage()
        .resizable()
        .scaledToFill()
}