使用SwiftUI在WatchOS中调整UI

Question

我正在努力掌握如何使用SwiftUI为Watch App构建合适的UI

适合我的意思是我想创建一个屏幕，该屏幕显示一些信息而无需借助滚动。

用户界面应适应屏幕尺寸并适合用户界面元素，我还希望能够在空间不足的情况下删除低优先级的用户界面元素。

我试图创建一个样本VStack Text元素，然后使用layoutPriority(...)和.minimumScaleFactor(...)之类的属性使内容适合容器，但没有运气。

给出以下代码。我在屏幕上看到的结果是大量可用空间溢出的大文本列表。我使用layoutPriority(...) / .minimumScaleFactor(...)方法的哪种组合都没关系

struct ContentView: View {
    var body: some View {
        VStack() {
            Text("Hello World").font(.title)
            Text("Hello World").font(.title)
            Text("Hello World").font(.title)
            Text("Hello World").font(.title)
            Text("Hello World").font(.title)
            Text("Hello World").font(.title)
            Text("Hello World").font(.title)
        }
    }
}

结果是：

swiftUI中是否有一种方法可以构建合适的UI，该UI可以缩放内容以适合可用空间，而不仅仅是中继所包含的View要使用哪个空间？如果可用空间不足，还有没有办法删除UI元素？

Answer 1

使用GeometryReader，您可以为其父级布局获得灵活的首选尺寸。

  

此视图将灵活的首选尺寸返回其父版式。

struct ContentView: View {

    var arr = ["Hello World 1",
               "Hello World 2",
               "Hello World 3",
               "Hello World 4",
               "Hello World 5",
               "Hello World 6",
               "Hello World 7",
               "Hello World 8",
               "Hello World 9"]

    var body: some View {
        GeometryReader { geometry in
                VStack(alignment: .leading) {
                    Group {
                        ForEach(self.arr, id:\.self){ text in
                                Text(text)
                         }
                        }.lineLimit(nil)
                        .frame(height: geometry.size.height/CGFloat(self.arr.count))
                        .font(.custom("HelvaticaNeue", size: 20.0))
                 }
             }.edgesIgnoringSafeArea(.bottom)

     }
}