.trailing 之后的 VStack 间距问题

Question

尾随后仍有一些空间。这是代码

VStack(alignment: .trailing) {
                
                
                Text("History & Text")
                    .font(.title)
                    .foregroundStyle(.secondary)
                
                Text(currentDisplay)
                    .font(.largeTitle)
                    .foregroundStyle(.white)
                    .padding()
            }
            .frame(maxWidth: .infinity)

在此输入图片描述

如何去掉末尾的空格。

Answer 1

VStack

确实在尾随侧对齐其视图，但

VStack

本身的宽度不足以填充屏幕的整个宽度。

.frame(maxWidth: .infinity)

不会改变

VStack

。它只是将

VStack

放入填充屏幕宽度的“隐形框架”内。

VStack

在这个框架内是如何对齐的？从文档中，我们可以看到

alignment:

参数的默认值为

.center

。

如果您通过

alignment: .trailing

，

VStack

将与填充屏幕宽度的不可见框架的后缘对齐。

VStack(alignment: .trailing) {
    Text("History & Text")
        .font(.title)
        .foregroundStyle(.secondary)
    
    Text(currentDisplay)
        .font(.largeTitle)
        .foregroundStyle(.white)
        .padding()
}
.frame(maxWidth: .infinity, alignment: .trailing)