SwiftUI - 设置 View 框架

Question

当我学习 SwiftUI(测试版 6)等新东西时我想从基础开始。

我只想像在 UIKit 中一样将框架设置为 subview 。我在这里缺少什么？ (这是来自模拟器)

<强>1。 subview 不在 0,0 位置。
2. 为什么至少单词的开头不在边框内？

更新:如何在 0,0 位置设置 TextView ？(就像在 UIKit 上一样)
我认为我的问题很清楚，但由于某些原因，事实并非如此。

Answer 1

我认为了解为什么您的解决方案不起作用很重要，因为乍一看它似乎是正确的，而且 SwiftUI 似乎以一些奇怪的方式工作(因为，当然，我们都习惯了 UIKit)。你试过:

struct ContentView: View {
    var body: some View {
        VStack {
            Text("Hello World")
                .position(CGPoint(x: 0, y: 0))
                .frame(width: 50, height: 100)
                .border(Color.red, width: 4)
        }
    }
}

你得到了:

首先，position修饰符表示:

Fixes the center of the view at the specified point in its parent’s coordinate space.

这里有两点很重要:

• View 基于其中心移动，而不是基于其左上角
• View 在父坐标空间中移动

但是文本的父对象是谁？ SwiftUI 中的 view modifier 是应用于 View 并返回 View 的东西。修饰符从最后一个应用到第一个(与您如何看待它们的顺序相反)。在你的情况下:

因此:Text 的中心 相对于带有红色 的 Frame 50x100 位于 (0,0)边框。由于 VStack(这是 VStack 默认行为)，生成的 View 位于屏幕中央。换句话说:position 的父级(position 返回一个 View，每个修饰符返回一个 View)是Frame 50x100 放置在屏幕中央。

如果您想将 Text 的左上角定位在 Frame 坐标空间中的 (0,0) 处，您应该使用 Spacer 这样修改:

struct ContentView: View {
    var body: some View {
        VStack {
            Text("Hello World")
            Spacer()
        }
        .frame(width: 50, height: 100)
        .border(Color.red, width: 4)
    }
}

你会得到:

相反，如果您希望 Frame 的左上角相对于整个 View 位于 (0,0)，我认为最简单的方法是:

struct ContentView: View {
    var body: some View {
        HStack {
            VStack {
                Text("Hello World")
                    .frame(width: 50, height: 100)
                    .border(Color.red, width: 4)
                Spacer()
            }
            Spacer()
        }
        .edgesIgnoringSafeArea(.all)
    }
}

你会得到: