HomeiOS Developmentios - Utilizing .presentationBackground(_: Type), however default sheet background continues to be...

ios – Utilizing .presentationBackground(_: Type), however default sheet background continues to be seen


Utilizing .presentationBackground(.clear) does work for sheets when working with iOS variations earlier than iOS 26. Nonetheless, with iOS 26, the background is all the time opaque when the sheet is the default .giant detent measurement. Smaller detents have a glass impact.

Setting a transparent background does nonetheless work for .fullScreenCover, so you could possibly think about using this for exhibiting a modal view with clear or semi-transparent background. Nonetheless, you’ll have to add your personal drag gesture in order for you to have the ability to drag to dismiss.

Right here is an adaption of your instance to point out how it may be accomplished:

struct ImmersionModeScreen: View {
    let loremIpsum = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim advert minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
    @State non-public var presentSheet: Bool = false
    @GestureState non-public var dragOffset = CGFloat.zero

    var physique: some View {
        VStack(alignment: .heart, spacing: 15) {
            Textual content(loremIpsum)
                .font(.title)
                .padding()
            Button {
                presentSheet = true
            } label: {
                Textual content("Current")
            }
        }
        .body(maxWidth: .infinity, maxHeight: .infinity)
        .background(.pink)
//        .sheet(isPresented: $presentSheet) {
        .fullScreenCover(isPresented: $presentSheet) {
            Textual content("Element")
                .font(.largeTitle)
                .body(maxWidth: .infinity, maxHeight: .infinity)
                .background {
                    UnevenRoundedRectangle(topLeadingRadius: 50, topTrailingRadius: 50)
                        .fill(.background.opacity(0.5))
                        .ignoresSafeArea(edges: .backside)
                }
                .offset(y: dragOffset)
                .animation(.easeInOut, worth: dragOffset)
                .gesture(
                    DragGesture()
                        .updating($dragOffset) { val, state, trans in
                            state = max(0, val.translation.top)
                        }
                        .onEnded { val in
                            if val.predictedEndTranslation.top > 300 {
                                presentSheet = false
                            }
                        }
                )
                .presentationBackground(.clear)
        }
    }
}

Animation

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -
Google search engine

Most Popular

Recent Comments