在Qt小部件中的黑暗主题?

时间:2018-01-15 03:59:48

标签: qt pyqt qt5 pyqt5 qstyle

背景

我正在构建一个PyQt5应用程序,我希望有一个黑暗的主题。以前我一直在使用Android开发,那里有一个可以为整个应用程序设置的黑暗主题

问题

Qt中是否内置了一个黑暗的主题(适用于应用程序中的所有小部件,这是跨平台的)?

5 个答案:

答案 0 :(得分:11)

不,但你可以使用我在大多数平台上看起来非常出色的Symantec VIP access(它的灵感来自KDE的Breeze主题,这是一个非常优雅的黑暗主题)。这是(很难)从优秀的stylesheets分叉出来的,我觉得在很多方面都有主题问题,因此我根据自己的需要进行了广泛的修改,并添加了一个轻松的主题。

简单使用

主题的样本在这里。要在PyQt5中使用它,只需将以下行添加到项目中:

import sys
from PyQt5.QtCore import QFile, QTextStream
from PyQt5.QtWidgets import QApplication
import breeze_resources

app = QApplication(sys.argv)
file = QFile(":/dark.qss")
file.open(QFile.ReadOnly | QFile.Text)
stream = QTextStream(file)
app.setStyleSheet(stream.readAll())

QDarkStylesheet

动态样式表切换

在回复评论时,调整样式表以动态使用浅色或深色样式表的最简单方法是将其包装在函数中。然后,您可以将该函数用作Qt信号的插槽(警告:我主要使用C ++开发,因此我的代码中可能存在信号/插槽机制的小错误。)

def toggle_stylesheet(path):
    '''
    Toggle the stylesheet to use the desired path in the Qt resource
    system (prefixed by `:/`) or generically (a path to a file on
    system).

    :path:      A full path to a resource or file on system
    '''

    # get the QApplication instance,  or crash if not set
    app = QApplication.instance()
    if app is None:
        raise RuntimeError("No Qt Application found.")

    file = QFile(path)
    file.open(QFile.ReadOnly | QFile.Text)
    stream = QTextStream(file)
    app.setStyleSheet(stream.readAll())

现在我们可以添加可以在信号/槽机制中使用此函数的通用应用程序逻辑(如果需要,使用lambda作为方便的包装器,以提供样式表转换器的路径):

# add logic for setting up application
app = QApplication(sys.argv)
# more logic for creating top-level widgets, application logic ...

parent = ...
light_btn = QPushButton("Toggle light.", parent)
light_btn.clicked.connect(lambda: toggle_stylesheet(":/light.qss"))

dark_btn = QPushButton("Toggle dark.", parent)
dark_btn.clicked.connect(lambda: toggle_stylesheet(":/dark.qss"))

# add to the layout, do other stuff
# ...

# end the Qt application
sys.exit(app.exec_())

这允许用户动态地将使用PyQt5(或使用C ++,Qt5中的类似逻辑)开发的应用程序的主题更改为浅色或深色主题。

免责声明:显然我是维护者。

答案 1 :(得分:3)

Qt中没有内置黑暗主题。但是您可以使用以下代码轻松地自己创建一个人:

from PyQt5.QtWidgets import QApplication
from PyQt5.QtGui import QPalette

app = QApplication([])
# Force the style to be the same on all OSs:
app.setStyle("Fusion")

# Now use a palette to switch to dark colors:
palette = QPalette()
palette.setColor(QPalette.Window, QColor(53, 53, 53))
palette.setColor(QPalette.WindowText, Qt.white)
palette.setColor(QPalette.Base, QColor(25, 25, 25))
palette.setColor(QPalette.AlternateBase, QColor(53, 53, 53))
palette.setColor(QPalette.ToolTipBase, Qt.white)
palette.setColor(QPalette.ToolTipText, Qt.white)
palette.setColor(QPalette.Text, Qt.white)
palette.setColor(QPalette.Button, QColor(53, 53, 53))
palette.setColor(QPalette.ButtonText, Qt.white)
palette.setColor(QPalette.BrightText, Qt.red)
palette.setColor(QPalette.Link, QColor(42, 130, 218))
palette.setColor(QPalette.Highlight, QColor(42, 130, 218))
palette.setColor(QPalette.HighlightedText, Qt.black)
app.setPalette(palette)

