17 Replies
      Latest reply on Jan 14, 2020 12:31 PM by MortenCarlsen
      neal1 Level 1 Level 1 (10 points)

        Before  loading an html resource into a WkWebView, it is always white regardless of whether in dark or light mode. I've tried setiing its background color after instantation, but it has no effect. When in dark mode, this produces a flashing effect as the white background is briefly displayed. Is there an API that I'm missing for this?

         

        Thanks in advance,

        Neal

        • Re: WkWebView always comes up  with white background?
          quantumonion Level 1 Level 1 (0 points)

          This!  It's beyond me why we must suffer the ghost of Jony Ive and his WhiteWorld at every turn when Dark Mode is enabled.  Dark Mode should be dark.  The many instances where this is not the case is aggravating to say the least.  It's also physically painful for those with light-sensitive eyes. Apple can and should so better.

          • Re: WkWebView always comes up  with white background?
            john daniel Level 4 Level 4 (550 points)

            You will need to turn off the background.

             

            [webView setValue: @NO forKey: @"drawsBackground"];

              • Re: WkWebView always comes up  with white background?
                neal1 Level 1 Level 1 (10 points)

                HI John,

                sorry but this causes a crash with the error message stating *** Terminating app due to uncaught exception 'NSUnknownKeyException', reason: '[<OTGWKWebView 0x1280f9c00> setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key drawsBackground.'.

                 

                Perhaps you were thinking of UIWebView?

                  • Re: WkWebView always comes up  with white background?
                    john daniel Level 4 Level 4 (550 points)

                    Who's Josh?

                     

                    The code works fine here:

                     

                      WKWebView * webView =
                        [[WKWebView alloc]
                          initWithFrame: bounds configuration: configuration]; 
                      //[webView setValue: @YES forKey: @"drawsTransparentBackground"];
                      NSLog(@"Set drawsBackground");
                      [webView setValue: @NO forKey: @"drawsBackground"];
                      NSLog(@"Set drawsBackground success!");
                    
                    

                     

                    And the result is:

                     

                    2019-08-12 10:44:05.765156-0400 ESWebView[15736:466390] Set drawsBackground

                    2019-08-12 10:44:05.765216-0400 ESWebView[15736:466390] Set drawsBackground success!

                      • Re: WkWebView always comes up  with white background?
                        neal1 Level 1 Level 1 (10 points)

                        Hi John,

                        are you using the latest beta? I ask because I still get a crash with this message: *** Terminating app due to uncaught exception 'NSUnknownKeyException', reason: '[<WKWebView 0x102175800> setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key drawsBackground.'

                         

                        How are you not getting that exception? I never make it to line 4.

                            WKWebView *aWebView = [[WKWebView alloc]initWithFrame:self.view.frame
                                                                    configuration:configuration];
                            [aWebView setValue: @NO forKey: @"drawsBackground"];
                            self.webView = aWebView;
                        

                         

                         

                        Thank you

                          • Re: WkWebView always comes up  with white background?
                            john daniel Level 4 Level 4 (550 points)

                            I'm very sorry, but I didn't notice this was the iOS forum. I've been doing some extensive hacking on WKWebView. That's what attracted my interest. But I've only done this on macOS so far. I will need to port all of this over to iOS. I don't like the flash either, so I went ahead and found a fix.

                             

                            There are a couple of issues, at least with my demo project. There is a white flash when the app first loads, but that is from the launch screen. I built a simple app that has a button to display the web view. That way, I can tell where the flash starts and ends.

                             

                            After constructing the view, but before loading it, you have to do two things:

                             

                            1) Set webView.opaque = NO

                            This will prevent the web view from clearing the display.

                            2) Set webView.backgroundColor to the eventual colour of your HTML, or something halfway decent other than white or black.

                             

                            You have to do both. If you don't set the background colour, you still get a flash, just a black one this time. If you don't set opaque to NO, you get a white flash regardless of the background color.

                             

                            Trying to set the background colour to clearColor doesn't work at all.

                             

                            There is a bit of a disconnect with the notch. If you know your eventual HTML background, you can set that as the webview background and everything looks nice. If your HTML has a different background, it gets messy.

                             

                            I did not check this on the beta, but I'm pretty confident it will work. There is no way to avoid the flash, because the phone needs to do that to draw the notch. All you can do is pick the flash colour to avoid annoying the user. I see why this has been so difficult for people to figure out. The "opaque" setting really has nothing whatsoever to do with opacity. This is simply a "clear background with white" toggle. If you turn it off, you turn off the "clean background with white" operation. It will still clear the background, but with the background colour this time, which is black by default, unless you change it.

                            • Re: WkWebView always comes up  with white background?
                              MortenCarlsen Level 1 Level 1 (0 points)

                              This should be marked as the correct answer.

                               

                              Thanks for this, Sir... You saved my evening !

                        • Re: WkWebView always comes up  with white background?
                          jzmobile Level 1 Level 1 (0 points)

                          Hi John,

                           

                          Noted that you were working with WkWebView on macOS.  We are just trying to get it working on macOS.  So easy on iOS, Mac, not so much.  We are simply trying to show some of our HTML documention files.  We are porting from iOS to macOS and there really isn't much here or Stack on macOS so any help would be appreciated.

                           

                          Here are two code samples that result in White Screen, no errors or other messages. It is finding the files in the bundle.

                           

                          Thanks for any help, suggestions or solutions.

                           

                          @IBOutlet weak var webOutlet: WKWebView!

                              override func viewDidLoad() {

                            

                                  print ("WebHelp")

                                  super.viewDidLoad()

                                  let webView = WKWebView()

                                  let htmlPath = Bundle.main.path(forResource: "Admin", ofType: "html")

                                  let folderPath = Bundle.main.bundlePath

                                  let baseUrl = URL(fileURLWithPath: folderPath, isDirectory: true)

                                  do {

                                      let htmlString = try NSString(contentsOfFile: htmlPath!, encoding: String.Encoding.utf8.rawValue)

                                      webView.loadHTMLString(htmlString as String, baseURL: baseUrl)

                                  } catch {

                                      // catch error

                                  }

                                  webView.navigationDelegate = self

                                  webOutlet = webView

                                  }

                              }

                           

                          OR

                           

                               @property (weak) IBOutlet WKWebView *webView;

                           

                               NSURLRequest *urlRequest = [NSURLRequest requestWithURL:[NSURL fileURLWithPath:[[NSBundle mainBundle]      pathForResource:@"Admin" ofType:@"html"]]];

                               [webView loadRequest:urlRequest];

                               [webView.navigationDelegate self];

                            • Re: WkWebView always comes up  with white background?
                              KMT Level 9 Level 9 (15,425 points)

                                   >there really isn't much here or Stack on macOS so any help would be appreciated.

                               

                              Most likely due to the OP working with a beta OS. If that's also your case, legacy threads on the topic are best taken lightly/avoided.

                              • Re: WkWebView always comes up  with white background?
                                john daniel Level 4 Level 4 (550 points)

                                It would be better to start your own question instead of piggy-backing onto this one.

                                 

                                I will tell you a few things, but any followup should be in your own thread.

                                 

                                Are you getting any output at all? You said "White Screen" but is that the same as the "White Flash"? Maybe try my incorrect (for iOS) answer above. After this exercise, I am going to try to get rid of that code in favour of something that will also work on iOS.

                                 

                                Primarily, I don't see where you've added the webview to a parent view. Web views don't work from interface builder, at least not without significant help.

                                 

                                You aren't setting the navigation delegate until after loading the HTML. Usually, the loading will take so long that it will actually happen after setting the delgate, but that is not something under your control. It is better to have everything configured before kicking off the load.

                                 

                                Do you really need a webview for this? Couldn't you just open the help URL in the user's default web browser?

                                  • Re: WkWebView always comes up  with white background?
                                    jzmobile Level 1 Level 1 (0 points)

                                    John,

                                     

                                    Thanks for your response.

                                     

                                    Webview works easily with interface builder, just a single line of code assigning the view to the webview, in iOS or macOS.

                                     

                                    Our app features context sensitive help so that the appropriate HTML displays in the view the user is in.  There are over 80 HTML files so asking the user to exit the app and open another window, etc.  Not a soultion.  (It works great in our iOS apps.)

                                     

                                    The issue and solution is a Entitlement called:  com.apple.security.network.client, that must be set to YES.  Why this is needed to access files in the app bundle is a mystery...

                                     

                                    Sorry I posted this on the wrong thread, doesn't seem like there's much Mac expertise out there!

                              • Re: WkWebView always comes up  with white background?
                                neal1 Level 1 Level 1 (10 points)

                                Found a suboptimal solution to this issue, so until a public API solution is provided this'll have to do. Upon initialization of the WkWebView, set the webview's hidden property to true and then in webView:didFinishNavigation, use performSelector with a delay to make it visible again by setting hidden to false:

                                [self.webView performSelector:@selector(setHidden:) withObject:@NO afterDelay:0.75f];
                                
                                

                                Doing this in the delegate method does not fix the issue:

                                     self.webview.hidden = NO;

                                   

                                I'd rather not have to place a 0.75 second delay, so if someone has a correct public API solution please provide it.

                                    

                                Thank you