Apple 的 SwiftUI 教程代码不显示自制副本中的视图内容

Question

我刚刚开始学习 SwiftUI，遵循 Apple 在 this link 上构建 iOS 应用程序的教程。我从提供的框架应用程序开始，并在最新的 Xcode 中逐步跟进。 CardView 没有看到我应该看到的，而是只显示了一个空白的白色矩形。

Apple 提供了一个完全构建的项目，它工作得很好。我比较了我从骨架项目构建的代码和完成项目附带的代码，它们看起来是一样的。然而，我自制的项目副本根本没有在 CardView 中填写任何细节。没有颜色、文本或图标，只有一个空白的白色矩形。除了简单地将代码与固定示例进行比较之外，我完全不知道如何调试它。欢迎提出任何建议。

这是CardView.swift的代码：

import SwiftUI

struct CardView: View {
    let scrum: DailyScrum
    var body: some View {
        VStack(alignment: .leading) {
            Text(scrum.title).font(.headline)
            Spacer()
            HStack {
                Label("\(scrum.attendees.count)", systemImage: "person.3")
                    .accessibilityElement(children: .ignore)
                    .accessibilityLabel(Text("Attendees"))
                    .accessibilityValue(Text("\(scrum.attendees.count)"))
                Spacer()
                Label("\(scrum.lengthInMinutes)", systemImage: "clock")
                    .padding(.trailing, 20)
                    .accessibilityElement(children: .ignore)
                    .accessibilityLabel(Text("Meeting length"))
                    .accessibilityValue(Text("\(scrum.lengthInMinutes) minutes"))
            }
            .font(.caption)
        }
        .padding()
        .foregroundColor(scrum.color.accessibleFontColor)

    }
}

struct CardView_Previews: PreviewProvider {
    static var scrum = DailyScrum.data[0]
    static var previews: some View {
        CardView(scrum: scrum)
            .background(scrum.color)
            .previewLayout(.fixed(width: 400, height: 60))
    }
}

这是我在 Xcode 的预览中从我的代码中看到的图像：

这是我在 Xcode 预览中看到的苹果已经完成的示例代码：

将我构建的代码与 Apple 提供的代码进行比较似乎可以突出问题，但零差异出现了。项目中的其他两个视图工作正常。 CardView.swift?

除了这个来源之外，还有其他重要的模块吗？

Answer 1

了解问题

scrum.color.accessibleFontColor应用于foregroundColor的卡片。所以所有的标签和图文等等都会受到影响。
accessibleFontColor 似乎 return 根据父颜色 black 或 white（在本例中为 scrum.color）
您要通过预览的 Color("Design") 似乎是 returning clear 颜色，因为名称 Design 中没有颜色起始项目中的资产。因此预览显示默认的白色作为卡片背景。但它也使用 white 颜色作为前景。所以你会在结果中看到一张纯白色的卡片。

解决方案

注释掉.foregroundColor(scrum.color.accessibleFontColor)
或者添加资产颜色并按预期命名。
或者给卡片手动背景
或下载完整版本，然后将过程逆向进行。

Answer 2

这是由未定义的“设计”颜色引起的。

从Apple的示例项目中复制Assets.xcassets中的“设计”颜色，并将颜色的定义放在您项目的Assets.xcassets目录下可以解决您的问题。

Answer 3

我从教程中下载了项目文件，我发现有一个文件您可能错过了。您可以查看示例代码中的 Models 文件夹，有一个名为 Color+Codable.swift 的文件负责这个 accessibleFontColor 事情。

Answer 4

我运行遇到了同样的问题，发现我错过了“创建卡片视图 -> 第 1 节：创建颜色主题”部分中的 步骤 5的 tutorial

对于不熟悉 Xcode 的人，我认为这一步中的说明在这里不是很清楚。我通过从示例项目的下载版本中导入资源来解决这个问题。试试这些步骤

打开 Xcode
右键单击并select导入
导航到下载的项目和 select“主题”目录，它是 Assets.xcassets

完成后您的资产文件应该如下所示。作为奖励，您可以使用这些相同的步骤来导入应用程序图标。

Apple 的 SwiftUI 教程代码不显示自制副本中的视图内容

Apple's SwiftUI tutorial code doesn't display view contents in homemade copy

xcode

preview

ios

swift

swiftui

了解问题

解决方案