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

Question

我在 xcode 12 中创建了一个项目并添加了一个小部件扩展目标。目标已创建，我只剩下一个显示时间的简单小部件。小部件的预览按预期工作，并且小部件在模拟器中按预期显示。但是如果我将视图更改为使用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。

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

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

Answer 1

背景

小部件视图是静态的。

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

---

WidgetKit 中不允许的视图列表

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

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

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

2. 动画观看次数：

   • ProgressView

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

   • NavigationView
   • NavigationLink

4. UIKit 包装器用于 UIKit 视图/视图控制器：

   • UIViewRepresentable
   • UIViewControllerRepresentable

---

替换

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

Answer 2

在尝试使用 UIViewRepresentable 包装器包含来自 Charts 库（UIView 的子类）的图表后，我得到了这个黄色的禁止条目（没有幽灵的捉鬼敢死队）标志。我在任何地方都找不到黄色的禁止进入标志，也不确定它是来自图表库还是来自 iOS 本身，所以看到你看到同样的问题让我松了一口气，这让我走上了正确的道路找到解决方案。

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

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

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

Answer 3

在 VStack 中使用 ForEach：

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