在 QWebView 内呈现的 PDF.JS 中正确切换到深色主题答案

【问题标题】：Properly switch to dark theme in PDF.JS rendered inside a QWebView在 QWebView 内呈现的 PDF.JS 中正确切换到深色主题
【发布时间】：2022-08-20 20:54:05
【问题描述】：

我正在尝试使用PDF.JS 在QWebEngineView 内显示PDF，代码如下

from PyQt6.QtCore import QUrl
from PyQt6.QtWidgets import QApplication
from PyQt6.QtWebEngineWidgets import QWebEngineView
import sys

class Window():
    def __init__(self):
        super().__init__()
        pdfjs = \"file:///D:/CODING RELATED/Projects/Import Manager/pdfjs-2.15.349-legacy-dist/web/viewer.html\"

        pdf_url = QUrl().fromUserInput(f\"{pdfjs}?file=file:///C:/Users/Eliaz/Desktop/qt5cadaquesPart14.pdf\")

        self.preview = QWebEngineView()
        self.preview.load(pdf_url)
        self.preview.show()

app = QApplication(sys.argv)
window = Window()
sys.exit(app.exec())

正如您在图像中看到的，它使用的是浅色主题，但我需要将其更改为深色主题。深入研究这个问题，我发现了这些相关问题#12290 和#14059。我发现我应该设置viewerCssTheme属性/属性2它将主题设置为暗模式。由于没有这么长时间使用QWebEngineView 的经验，我不知道如何在 PyQt6 中以编程方式设置其值。别无选择，我只是在行上硬编码了它的值175和20450.

这是对值进行硬编码后的样子：

如您所见，它切换到了深色主题，但带有一些不好的副作用，比如scroll-thumb 仍然是白色的应该是深灰色。

更新：关于scroll-thumb 仍然是白色的，我在开发工具页面上注意到scrollbar-color 被某些东西覆盖了。我怀疑 Qt 是覆盖它的，但我不完全确定。

我的问题：这是我如何正确切换到在 QWebEngineView 内呈现的 PDF.JS 中的深色主题吗？

您在 Firefox 中使用深色主题这一事实完全无关紧要，因为 Qt 使用它自己的web引擎，它也是基于Chromium的。
抱歉，我认为它以某种方式连接/相关。

标签： pdf.js pyqt6 qwebengineview

【解决方案1】：

思考了一会儿，我决定坚持使用硬编码的方式，因为我找不到告诉Qt的WebView改变我喜欢的主题的方法。此外，对这些值进行硬编码似乎只会产生一个可见的小缺陷，即白色滚动条轨迹。为了解决这个问题，我只需要在web\viewer.css 中添加这些行：

这些覆盖滚动条的拇指和轨道颜色，您可以了解有关此here 的更多信息。

#viewerContainer::-webkit-scrollbar {
  width: 11px;
}

#viewerContainer::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-color)
}

#viewerContainer::-webkit-scrollbar-track {
  background: var(--scrollbar-bg-color);
}

【讨论】：