使用@font face 时在 QtWebEngine 中忽略 Google 字体 (ttf)
Posted
技术标签:
【中文标题】使用@font face 时在 QtWebEngine 中忽略 Google 字体 (ttf)【英文标题】：Google Fonts (ttf) being ignored in QtWebEngine when using @font face 【发布时间】：2019-03-16 00:24:14 【问题描述】：我正在尝试将谷歌字体加载到我的 pyqt5 QtWebEngine 应用程序中。
应用程序加载一个带有 css 样式的本地 html 文件。我使用字体加载ttf文件如下：
@font-face
font-family: "Work Sans";
src: url("C:\Users\Godwin\TIAT\fonts\WorkSans-Regular.ttf") format('truetype');
body
font-family: "Work Sans";
background-color: #eef0f2;
加载 html 文件时似乎忽略了字体。
有人可以帮忙吗。
编辑强文本
这是我的完整html
@font-face
font-family: Work Sans;
src: url("Work_Sans/WorkSans-Regular.ttf")
div
font-family: Work Sans;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" type="text/css" href="style.css"/>
<title>Document</title>
</head>
<style>
</style>
<body>
<div>
Hello World
</div>
</body>
</html>这些适用于 chrome、firefox 和 chrome，但如果我像这样使用 qtwebengine
from PyQt5 import QtCore, QtGui, QtWidgets, QtWebEngineWidgets
if __name__ == "__main__":
import sys
sys.argv.append("--disable-web-security")
app = QtWidgets.QApplication(sys.argv)
wnd = QtWidgets.QWidget()
genVLayout = QtWidgets.QVBoxLayout(wnd)
verticalLayout_7 = QtWidgets.QVBoxLayout()
webEngineViewGen = QtWebEngineWidgets.QWebEngineView(wnd)
webEngineViewGen.setUrl(QtCore.QUrl("about:blank"))
fh = open('main.html','r')
html = fh.read()
webEngineViewGen.setHtml(html)
verticalLayout_7.addWidget(webEngineViewGen)
genVLayout.addLayout(verticalLayout_7)
wnd.show()
sys.exit(app.exec_())
它的字体不起作用
【问题讨论】：
它是否也适用于 qtwebengine，我看到它适用于其他浏览器，但不知何故无法在 qtWebEngine 上运行 让我检查一下我的其余代码 我已经编辑了我的帖子，html适用于浏览器但不适用于pyqt 查看我的解决方案 【参考方案1】：如果您使用的是setHtml()，那么正如docs 所示，外部资源将与您作为第二个参数传递的网址相关：
void QWebEngineView::setHtml(const QString &html, const QUrl &baseUrl = QUrl())
[...]
HTML 文档中引用的样式表或图像等外部对象相对于 baseUrl 定位。
[...]
所以在你的情况下，解决方案是：
import os
from PyQt5 import QtCore, QtGui, QtWidgets, QtWebEngineWidgets
if __name__ == "__main__":
import sys
sys.argv.append("--disable-web-security")
app = QtWidgets.QApplication(sys.argv)
wnd = QtWidgets.QWidget()
genVLayout = QtWidgets.QVBoxLayout(wnd)
verticalLayout_7 = QtWidgets.QVBoxLayout()
webEngineViewGen = QtWebEngineWidgets.QWebEngineView(wnd)
webEngineViewGen.setUrl(QtCore.QUrl("about:blank"))
with open('main.html','r') as fh:
html = fh.read()
current_dir = os.path.dirname(os.path.abspath(__file__))
url = QtCore.QUrl.fromLocalFile(os.path.join(current_dir, "main.html"))
webEngineViewGen.setHtml(html, url)
verticalLayout_7.addWidget(webEngineViewGen)
genVLayout.addLayout(verticalLayout_7)
wnd.show()
sys.exit(app.exec_())
或者干脆使用load()方法：
import os
from PyQt5 import QtCore, QtGui, QtWidgets, QtWebEngineWidgets
if __name__ == "__main__":
import sys
sys.argv.append("--disable-web-security")
app = QtWidgets.QApplication(sys.argv)
wnd = QtWidgets.QWidget()
genVLayout = QtWidgets.QVBoxLayout(wnd)
verticalLayout_7 = QtWidgets.QVBoxLayout()
webEngineViewGen = QtWebEngineWidgets.QWebEngineView(wnd)
webEngineViewGen.setUrl(QtCore.QUrl("about:blank"))
current_dir = os.path.dirname(os.path.abspath(__file__))
url = QtCore.QUrl.fromLocalFile(os.path.join(current_dir, "main.html"))
webEngineViewGen.load(url)
verticalLayout_7.addWidget(webEngineViewGen)
genVLayout.addLayout(verticalLayout_7)
wnd.show()
sys.exit(app.exec_())
【讨论】：
感谢 eyllanesc。让我试试这个 完美运行。谢谢！以上是关于使用@font face 时在 QtWebEngine 中忽略 Google 字体 (ttf)的主要内容，如果未能解决你的问题，请参考以下文章