Adapting WKWebView content to reserved regions on iPhone Duo

Question

Created 1d

Replies 1

Boosts 0

Participants 2

This post is from the Activity iPhone Duo UIKit Q&A.

For a UIKit app embedding a WKWebView across the inner display, what is the recommended way to keep web content and interactive controls clear of the fold’s division reserved region?

Are these regions exposed to web content through public CSS or JavaScript APIs, or should the UIKit host query them and communicate the geometry to the page?

How should this work alongside CSS safe-area insets and the web view’s scroll-view inset adjustment, so that native and web layouts don’t apply the same spacing twice?

A small UIKit + WKWebView example would be very helpful.

Answer 1

Frameworks Engineer OP

Apple

1d

If the WKWebView is being used to load content that you control, the current recommendation would be to communicate the geometry to the page via the UIKit host. There are also the Viewport Segments and Device Posture APIs. The Viewport Segments API effectively gives web content access to the reserved regions on iPhone Duo. However, at this time, both are opt-in experimental features in Safari, and cannot be enabled in WKWebView.

CSS safe-area insets and the web view’s scroll-view inset adjustment are unaffected by the fold’s division reserved region.