我正在尝试使用QML和WebEngineView组件为Ubuntu 14.04创建一个简单的桌面Web浏览器。该应用程序将在具有触摸板的设备上工作,因此最好使WebEngineView内部显示的内容可以轻松。
我尝试这样做,但它不起作用:
...
WebEngineView {
id: webView
url: "http://google.com"
width: parent.width
height: winternet.height-navigationBar.height-iStatusBar.height-iBackButton.height
anchors.top: navigationBar.bottom
MouseArea {
anchors.fill: parent
drag.target: parent.data
}
onLinkHovered: {
webView.url = hoveredUrl
}
}
...
如果您有任何想法或经验,请提供帮助!
答案 0 :(得分:2)
我想让WebEngineView也可以轻弹。我决定,最好使用Flickable来做。但天真的做法是:
...
Flickable {
WebEngineView {...}
}
...
无效。
进一步的调查使我Qt based Web browser for embedded touch devices。我已经在我的电脑上试过了。看起来它正在做我想要的,但它太复杂了,GPL许可证使它对任何用途都没用。
经过一些实验后,我发现如果Flickable.contentHeight和Flickable.contentWidth至少与WebEngineView显示的网页的实际大小相匹配,则会轻弹。 Flickable的这些属性可能具有比实际页面大小更大的值。在这种情况下,您将能够轻松浏览页面内容。如果Flickable.contentHeight和/或Flickable.contentWidth小于页面大小,您仍然可以轻弹。无论你是否想要这种方式,都由你来决定。)
因此,最终获得显示的实际页面大小并将其设置为Flickable.contentHeight和Flickable.contentWidth。我在这里给你一个简短的故事:没有办法用WebEngineView API获得所需的值(或者至少我没有在Qt 5.7 / 5.8文档中找到任何东西)。但我偶然发现了this answer on SO。使用这个答案我已经设法使一切工作:
...
Item {
Layout.fillHeight: true
Layout.fillWidth: true
Flickable {
id: flick
anchors.fill: parent
WebEngineView {
anchors.fill: parent
id: webView
}
}
webView.onLoadingChanged: {
if (webView.loadProgress == 100) {
webView.runJavaScript(
"document.documentElement.scrollHeight;",
function (i_actualPageHeight) {
flick.contentHeight = Math.max (
i_actualPageHeight, flick.height);
})
webView.runJavaScript(
"document.documentElement.scrollWidth;",
function (i_actualPageWidth) {
flick.contentWidth = Math.max (
i_actualPageWidth, flick.width);
})
}
}
}
...
上面提到的代码可能需要一些调整,但它几乎是我所拥有的代码的副本。
UPD 1:我发现这不是最终解决方案,因为在加载新页面之后由于某种原因,document.documentElement.scrollWidth可能无法重置并保持与上一页相同。
UPD 2:我已经解决了上述问题,但解决方案有点难看:将WebEngineView.onLoadingChanged中的Flickable.contentWidth重置为Flickable.width。将Flickable.contentWidth设置为0将导致加载后内容的高度不合适。
我做的另一项调整是取消了100%加载状态的要求。