SwiftUI：如何在HStack中让居中内容不受其他元素影响？

你现有的实现逻辑是两个Spacer()平分HStack内扣除左右内容后的剩余空间，当左侧文本有宽度时，中间的Details标题会向右偏移，无法实现相对于屏幕绝对居中的效果。

用Spacer实现的方案 #

如果一定要用Spacer()达成需求是可以的，只需要在HStack右侧添加一个和左侧内容等宽的透明占位元素，保证左右两侧的占位宽度一致，即可让中间标题居中：

VStack {
    HStack(alignment: .top) {
        Text("<------")
        Spacer()
        Text("Details")
        Spacer()
        // 右侧添加和左侧内容完全一致的占位，设置为透明即可
        Text("<------").opacity(0)
    }
    Spacer()         
}

这种方案的局限性很强，仅适合左侧内容宽度固定的场景，如果左侧内容是动态变化的，占位元素宽度无法匹配，就会出现居中偏移。

更通用的实现方案（推荐） #

你可以用ZStack分层处理标题和左侧内容，两者互不干扰，无论左侧内容宽度如何变化，标题都会相对于屏幕居中：

VStack {
    ZStack(alignment: .top) {
        // 标题层：默认在ZStack中居中
        Text("Details")
        // 左侧内容层：撑满整个宽度，内容左对齐
        HStack {
            Text("<------")
            Spacer()
        }
    }
    Spacer()
}

效果示意图：

内容的提问来源于stack exchange，提问作者user17503091