对此的好处是它不引入任何外部依赖关系。如果您对以上更改的外观感兴趣,我创建了一个示例PyQt5 app with a dark theme。这是屏幕截图:

Qt dark theme

答案 2 :(得分:1)

我试图将其应用于我的fbs based app,发现以下内容使我很容易通过将其应用于AppContext来设置应用样式

class AppContext(ApplicationContext):
    def run(self):
        self.main_window.show()
        return self.app.exec_()

    @cached_property
    def main_window(self):
        return MainWindow(self)

    if theme_selection == 'Dark':
        QApplication.setStyle("Fusion")
        #
        # # Now use a palette to switch to dark colors:
        dark_palette = QPalette()
        dark_palette.setColor(QPalette.Window, QColor(53, 53, 53))
        dark_palette.setColor(QPalette.WindowText, Qt.white)
        dark_palette.setColor(QPalette.Base, QColor(35, 35, 35))
        dark_palette.setColor(QPalette.AlternateBase, QColor(53, 53, 53))
        dark_palette.setColor(QPalette.ToolTipBase, QColor(25, 25, 25))
        dark_palette.setColor(QPalette.ToolTipText, Qt.white)
        dark_palette.setColor(QPalette.Text, Qt.white)
        dark_palette.setColor(QPalette.Button, QColor(53, 53, 53))
        dark_palette.setColor(QPalette.ButtonText, Qt.white)
        dark_palette.setColor(QPalette.BrightText, Qt.red)
        dark_palette.setColor(QPalette.Link, QColor(42, 130, 218))
        dark_palette.setColor(QPalette.Highlight, QColor(42, 130, 218))
        dark_palette.setColor(QPalette.HighlightedText, QColor(35, 35, 35))
        dark_palette.setColor(QPalette.Active, QPalette.Button, QColor(53, 53, 53))
        dark_palette.setColor(QPalette.Disabled, QPalette.ButtonText, Qt.darkGray)
        dark_palette.setColor(QPalette.Disabled, QPalette.WindowText, Qt.darkGray)
        dark_palette.setColor(QPalette.Disabled, QPalette.Text, Qt.darkGray)
        dark_palette.setColor(QPalette.Disabled, QPalette.Light, QColor(53, 53, 53))
        QApplication.setPalette(dark_palette)
    elif theme_selection == 'Light':
        QApplication.setStyle("")
        pass
    else:
        pass

您可以使用Qsettings来保存这种模式的首选项,并在启动时恢复。

if settings.contains("theme_selection"):
    # there is the key in QSettings
    print('Checking for theme preference in config')
    theme_selection = settings.value('theme_selection')
    print('Found theme_selection in config:' + theme_selection)
else:
    if not is_mac():
        print('theme_selection not found in config. Using default Darkmode')
        settings.setValue('theme_selection', 'Dark')
        theme_selection = settings.value('theme_selection')
    elif is_mac():
        print('theme_selection not found in config. Using default Lightmode')
        settings.setValue('theme_selection', 'Light')
        theme_selection = settings.value('theme_selection')
    pass

令人惊讶的是无法评论迈克尔·赫尔曼(Michael Herrmann)的帖子以表示感谢,但确实对此表示赞同。

之前: How it looked before dark pallete mode enabled

之后: With Pallete mode enabled

中间部分是xterm.js,这就是为什么它现在仍然是白色的,而不是QT风格的原因。

答案 3 :(得分:0)

在我的书签中创建。我不记得原始来源。

QApplication::setStyle(QStyleFactory::create("Fusion"));
QPalette p;
p = qApp->palette();
p.setColor(QPalette::Window, QColor(53,53,53));
p.setColor(QPalette::Button, QColor(53,53,53));
p.setColor(QPalette::Highlight, QColor(142,45,197));
p.setColor(QPalette::ButtonText, QColor(255,255,255));
qApp->setPalette(p);

P.S。如有必要,可以使用QSS进行调整。

答案 4 :(得分:0)

QT Creator提供了Dark主题。在Qt Creator应用程序中启用它 转到工具-> 选项-> TextEditor ->选择主题为深色

Steps

Choose dark theme