SwiftUI 使 Image 的内容响应属性更新

Posted

技术标签:

【中文标题】SwiftUI 使 Image 的内容响应属性更新【英文标题】:SwiftUI Make the content of an Image reactive to a property update 【发布时间】:2021-03-31 22:20:32 【问题描述】:

我的视图中有这个:

Image(uiImage: viewModel.emojiImage)

Button(action: 
    viewModel.updatesRandomEmojiImage()
, label: 
    Text("RANDOM EMOJI")
).buttonStyle(FilledButton())

以及我的 ViewModel 中的这些方法:

@State var emojiImage: UIImage = UIImage()

func updatesRandomEmojiImage() 
    guard let url = URL(string: randomEmojiUrl()) else  return 
    downloadEmojiImage(fromUrl: url)

    
func randomEmojiUrl() -> String 
    repository.emojis().randomElement()?.imageUrl ?? ""

    
private func downloadEmojiImage(fromUrl url: URL) 
    if let data = try? Data(contentsOf: url) 
        self.emojiImage = UIImage(data: data)!
    

我试图让Image 的内容在我点击“随机表情符号”按钮时发生变化。我该怎么做?

【问题讨论】:

【参考方案1】:

我找到了这个问题的答案。我所做的是:

在 VM 中,我将图像设置为 @Published 而不是 @State:

@Published var emojiImage: UIImage? = nil

然后,在视图中我所做的是添加.onReceive 调用和使用@State 的图像:

@State private var emojiImage: UIImage?

var body: some View 
    ZStack 
        emojiImage.mapImage(uiImage: $0)             
    .onReceive(viewModel.$emojiImage)  image 
        self.emojiImage = image
    

【讨论】:

以上是关于SwiftUI 使 Image 的内容响应属性更新的主要内容,如果未能解决你的问题,请参考以下文章

如何更新按钮图像,即`Image(SystemName)` 按下 swiftUI

属性更改后在 SwiftUI 中更新列表

导航栏中的 SwiftUI 元素不响应状态

如何将数据从父模型类传递到 SwiftUI 中的子视图

SwiftUI 将@Published viewmodel 对象值传递给@Binding

如何在 SwiftUI 中使列表更宽?