Skip to content

0x065-UIKit中实现半模态视图简便方案

偶然发现一篇久远的文章:

How To Present a Bottom Sheet View Controller in iOS | by Mohd Hafiz | Better Programming

结合vc.modalPresentationStyle = .overCurrentContext 实现模态定制效果,几乎没有代码量,确实挺巧妙。

xmhafiz/CustomModalVC: Simple Half-screen view controller, draggable and less code (learning purpose)

swift
@objc func presentModalController() {
    let vc = CustomModalViewController()
    vc.modalPresentationStyle = .overCurrentContext
    // Keep animated value as false
    // Custom Modal presentation animation will be handled in VC itself
    self.present(vc, animated: false)
}
@objc func presentModalController() {
    let vc = CustomModalViewController()
    vc.modalPresentationStyle = .overCurrentContext
    // Keep animated value as false
    // Custom Modal presentation animation will be handled in VC itself
    self.present(vc, animated: false)
}

Github Gist:

swiftui可以看下这个框架 fatbobman/SheetKit: an extension library for SwiftUI sheets.

如果是iOS16以上:

swift
    @State private var showSettings = false
    @State private var showSettings2 = false
    @State private var settingsDetent = PresentationDetent.medium

    var body: some View {
        VStack {
            Button("View Settings[.medium, .large]") {
                showSettings = true
            }
            .sheet(isPresented: $showSettings) {
                Text("Hello, World!")
                    .presentationDetents(
                        [.medium, .large],
                        selection: $settingsDetent
                    )
            }.padding(.bottom)

            Button("View Settings[.medium]") {
                showSettings2 = true
            }
            .sheet(isPresented: $showSettings2) {
                Text("Hello, World!")
                    .presentationDetents(
                        [.medium],
                        selection: $settingsDetent
                    )
            }
        }
    }
    @State private var showSettings = false
    @State private var showSettings2 = false
    @State private var settingsDetent = PresentationDetent.medium

    var body: some View {
        VStack {
            Button("View Settings[.medium, .large]") {
                showSettings = true
            }
            .sheet(isPresented: $showSettings) {
                Text("Hello, World!")
                    .presentationDetents(
                        [.medium, .large],
                        selection: $settingsDetent
                    )
            }.padding(.bottom)

            Button("View Settings[.medium]") {
                showSettings2 = true
            }
            .sheet(isPresented: $showSettings2) {
                Text("Hello, World!")
                    .presentationDetents(
                        [.medium],
                        selection: $settingsDetent
                    )
            }
        }
    }

|250