20.5 C
New York
Monday, March 31, 2025

ios – WKWebview/UIViewRepresentable – Disguise Loading… textual content whereas webview is loading


I’ve the next UIViewRepresentable to load a webview.

struct SViewerWebView: UIViewRepresentable{
    var url: String
    var token: String
    @Binding var isLoading: Bool
    
    func makeCoordinator() -> Coordinator {
        Coordinator(self)
    }
    
    func makeUIView(context: Context) -> WKWebView {
        let webConfiguration = WKWebViewConfiguration()
        let webView = WKWebView(body:.zero,configuration:webConfiguration)
        webView.allowsBackForwardNavigationGestures = true
        webView.isInspectable = true
        webView.navigationDelegate = context.coordinator
        return webView
    }
    func updateUIView(_ uiView: WKWebView, context: Context) {
        guard let urlforRequest = URL(string: url) else {
            print("❌ Invalid URL:", url)
            return
        }
        var request = URLRequest(url: urlforRequest)
        request.addValue("Bearer (token)", forHTTPHeaderField: "Authorization")
        
        print("🔄 Loading URL:", url)
        print("🛠 Headers:", request.allHTTPHeaderFields ?? [:])
        
        uiView.load(request)
    }
    
    //coordinator
    class Coordinator: NSObject, WKNavigationDelegate {
        var mum or dad: SViewerWebView

        init(_ mum or dad: SViewerWebView) {
            self.mum or dad = mum or dad
        }

        func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
            DispatchQueue.important.async {
                self.mum or dad.isLoading = false  // Disguise loading when web page masses
            }
        }

        func webView(_ webView: WKWebView, didFail navigation: WKNavigation!, withError error: Error) {
            DispatchQueue.important.async {
                self.mum or dad.isLoading = false  // Disguise loading on error
            }
        }
    }
}

That is the state earlier than the content material masses. At this level I am displaying a ProgressView()
loading

The issue comes within the step between screenshot 1 and three:

as you possibly can see under, earlier than navigating to the webview content material, there’s a default loading textual content that also displaying up. Apparently, it appears to be the default habits from the wkwebview. How can I cover that textual content standing?
loading text
forge webview

my view element:

var physique: some View {
        ZStack{
            SViewerWebView(url: webUrl,token: TokenManager.getToken()!,isLoading: $isLoading)
            if isLoading{
                VStack {
                    ProgressView()
                    .progressViewStyle(CircularProgressViewStyle())
                    .scaleEffect(1.5)
                }
                .body(maxWidth: .infinity, maxHeight: .infinity)
                .background(Shade.white)
            }
        }
        .ignoresSafeArea()
    }

Related Articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Latest Articles