SwiftUI I want to display a loading screen on the entire screen when displaying a sheet

Question

Yamachoki OP

Created Oct ’23

Replies 1

Boosts 1

Views 1.4k

Participants 2

Introduction

I am Japanese
I would like to apologize in advance for any incongruity in the expression of the story.
But I would be happy if you could help me

What I want to solve

I am developing an iPhone app using SwiftUI.
Displaying the screen using Sheet. Inside the Sheet, there is a button for communication.
I want to display a loading screen when I press a button. However, with the code I created, the screen is only displayed inside the Sheet.
I would like to know how to create a loading screen that covers the entire screen.
thank you

My Code

struct ContentView: View { 
    @State private var showingSheet = false 
    var body: some View { 
        Button("Sheet Open") { self.showingSheet.toggle() } 
            .sheet(isPresented: $showingSheet) { 
                SheetView() 
            } 
    } 
} 

struct SheetView: View { 　
    @State var isLoading = false 

    var body: some View { 
        ZStack{ 
            VStack{
                Text("SheetView") 
                Button("Submit Data"){ 
                    isLoading = true 
                    // Submitting now......
                    isLoading = false 
                } 
            }
            
            if isLoading { 
                ZStack{ 
                    Color.white.opacity(0.5) 
                        .ignoresSafeArea() 
                        .frame(width: geometry.size.width, height: geometry.size.height) 
                    ProgressView() 
                } 
            } 
        } 
    } 
}

Boost

Answer 1

Xaxxus OP

Oct ’23

Not sure if this would work.

But you could try something like this:

struct LoadingPreferenceKey: PreferenceKey {
     var defaultValue: Bool = false
     static func reduce(value: inout Self.Value, nextValue: () -> Self.Value) {
          value = nextValue()
     }
}

struct RootView: View {
      @State var loading: Bool = false
      var body: some View {
            ContentView()
                .fullScreenCover(isPresented: $loading) {
                     MyLoadingView()
                }
                .onPreferenceChange(LoadingPreferenceKey.self) { isLoading in
                    loading = true
                }
      }
}

struct ContentView: View { 
    @State private var showingSheet = false
    var body: some View { 
        Button("Sheet Open") { self.showingSheet.toggle() } 
            .sheet(isPresented: $showingSheet) { 
                SheetView() 
            } 
    } 
} 

struct SheetView: View { 　
    @State var isLoading = false 

    var body: some View { 
        ZStack{ 
            VStack{
                Text("SheetView") 
                Button("Submit Data"){ 
                    isLoading = true 
                    // Submitting now......
                    isLoading = false 
                } 
            }
            
            if isLoading { 
                ZStack{ 
                    Color.white.opacity(0.5) 
                        .ignoresSafeArea() 
                        .frame(width: geometry.size.width, height: geometry.size.height) 
                    ProgressView() 
                } 
            } 
        } 
        .preference(LoadingPreferenceKey.self, isLoading)
    } 
}

0