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

SwiftUI Sheet默认以Medium打开,支持切换Small/Large的实现方法

解决SwiftUI Sheet默认尺寸及多尺寸切换问题

要实现Sheet默认以.medium打开,同时支持切换.small和.large尺寸,核心是利用presentationDetents(_:selection:)的绑定重载版本,通过状态变量控制默认选中的detent。具体实现步骤如下:

  • 新增一个@State变量存储当前激活的detent,初始值设为.medium:

    @State private var selectedDetent: PresentationDetent = .medium
    
  • 修改Sheet的presentationDetents调用,传入包含.small、.medium、.large的尺寸数组,并绑定到上述状态变量:

    .sheet(isPresented: $showUserRegisterSheet) {
        RegisterUserSheetView()
            .presentationDetents([.small, .medium, .large], selection: $selectedDetent)
    }
    

这样设置后,Sheet打开时会默认以.medium尺寸展示,用户可通过拖拽或自定义控件切换到其他尺寸。如果需要在Sheet内部添加切换按钮,只需将selectedDetent以@Binding形式传递给子视图即可。

完整修改后的代码示例

@State private var showUserRegisterSheet = false
@State private var selectedDetent: PresentationDetent = .medium

private var userCreateAccount: some View {
    VStack(alignment: .center) {
        Text("New MapGliders? [Create Account](user-register)")
            .font(Font.custom("Nunito-Regular", size: 16))
            .multilineTextAlignment(.center)
            .environment(\.openURL, OpenURLAction { url in
                switch url.absoluteString {
                case "user-register":
                    showUserRegisterSheet = true
                    return .handled
                default:
                    return .discarded
                }
            })
            .sheet(isPresented: $showUserRegisterSheet) {
                RegisterUserSheetView(selectedDetent: $selectedDetent)
                    .presentationDetents([.small, .medium, .large], selection: $selectedDetent)
            }
    }
    .padding(.top, 10)
}

// 子视图示例(如需内部切换尺寸)
struct RegisterUserSheetView: View {
    @Binding var selectedDetent: PresentationDetent
    
    var body: some View {
        VStack(spacing: 20) {
            Button("切换小尺寸") {
                selectedDetent = .small
            }
            Button("切换中尺寸") {
                selectedDetent = .medium
            }
            Button("切换大尺寸") {
                selectedDetent = .large
            }
            // 其他视图内容
        }
        .padding()
    }
}

内容的提问来源于stack exchange,提问作者SLE

相关产品推荐
方舟 Agent Plan

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

最近更新时间:2026.08.12 11:21:00