Question

PyQt5有一个称为WebView的组件（不是QWebView！），可以使用loadHtml方法加载html。如果传递给该方法的字符串包含对外部字体的引用，则该字体将被忽略。

在qml文件中加载html：

mainWebView.loadHtml(article); // mainWebView is the id of a WebView component

在py文件中准备html字符串：

with open(CSS_PATH, 'r') as f:
    css_style = f.read()

article = "<html><head><style>%s</style><title>%s</title></head><body>%s</body></html>" % (css_style, article['title'], article['body'])

在css文件中获取并设置外部字体：

@font-face {
  font-family: "AvenirNext";
  src: url("AvenirNext-Regular.ttf") format("truetype");
}

html *
{
   color: #e6e6e6;
   font-family: "AvenirNext";
   background-color: #494845;
   margin-left: 14px;
}

如果我在CSS中使用font-family: "Courier New"，则字体可以正常工作。仅当我从文件夹中获得某种字体时，它才会被忽略。为了以防万一，我将ttf文件既放在应用程序的根文件夹中，又放在css文件所在的文件夹中。链接到组件： https://doc.qt.io/qt-5.11/qml-qtwebview-webview.html

Answer 1

根据docs：

无效负载Html（字符串html，URL baseUrl）


将指定的html内容加载到Web视图。

此方法提供了url属性的下层替代方案，   通过URL引用HTML页面。

外部对象，例如HTML中引用的样式表或图像   文档应该相对于baseUrl 定位。例如，如果html   是从http://www.example.com/documents/overview.html检索的，   这是基本网址，然后是用相对网址引用的图片，   diagram.png，应位于http://www.example.com/documents/diagram.png

.css，.js或任何外部元素将相对于baseUrl，后者是setHtml()的第二个参数。因此解决方案是将应该位于本地文件夹中的虚拟文件的URL传递给它。

main.py

import os
import sys
from PyQt5 import QtCore, QtGui, QtQml

if __name__ == '__main__':
    app = QtGui.QGuiApplication(sys.argv)
    engine = QtQml.QQmlApplicationEngine()
    dir_path = os.path.dirname(os.path.abspath(__file__))
    CSS_PATH = "styles.css"
    with open(os.path.join(dir_path, CSS_PATH), 'r') as f:
        css_style = f.read()
        article = {"title": "title1", "body": "<H1> Body"}
        article = "<html><head><style>%s</style><title>%s</title></head><body>%s</body></html>" % (css_style, article['title'], article['body'])
        baseUrl = QtCore.QUrl.fromLocalFile(os.path.join(dir_path, 'index.html'))
        engine.rootContext().setContextProperty("article", article)
        engine.rootContext().setContextProperty("baseUrl", baseUrl)
    qml_filename = os.path.join(dir_path, 'main.qml')
    engine.load(QtCore.QUrl.fromLocalFile(qml_filename))
    if not engine.rootObjects():
        sys.exit(-1)
    sys.exit(app.exec_())

main.qml

import QtQuick 2.5
import QtQuick.Window 2.2
import QtWebView 1.1

Window {
    visible: true
    width: 640
    height: 480
    WebView{
        id: mainWebView
        anchors.fill: parent
    }
    Component.onCompleted: mainWebView.loadHtml(article, baseUrl)
}

我假设该项目具有以下结构：

|-- AvenirNext-Regular.ttf
|-- main.py
|-- main.qml
`-- styles.css

PyQt5的WebView组件会忽略自定义字体

1 个答案:

无效负载Html（字符串html，URL baseUrl）