将图像名称传递给 SwiftUI 中的自定义图像子类

Posted

技术标签:

【中文标题】将图像名称传递给 SwiftUI 中的自定义图像子类【英文标题】:Pass image name to custom Image subclass in SwiftUI 【发布时间】:2020-02-21 18:40:17 【问题描述】:

我正在尝试完成一些看起来很简单的事情:我在 SwiftUI 中有一个自定义的 Image 子类,我正在使用它来方便,我想在我的应用程序中使用它。我的最终目标是在其他视图中使用OnboardingThumbnailImage,并简单地将图像名称传递给构造函数。

import SwiftUI

struct OnboardingThumbnailImage: View 
    var imageName: String

    var body: some View 
        Image(imageName)
            .resizable()
            .scaledToFit()
            .frame(width: 50, height: 50)
            .foregroundColor(Colors.tintColor)
    


struct OnboardingThumbnailImage_Previews: PreviewProvider 
    static var previews: some View 
        OnboardingThumbnailImage(imageName: "?????")
    

我怎样才能做到这一点?编译器要求我在 OnboardingThumbnailImage_Previews 中指定一个值,所以我不知道。我已经研究过 Bindings,但我不需要视图之间的“双向街道”,所以我不确定。

为了继承默认的Image 构造函数,我是否可以只留下不带参数的Image()?如果我离开 Image(),我会收到一个错误:Cannot invoke initializer for type 'Image' without arguments.

【问题讨论】:

您可以将您的 imageName 定义为空字符串。 var imageName: String = "" 和 priview 忽略它 【参考方案1】:

这是 SwiftUI 的询问方式

当这个View被预览时,你想显示什么图像?

你只能在 macOS Catalina 上preview SwiftUI views,所以如果你没有使用 Catalina(像我一样),那么这个功能对你来说并不是很重要。

您应该将要在预览中看到的图像放在???? 位中。如果你没有使用 Catalina,或者你只是不想预览它,你可以删除整个 OnboardingThumbnailImage_Previews 结构。

另请注意,您不能在 SwiftUI 中“子类化”另一个视图。你所能做的就是composition,这就是你在这里所做的。 SwiftUI 的设计倾向于组合而不是继承。您可以在以下页面中找到有关此概念的说明:1、2。

【讨论】:

谢谢!如果我想预览我在父视图中指定的图像怎么办?我不明白如何将它“传递”到那个有意义的文件中。 SwiftUI 的设计偏向于组合而不是继承这一事实是否意味着我不应该为自定义图像创建新文件? 再次,您可以删除OnboardingThumbnailImage_Previews 结构(因为您不需要预览OnboardingThumbnailImage 本身),并在父视图的预览结构中传递图像名称。 @切萨雷 @Cesare 是什么给了你这样的印象?文件在这里是无关紧要的。它们只是组织代码的一种方式。如何组织代码取决于您。 我确实有 Catalina。在我浏览你写的所有内容时给我一点时间。非常感谢您在此期间提供的帮助。是的,对于文件,我的意思是创建一个新类,抱歉【参考方案2】:

在您的结构视图中,变量imageName 需要初始化值。因为它应该是字符串,因为您定义了一个字符串变量并在您的图像中使用它。要忽略该错误,您可以为变量设置一个空值以忽略在视图构造中初始化的要求

var imageName: String = ""

【讨论】:

谢谢,那么我需要采取哪些步骤才能使其成为Image 子类?将 [...] : View 重命名为 [...] : Image 不起作用。 SwiftUI 视图中没有子类化,因为它们都是符合 View 协议的结构,而不是类类型。你不能子类到 Image 因为 Image 本身就是一个视图

以上是关于将图像名称传递给 SwiftUI 中的自定义图像子类的主要内容,如果未能解决你的问题,请参考以下文章

样式视图传递给 SwiftUI 中的自定义视图

在 SwiftUI 的自定义视图中访问图像的修饰符

如何将图像位置传递给 Vue 中的子组件?

React:将图像从父组件中的 this.state 传递给子组件

如何将视频文件作为输入传递给 NodeJS 中的子进程并接收帧/图像作为输出?

SwiftUI 将数据从 UIViewRepresentable 传递给 SwiftUI 的 View