You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

SwiftUI中如何移除View默认边距?解决DialogView左右边距问题

解决SwiftUI中DialogView左右边距问题

问题根源在于DialogView内部的VStack默认不会铺满水平空间,且存在系统默认的水平内边距。按以下方式修改即可移除左右边距:

方案1:内聚式调整DialogView布局

让DialogView内部的容器铺满水平宽度,并移除默认内边距,同时将背景色直接绑定到全屏容器上:

struct DialogView: View {
    var body: some View {
        VStack(alignment: .leading, spacing: 30) {
            Text("Forget Password")
                .font(.system(size: 15, weight: .light))
                .padding(.top, 20)
            Text("Proceed to reset your password? ")
                .font(.system(size: 15, weight: .light))
            Text("If yes, please enter your existing mobile number to receive OTP")
                .font(.system(size: 15, weight: .light))
        }
        // 强制VStack占满整个水平宽度
        .frame(maxWidth: .infinity)
        // 移除系统默认的水平内边距
        .padding(.horizontal, 0)
        // 让背景色铺满整个容器
        .background(Color.white)
    }
}

同时修改ForgetPasswordView中DialogView的调用(去掉外部重复的背景设置):

Spacer()
DialogView()
    .frame(maxWidth: .infinity)

方案2:父视图强制忽略边距

如果不想改动DialogView内部结构,可在父视图中直接强制忽略水平方向的安全区域边距:

Spacer()
DialogView()
    .background(Color.white)
    .frame(maxWidth: .infinity)
    .edgesIgnoringSafeArea(.horizontal)

推荐使用方案1,布局逻辑更集中,后续维护更便捷。

内容的提问来源于stack exchange,提问作者Zin Win Htet

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.20 21:54:36