WPF - 设置浏览器滚动条的宽度

Question

我正在尝试更改 WebBrowser 控件的滚动条的宽度。

我尝试按照this 的答案更改其ScrollViewer，如下所示：

<WebBrowser Grid.Row="0" Grid.RowSpan="5" Grid.Column="0" Height="1993" Margin="3,3,0,3">
    <ScrollViewer>
        <ScrollViewer.Resources>
            <sys:Double x:Key="{x:Static SystemParameters.VerticalScrollBarWidthKey}">100</sys:Double>
        </ScrollViewer.Resources>
    </ScrollViewer>
</WebBrowser>

但我收到The type 'WebBrowser' does not support direct content 错误。

我知道WPF 的WebBrowser 只是WinForm's 的包装，所以我猜这就是我收到此错误的原因。

我不想使用外部组件，例如CefSharp 或其他浏览器。

是否可以使用原生的WebBrowser？

谢谢

Answer 1

WPF WebBrowser 控件实际上将本机 WebBrowser ActiveX 控件包装在其中。这并没有真正改变答案，但很高兴知道。

正如 Reza Aghaei 已经评论的那样，滚动条不是 WPF 控件，不能像 WPF 应用程序中的其他滚动条一样进行修改。但是，我认为您不能使用 CSS 更改 IE 滚动条的宽度，因为样式仅限于着色：

scrollbar-base-color: #C0C0C0;
scrollbar-base-color: #C0C0C0;
scrollbar-3dlight-color: #C0C0C0;
scrollbar-highlight-color: #C0C0C0;
/* etc */

我想到了两种可能性。要么使用可让您自定义滚动条的 jQuery 滚动条库之一，要么使用本机 WPF ScrollBar。

使用 jQuery 滚动条会迫使您在用户访问的每个页面上注入 javascript，并且当网站已经使用自定义 jQuery 滚动条时，它可能会变得非常脏。这可能值得研究，但我怀疑它在实践中是否足够好。

这就是我要尝试的方法

1. 通过为每个页面的正文赋予overflow:hidden 样式来隐藏滚动条。您还可以在 WindowsFormsHost 控件中托管 Windows 窗体 WebBrowser，这样您就可以访问 ScrollBarsEnabled 属性（很遗憾，该属性在 WPF 控件中不可用）。
2. 将 WPF ScrollBar 添加到您的 WebBrowser 控件旁边，并按照您想要的方式设置它的样式。这实际上可以是UserControl，以确保未来的可重用性。
3. 将 WPF ScrollBar 的最大值设置为 HTML 页面的 ScrollHeight。
4. 订阅 WPF ScrollBar 的滚动事件。将滚动事件发送到 HTML 页面。您还需要以其他方式保持 WPF ScrollBar 与使用触摸、鼠标滚轮或键盘按钮发生的滚动同步。

我现在不在电脑上，所以对数字 3 和 4 无能为力，但应该可以。同样，您可能会遇到使用一些自定义滚动 (jQuery) 的页面，但希望这能让您入门。