swift 向AsyncImage添加占位符,并在AsyncImage无法获取图像时显示不同的图像

yrefmtwq  于 2023-01-16  发布在  Swift
关注(0)|答案(1)|浏览(199)

我尝试使用一个AsyncImage来显示一个ProgressView,当它从一个URL获取图像时,但是如果它无法获取图像,那么应该显示一个不同的图像。我的代码工作的意义是,如果AsyncImage无法获取图像,它将显示不同的图像。但在异步操作运行时,我无法获得占位符ProgressView来显示。下面的代码不包含占位符修饰符,工作正常(编辑:实际上未确认是否有效...):

var body: some View {
    AsyncImage(url: url, scale: scale ?? 1) { phase in
        if let image = phase.image {
            image
                .resizable()
                .aspectRatio(contentMode: contentMode ?? .fit)
                .frame(width: width, height: height)
        } else {
            Image("placeholder_img")
                .resizable()
                .frame(width: 50, height: 50)
                .border(Color(.NeutralPalette5))
                .padding()
                .aspectRatio(contentMode: .fill)
        }
    }
    .frame(width: width, height: height)
}

但是,在此代码中添加占位符修饰符并不起作用:

var body: some View {
    AsyncImage(url: url, scale: scale ?? 1) { phase in
        if let image = phase.image {
            image
                .resizable()
                .aspectRatio(contentMode: contentMode ?? .fit)
                .frame(width: width, height: height)
        } else {
            Image("placeholder_img")
                .resizable()
                .frame(width: 50, height: 50)
                .border(Color(.NeutralPalette5))
                .padding()
                .aspectRatio(contentMode: .fill)
        }
    } placeholder: {
        ProgressView()
            .progressViewStyle(.circular)
    }
    .frame(width: width, height: height)
}

上述操作将导致以下错误:
Failed to produce diagnostic for expression; please submit a bug report (https://swift.org/contributing/#reporting-bugs) and include the project
谁能告诉我如何在代码中使用占位符?我基本上是在AsyncImage获取图像时显示ProgressView,但如果它无法获取图像,则应显示不同的图像,因此如果有更好的方法,请告诉我。

thtygnil

thtygnil1#

当您将AsyncImage(url: ...)placeholder: {..}一起使用时,您得到的是image,而不是phase

var body: some View {
     AsyncImage(url: url) { image in  // <-- here
         image.resizable()
     } placeholder: {
         ProgressView().progressViewStyle(.circular)
     }
 }

要显示不同的图像,可能在经过一段时间后,您必须自己创建代码。或者对phase使用以下方法:

AsyncImage(url: url) { phase in
     if let image = phase.image {
         image.resizable() // Displays the loaded image.
     } else if phase.error != nil {
         Image("Goofy") // Indicates an error, show default image
     } else {
         // Acts as a placeholder.
         ProgressView().progressViewStyle(.circular)
         // Image("Mickey Mouse")
     }
 }

相关问题