From 3515498711abc3ca577b269e1034e71aaa3dbce6 Mon Sep 17 00:00:00 2001 From: Manav Date: Mon, 9 May 2022 23:49:58 +0530 Subject: [PATCH] Use black background to improve navigation transitions to web views By default, the web view uses a white background. This was causing an ugly flash during the initial navigation to a page containing a web view. This was fixed by setting the web view's background to transparent in https://github.com/ente-io/frame/pull/233/files. That fixed the white flash. But when we use a transparent background, it causesanother different sort of weirdness -- during the navigation, the navigation bar remains visible, but the rest of the new screen below remains transparent. So visually it looks as if only the navigation bar is sliding in from the right. The issue with fixing a color is that at some point, our web pages will start having separate light/dark modes, and the background color won't be fixed always. Currently though, we only have dark mode pages. And also the app is only in dark mode, with a black background. So using black as the background solves the navigation weirdness, and also doesn't stray too much from the eventual color of the rendered page. --- lib/ui/web_page.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/ui/web_page.dart b/lib/ui/web_page.dart index eb767becb..bb371b0c7 100644 --- a/lib/ui/web_page.dart +++ b/lib/ui/web_page.dart @@ -22,7 +22,7 @@ class _WebPageState extends State { title: Text(widget.title), actions: [_hasLoadedPage ? Container() : loadWidget], ), - backgroundColor: Colors.transparent, + backgroundColor: Colors.black, body: InAppWebView( initialUrlRequest: URLRequest(url: Uri.parse(widget.url)), initialOptions: InAppWebViewGroupOptions(