如何使 WebView 透明？

Question

考虑以下 QML 片段：

Page {
    WebView {
        id: webView
        anchors.fill: parent
    }
}

然后我尝试使用以下 JavaScript 在 WebView 中加载一些 HTML：

webView.loadHtml('<b>test</b>');

但是，WebView 具有白色背景：

（忽略文本太小这一事实。）

有没有办法使背景透明？

Answer 1

你可以试试 QtWebKit.experimental。如果您将 import QtWebKit.experimental 1.0 添加到 QML 文件中，您的 WebView 对象将可以访问实验属性：

import QtQuick 2.0
import QtWebKit.experimental 1.0
import Ubuntu.Components 0.1


MainView {
    id: main
    width: units.gu(100)
    height: units.gu(75)

    Page {
        id: mypage
        Rectangle {
            color: "green"
            anchors.fill: mypage
            WebView {
                id: webView
                anchors.fill: parent
                experimental.transparentBackground: true
            }
        }

        Component.onCompleted: webView.loadHtml("<p>Hello</p>");
    }
}

显然你会得到这样的警告：

警告：实验性 API 会因版本而异，甚至会被删除。你被警告了！