为什么某些视图在小部件中显示为红色禁止进入标志？

Question

我在 xcode 12 中创建了一个项目并添加了一个 Widget Extension 目标。目标已创建，我只剩下一个显示时间的简单小部件。小部件的预览按预期工作，并且小部件在模拟器中按预期显示。但是如果我将视图更改为使用 List 而不是 Text，就像这样：

struct SimpleWidgetEntryView : View {
    var entry: Provider.Entry

    var body: some View {
        List {
            Text("Something")
        }
    }
}

预览和模拟器都显示黄色背景上的红色禁止进入标志：

我试过将 List 放入 VStack 并使用动态列表，但没有成功。我找不到任何关于 List 在小部件中被禁止的文档。我试过重新启动 xcode 和模拟器，清理和重建。我正在使用 xcode 12.0 beta 3.

~我在尝试使用包裹在 UIViewRepresentable 中的 UIView 时也遇到了这个问题。该视图是来自图表库的 LineChartView。~ 编辑：根据 this post on the Apple developer forums，不可能在 WidgetKit 小部件中使用 UIKit 视图。

有人知道如何在小部件中使用 List 吗？非常感谢任何帮助。谢谢

Answer 1

在尝试使用 UIViewRepresentable 包装器包含来自图表库（UIView 的子类）的图表后，我得到了这个黄色的禁止进入（没有幽灵笑声的捉鬼敢死队）标志。我找不到任何地方记录的黄色禁止进入标志，也不确定它是来自图表库还是 iOS 本身，所以很高兴看到你看到了同样的问题，这让我很欣慰提出解决方案的正确途径。

根据您在上面引用的这个 post，一位 Apple 工程师说“包装在 UIViewRepresentable 中的 UIKit 视图在 WidgetKit 中不起作用。当视图从您的扩展中编码以显示时，它们将显示为空白。” .我认为这并不完全准确。我认为它会显示为黄色并带有红色“禁止进入”标志。

https://developer.apple.com/forums/thread/653471?answerId=619627022#619627022

我通过将图表呈现为 UIImage 并在小部件而不是图表的 UIView 版本上显示图像来解决这个问题。这应该足以满足我的目的，因为我不需要它像我在应用程序中那样具有交互性。

Answer 2

在 VStack 中使用 ForEach：

 var body: some View{
        ZStack{
            self.backgroundColor
            VStack{
                ForEach(0...1, id: \.self){ entry in
                    Text("\(entry)")
                }
            }
        }
    }

Answer 3

背景

小部件视图是 静态。

它们不支持动画、导航和用户交互（Link除外）。而且它们必须用纯 SwiftUI 编写。

---

WidgetKit 中不允许的视图列表

请注意，该列表并不详尽，主要提供示例：

1. 交互式 视图（您可以与之交互的视图，例如，通过触摸它们）：

   • List
   • Form
   • ScrollView
   • TabView
   • Map
   • Picker
   • Slider
   • 等等...

2. 动画 观看次数：

   • ProgressView

3. 导航 视图（您不能使用 标准 导航 - 为此您有 Link):

   • NavigationView
   • NavigationLink

4. UIKit 包装器 用于 UIKit Views/ViewControllers:

   • UIViewRepresentable
   • UIViewControllerRepresentable

---

替换

如果您想使用上述任何视图，例如像 List 这样的 交互式 视图，您需要从 non-interactive 视图中创建它 - 这里 VStack + ForEach.