css - 如何调整 WebEngineView 中滚动条的宽度？

Question

我使用的是QML组件WebEngineView，观察到，WebEngineView默认实现了滚动条，但是没有改变滚动条宽度的接口(interface)。这在我无法使用滑动的用例中是必需的，我只能在 WebEngineView 的滚动条上使用鼠标拖动操作，以便查看长度在视口(viewport)区域之外的 Web 内容的所有隐藏部分。由于 WebEngineView 的滚动条大小(默认值非常小，只有 15pix)，因此很难准确地拖动到该区域并使用鼠标拖动。

有人可以建议如何自定义 WebEngineView 的滚动条吗？

或

我能找到webengine的源码，然后修改构建吗？

或

任何样式都可以应用到 WebEngineView 上吗？

我正在使用 Qt 5.6.2

Qt Webengine源码观察:QML Webengineview内部没有设置任何滚动条宽度，而是使用了可能是chrome的后端滚动条。

Answer 1

WebEngineView 使用来自 Chromium 后端的滚动条，没有 QML 或 C++ API 可以直接自定义它。但是 WebEngine 支持在 CSS 中更改这些滚动条样式，因此您唯一能做的就是安装一个用户脚本，它在所有 -webkit-scrollbar 上应用更大的宽度。

请参阅此相关示例:http://doc.qt.io/qt-5.10/qtwebengine-webenginewidgets-stylesheetbrowser-example.html

您的样式表可能如下所示:

::-webkit-scrollbar {
  width: 40px;
}