WebView not utilizing full screen area (including notch/camera zone)

Discuss
, , ,
1

I am currently developing an Android application using Kodular that loads a local HTML file through the WebView component (file:///android_asset/index.html).
Despite including the meta tag <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"> and applying proper CSS adjustments using env(safe-area-inset), the WebView content does not extend into the notch or camera area. It leaves a visible margin at the top of the screen.

I have already tested the following approaches:

  • Disabled the “Scrollable” option on Screen1.
  • Set both WebView width and height to “Fill parent”.
  • Ensured responsive layout and tested on multiple devices.

Unfortunately, none of these methods resolved the issue.

Could you please confirm whether the Kodular WebView component currently supports viewport-fit=cover and safe area insets?
If not, is there any known workaround or planned update to enable full-screen rendering that includes the notch area?

2

Hi Ruše,

Welcome to the Kodular community!

Try disabling the status bar.

immagine
immagine284×738 25.2 KB

3

I wish the WebViewer could extend the content into the status bar area as well

4

Unfortunately, no :face_with_diagonal_mouth:

5

Use http://localhost/index.html instead and you also will be able to test in the companion app

Probably the Custom Webview can do it? If not, ask the developer if he can add this feature

Taifun