Skip to content

WebView within TabbedPage on Android has weird scrolling interactions #6487

@SteveSandersonMS

Description

@SteveSandersonMS

Description

If you put a WebView (for example BlazorWebView, but it doesn't have to be Blazor) inside a TabbedPage, and the content within the webview has horizontal scrolling, then trying to scroll the web content horizontally will cause the enclosing TabbedPage to scroll and switch to the previous/next tab.

This basically means you can't have this combination of controls as the UX is broken. On other platforms this problem doesn't occur because other platforms don't use swipe left/right to switch tabs.

Expected behavior: If the touch interaction starts within the webview, it should not scroll the enclosing TabbedPage.

Steps to Reproduce

Create MAUI app. Add TabbedPage with multiple tabs. Add WebView inside one of the tabs. Get the webview to show some web content like:

<div style="overflow-x: scroll">
    <div style="width: 3000px">Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello </div>
</div>

... then run the app on Android and try to scroll that content.

Version with bug

Release Candidate 1 (current)

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

All

Did you find any workaround?

No response

Relevant log output

No response

Metadata

Metadata

Assignees

Labels

area-controls-webviewWebViewp/2Work that is important, but is currently not scheduled for releaseplatform/androidt/bugSomething isn't working

Type

No type
No fields configured for issues without a type.

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions