iOS 14中等大小的小部件背景图片拒绝填充

编程问答 2022-06-12

问题描述

由于某种原因，我无法在XCode 12.0版中正确获取AspectFill的图像背景，但只能使用.systemMedium小部件尺寸。不论大小，它似乎都可以很好地工作。

我有一个非常简单的视图：

import SwiftUI

@available(iOS 13.0.0,*)
struct Banana: View {

    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))
        }
        .edgesIgnoringSafeArea(.all)
        .background(
            Image("bananas")
                .resizable()
                .scaledToFill()
        ).edgesIgnoringSafeArea(.all)
    }
}

@available(iOS 13.0.0,*)
struct Banana_Previews: PreviewProvider {
    static var previews: some View {
        Banana()
    }
}

还有一个非常简单的小部件：


struct fruitWidgetEntryView : View {
    var entry: Provider.Entry

    var body: some View {
        Banana()
    }
}

@main
struct fruitWidget: Widget {
    let kind: String = "fruitWidget"
    
    var body: some WidgetConfiguration {
        StaticConfiguration(kind: kind,provider: Provider()) { entry in
            fruitWidgetEntryView(entry: entry)
        }
        .configurationdisplayName("fruit Widget")
        .description("Enhance your day with delicIoUs fruit.")
        .supportedFamilies([.systemSmall,.systemMedium,.systemLarge])
    }
}

struct fruitWidget_Previews: PreviewProvider {
    static var previews: some View {
        Group{
            fruitWidgetEntryView(entry: SimpleEntry(date: Date()))
                .previewContext(
                    WidgetPreviewContext(family: .systemSmall))
            fruitWidgetEntryView(entry: SimpleEntry(date: Date()))
                .previewContext(
                    WidgetPreviewContext(family: .systemMedium))
            fruitWidgetEntryView(entry: SimpleEntry(date: Date()))
                .previewContext(
                    WidgetPreviewContext(family: .systemLarge))
        }
    }
}

我尝试使用GeometryReader和frame（）以及其他十几种变化来更改纵横比。无论我尝试什么，我都会在中小部件的左侧和右侧获得空白。它仅适用于大型和小型尺寸。查看图片：

enter image description here

解决方法

这是固定的变体-作为背景中的图像，您必须将VStack扩展到全屏。

注意：edgesIgnoringSafeArea允许在内容变宽时超出安全区域，但不能使内容变宽。 

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(
        Image("plant")
            .resizable()
            .scaledToFill()
    )
}
ios14swiftuiwidgetkit