LazyVGrid中单个列上的多重对齐

Question

因此，我有一个LazyVGrid，我正在利用在我的项目，但我有一个问题，让我的一个字段，以正确地对齐。

下面是我的代码：

VStack {
    LazyVGrid(columns: [GridItem(), GridItem(), GridItem(alignment: .top)], content: {
        Spacer()
        Image("onboarding-logo")
            .renderingMode(.original)
            .resizable()
            .scaledToFit()
            .frame(width: 120.0)
            .padding()
            .clipped()
            .frame(alignment: .center)
            .border(.red)
        NavigationLink(destination: MainView().environmentObject(mainViewModel), label: {
            Text("Skip")
                .frame(height: .infinity, alignment: .top)
                .clipped()
                .padding()
                .foregroundColor(Color.white)
        })
    })
    .border(.red)
}

这将输出以下视图：

​

我怎么能让“跳”的文字在右上角？如下所示：

​

我想保持所有列“顶部”对齐，“徽标”中心/顶部对齐，和“跳”按钮右上对齐，这可能吗？

Answer 1

SwiftUI有许多组合的对齐值，如.topLeading和.bottomTrailing。

在您的示例中，您希望文本位于右上角，这是从左到右语言的.topTrailing。

取代：

LazyVGrid(columns: [GridItem(), GridItem(), GridItem(alignment: .top)], content: {

通过以下方式：

LazyVGrid(columns: [GridItem(), GridItem(), GridItem(alignment: .topTrailing)], content: {