iOS SwiftUI中如何将视图置顶？需实现类似UIKit自动布局的效果

你的问题根源在于当前的HStack没有占据父视图的全部垂直空间，SwiftUI默认会将容器视图居中布局，导致内容无法顶到顶部。要实现类似UIKit Auto Layout的顶部对齐效果，只需让容器视图占满可用垂直空间并设置顶部对齐：

修改后的代码如下：

import SwiftUI

struct ItemDetail: View {
    let item : MenuItem
    var body: some View {
        HStack(alignment: .top){
            VStack{
                Image(item.mainImage)
                Text(item.description)
            }
            .padding(10)
            .background(.red)
        }
        .frame(maxHeight: .infinity, alignment: .top)
        .navigationTitle(item.name)
    }
}

struct ItemDetail_Previews: PreviewProvider {
    static var previews: some View {
        NavigationStack {
            ItemDetail(item: MenuItem.example)
        }
    }
}

关键说明 #

• .frame(maxHeight: .infinity, alignment: .top)：让HStack占据父视图的全部垂直高度，同时将内部内容对齐到顶部，等价于UIKit中给视图设置顶部约束并让其填充剩余空间的效果。
• 预览中添加NavigationStack是为了贴近实际运行场景，确保导航栏和内容布局显示正常。

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