ios 如何在SwiftUI中相对于其左上角定位视图

ijxebb2r  于 2023-06-25  发布在  iOS
关注(0)|答案(4)|浏览(167)

如何在swiftUI中相对于视图左上角定位视图?“位置”修饰符相对于视图的中心坐标移动视图。因此.position(x: 0, y: 0)将视图中心坐标放置在屏幕的左上角。
我想在屏幕的左上角放置一个视图的左上角坐标,如何操作?

struct HomeView: View {
    var body: some View {
        VStack(alignment: .leading) {
            Text("Top Text")
                .font(.system(size: 20))
                .fontWeight(.medium)
             Text("Bottom Text")
                .font(.system(size: 12))
                .fontWeight(.regular)
        }
        .position(x: 0, y: 0)
    }
}

目前,我的视图的左半部分被切断了屏幕,我该如何防止这种情况?另外,如何相对于安全区域对齐?
我想念UIKit😪

hs1ihplo

hs1ihplo1#

@Asperi的回答会解决问题。但是,我认为我们应该使用Spacer(),而不是Color.clearZStack
Spacer专门为这些场景设计,使代码更容易理解。

struct HomeView: View {
    var body: some View {
        HStack {
            VStack(alignment: .leading) {
                Text("Top Text")
                    .font(.system(size: 20))
                    .fontWeight(.medium)

                Text("Bottom Text")
                    .font(.system(size: 12))
                    .fontWeight(.regular)
                Spacer()
            }
            Spacer()
        }
    }
}

SwiftUI布局系统与UIKit不同。
它要求每个子视图根据其父视图的边界计算自己的大小。接下来,要求每个父级在其自己的边界内定位其子级。
https://www.hackingwithswift.com/books/ios-swiftui/how-layout-works-in-swiftui

8qgya5xd

8qgya5xd2#

如果我正确理解你的目标,.position并不适合它。SwiftUI布局在没有硬编码的情况下工作得更好。
这是一个可能的解决方案。使用Xcode 11.4 / iOS 13.4测试

struct HomeView: View {
    var body: some View {
        ZStack(alignment: .topLeading) {
            Color.clear
            VStack(alignment: .leading) {
                Text("Top Text")
                    .font(.system(size: 20))
                    .fontWeight(.medium)
                 Text("Bottom Text")
                    .font(.system(size: 12))
                    .fontWeight(.regular)
            }
        }.frame(maxWidth: .infinity, maxHeight: .infinity)
    }
}
sxissh06

sxissh063#

您可以用途:

offset(x: CGFloat = 0, y: CGFloat = 0) -> some View

因此,您将相对于当前对象位置。
https://developer.apple.com/documentation/swiftui/gaugestyleconfiguration/currentvaluelabel-swift.struct/offset(x:y:)

2ic8powd

2ic8powd4#

框架也可以堆叠。

Text("ABC")
    .frame(maxWidth: .infinity, alignment: .leading)
    .background(.red)
    .frame(height: 100, alignment: .top)
    .background(.blue)

相关问题