.NET MAUI WebView滚动异常求助：部分HTML文档无法滚动

核心原因 #

两个HTML文档表现不一致，本质是其中一个HTML的布局样式限制了WebView的高度计算和滚动行为——比如设置了overflow: hidden、固定高度容器，或者<html>/<body>的默认边距/滚动属性未正确配置，导致WebView无法识别实际内容高度，进而忽略HeightRequest。另外，嵌套ScrollView会和WebView自身的滚动控件冲突，直接导致滚动失效，这是绝对要避免的操作。

修复方案 #

1. 统一HTML文档的基础样式 #

给两个HTML文档添加如下基础样式，强制WebView能正确计算内容高度并启用滚动：

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        html, body {
            margin: 0;
            padding: 0;
            overflow-y: auto; /* 启用垂直滚动 */
            height: auto; /* 让内容高度自适应，不限制 */
        }
        <!-- 保留原HTML的其他样式 -->
    </style>
</head>
<body>
    <!-- 原HTML内容 -->
</body>
</html>

重点是overflow-y: auto确保内容超出时可滚动，height: auto避免HTML自身限制高度，让WebView能准确获取内容高度。

2. 调整WebView的XAML布局属性 #

不要给WebView设置超大的固定HeightRequest，而是让它自适应按钮下方的剩余空间：

<VerticalStackLayout>
    <HorizontalStackLayout Spacing="200" VerticalOptions="Start" HorizontalOptions="Center">
        <Button Text="Cancel" Clicked="Cancel_Clicked" BackgroundColor="#8244E7" TextColor="White" FontSize="Large" WidthRequest="120" HorizontalOptions="Center"/>
        <Button Text="Sign" Clicked="Sign_Clicked" BackgroundColor="#8244E7" TextColor="White" FontSize="Large" WidthRequest="120" HorizontalOptions="Center"/>
    </HorizontalStackLayout>

    <WebView x:Name="Pagina" 
             VerticalOptions="FillAndExpand"  <!-- 填充垂直方向剩余所有空间 -->
             HeightRequest="0" />             <!-- 清除固定高度，让WebView自适应内容 -->
</VerticalStackLayout>

VerticalOptions="FillAndExpand"会让WebView占据按钮下方的全部可用区域，HeightRequest="0"避免固定高度截断内容。

3. 平台端滚动适配（可选） #

如果在Android等平台仍出现滚动异常，可以开启WebView的滚动开关：

protected override void OnNavigatedTo(NavigatedToEventArgs args)
{
    base.OnNavigatedTo(args);
    string string1 = "你的HTML内容";
    string string2 = "另一个HTML内容";
    Pagina.Source = new HtmlWebViewSource { Html = string1 };

#if ANDROID
    Pagina.EnableScrolling = true;
#endif
}

为什么之前的操作无效？ #

• 超大HeightRequest：WebView会尝试渲染指定高度，但如果HTML自身限制了内容高度，WebView无法扩展，导致内容被截断。
• 嵌套ScrollView：WebView内部自带滚动控件，外层ScrollView会和它争夺触摸事件，最终导致滚动失效。

内容的提问来源于stack exchange，提问作者ItsProbablySomethingStupid