如何在pyqt5中添加底部阴影效果？答案

【问题标题】：How to add bottom shadow effect in pyqt5?如何在pyqt5中添加底部阴影效果？
【发布时间】：2021-02-24 02:56:16
【问题描述】：

我一直在计划像这样设计我的 QPushButton

有什么建议吗？

【问题讨论】：

【解决方案1】：

在样式表中设置比background-color 到border-bottom 稍暗的颜色。

import sys
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *

class Button(QPushButton):

    def __init__(self, color, *args, **kwargs):
        super().__init__(*args, **kwargs)
        color = QColor(color)
        shadow = color.darker(115).name()
        text = 'black' if color.value() > 186 else 'white'
        self.setStyleSheet(f'''
        QPushButton {{
            color: {text};
            background-color: {color.name()};
            padding: 12px;
            border-radius: 4px;
            border-bottom: 4px solid {shadow};
        }}''')


if __name__ == '__main__':
    app = QApplication(sys.argv)
    window = QScrollArea(widgetResizable=True)
    w = QWidget(); window.setWidget(w)
    grid = QGridLayout(w, spacing=40)
    colors = QColor.colorNames(); colors.remove('transparent')
    for i, v in enumerate(colors):
        grid.addWidget(Button(v, f'{v} button'.title()), *divmod(i, 7))
    window.show()
    sys.exit(app.exec_())

【讨论】：

小心。上面的代码即使在按下时也总是显示相同的，并且不同按钮状态的视觉反馈非常很重要。我建议仅使用 :pressed 伪状态指定边框：QPushButton:!pressed {{border-bottom: 4px solid {shadow};}}; QPushButton:pressed {{border-top: 4px solid {shadow};}}