PyQt5 中堆叠小部件的透明背景
Transparent Background for Stacked Widgets in PyQt5
我一直在尝试使用 PyQt5 创建一个基本时钟。时钟部分工作,时钟后面的背景图像加载,但我无法使文本背景透明。
我已经尝试了下面列出的两种方式,也尝试了 self.lbl1.setStyleSheet("background-color: rgba(255, 255, 255, 10);")
,但在这两种情况下我得到了相同的结果。
如果我设置 layout.setCurrentIndex(0)
,我会看到背景 jpeg 在那里,所以加载正常。
关于我需要做些什么才能拥有透明的分层小部件有什么想法吗?
试着把它弄清楚一点
这是我得到的
这就是我想要的
import sys
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtCore import *
class Example(QWidget):
def __init__(self):
super().__init__()
self.initUI()
def initUI(self):
layout = QStackedLayout()
#Background area test
self.background = QLabel(self)
self.background.setPixmap(QPixmap("image.jpeg"))
self.background.show()
#self.background.setAutoFillBackground(True)
#Setup text area for clock
newfont = QFont("Consolas",120, QFont.Bold)
self.lbl1 = QLabel()
self.lbl1.setAlignment(Qt.AlignCenter)
self.lbl1.setFont(newfont)
self.lbl1.setWindowFlags(Qt.FramelessWindowHint)
self.lbl1.setAttribute(Qt.WA_TranslucentBackground)
#Timer to refresh clock
timer = QTimer(self)
timer.timeout.connect(self.showTime)
timer.start(1000)
self.showTime()
#layout area for widgets
layout.addWidget(self.background)
layout.addWidget(self.lbl1)
layout.setCurrentIndex(1)
self.setLayout(layout)
self.setGeometry(300,300,250,150)
self.show()
def showTime(self):
time = QTime.currentTime()
text = time.toString('hh:mm')
if (time.second() % 2) == 0:
text = text[:2] + ' ' + text[3:]
self.lbl1.setText(text)
if __name__ == '__main__':
app = QApplication(sys.argv)
ex = Example()
sys.exit(app.exec_())
问题是使用 QStackedWidget,根据文档:
The QStackedLayout class provides a stack of widgets where only one
widget is visible at a time.
它告诉我们只有一个小部件是可见的。这就是图像未显示的原因,为了强制使它们可见,我们使用:
layout.setStackingMode(QStackedLayout.StackAll)
获得以下内容:
如文档中所述,QStackedlayout 用于一次显示一个小部件。你的情况我觉得没必要,你可以只用一个标签和任何布局,你可以用styleSheet来放置背景图片,下面的代码就是我说的。
class Example(QWidget):
def __init__(self, parent=None):
QWidget.__init__(self, parent=parent)
self.initUI()
def initUI(self):
self.setGeometry(300,300,250,150)
layout = QVBoxLayout(self)
layout.setContentsMargins(0, 0, 0, 0)
newfont = QFont("Consolas",120, QFont.Bold)
self.lbl1 = QLabel(self)
self.lbl1.setStyleSheet("border-image:url(image.jpeg);")
self.lbl1.setAlignment(Qt.AlignCenter)
self.lbl1.setFont(newfont)
layout.addWidget(self.lbl1)
#Timer to refresh clock
timer = QTimer(self)
timer.timeout.connect(self.showTime)
timer.start(1000)
self.showTime()
self.show()
def showTime(self):
time = QTime.currentTime()
text = time.toString('hh:mm')
if (time.second() % 2) == 0:
text = text[:2] + ' ' + text[3:]
self.lbl1.setText(text)
下图显示了新的输出:
我一直在尝试使用 PyQt5 创建一个基本时钟。时钟部分工作,时钟后面的背景图像加载,但我无法使文本背景透明。
我已经尝试了下面列出的两种方式,也尝试了 self.lbl1.setStyleSheet("background-color: rgba(255, 255, 255, 10);")
,但在这两种情况下我得到了相同的结果。
如果我设置 layout.setCurrentIndex(0)
,我会看到背景 jpeg 在那里,所以加载正常。
关于我需要做些什么才能拥有透明的分层小部件有什么想法吗?
试着把它弄清楚一点
这是我得到的
这就是我想要的
import sys
from PyQt5.QtWidgets import *
from PyQt5.QtGui import *
from PyQt5.QtCore import *
class Example(QWidget):
def __init__(self):
super().__init__()
self.initUI()
def initUI(self):
layout = QStackedLayout()
#Background area test
self.background = QLabel(self)
self.background.setPixmap(QPixmap("image.jpeg"))
self.background.show()
#self.background.setAutoFillBackground(True)
#Setup text area for clock
newfont = QFont("Consolas",120, QFont.Bold)
self.lbl1 = QLabel()
self.lbl1.setAlignment(Qt.AlignCenter)
self.lbl1.setFont(newfont)
self.lbl1.setWindowFlags(Qt.FramelessWindowHint)
self.lbl1.setAttribute(Qt.WA_TranslucentBackground)
#Timer to refresh clock
timer = QTimer(self)
timer.timeout.connect(self.showTime)
timer.start(1000)
self.showTime()
#layout area for widgets
layout.addWidget(self.background)
layout.addWidget(self.lbl1)
layout.setCurrentIndex(1)
self.setLayout(layout)
self.setGeometry(300,300,250,150)
self.show()
def showTime(self):
time = QTime.currentTime()
text = time.toString('hh:mm')
if (time.second() % 2) == 0:
text = text[:2] + ' ' + text[3:]
self.lbl1.setText(text)
if __name__ == '__main__':
app = QApplication(sys.argv)
ex = Example()
sys.exit(app.exec_())
问题是使用 QStackedWidget,根据文档:
The QStackedLayout class provides a stack of widgets where only one widget is visible at a time.
它告诉我们只有一个小部件是可见的。这就是图像未显示的原因,为了强制使它们可见,我们使用:
layout.setStackingMode(QStackedLayout.StackAll)
获得以下内容:
如文档中所述,QStackedlayout 用于一次显示一个小部件。你的情况我觉得没必要,你可以只用一个标签和任何布局,你可以用styleSheet来放置背景图片,下面的代码就是我说的。
class Example(QWidget):
def __init__(self, parent=None):
QWidget.__init__(self, parent=parent)
self.initUI()
def initUI(self):
self.setGeometry(300,300,250,150)
layout = QVBoxLayout(self)
layout.setContentsMargins(0, 0, 0, 0)
newfont = QFont("Consolas",120, QFont.Bold)
self.lbl1 = QLabel(self)
self.lbl1.setStyleSheet("border-image:url(image.jpeg);")
self.lbl1.setAlignment(Qt.AlignCenter)
self.lbl1.setFont(newfont)
layout.addWidget(self.lbl1)
#Timer to refresh clock
timer = QTimer(self)
timer.timeout.connect(self.showTime)
timer.start(1000)
self.showTime()
self.show()
def showTime(self):
time = QTime.currentTime()
text = time.toString('hh:mm')
if (time.second() % 2) == 0:
text = text[:2] + ' ' + text[3:]
self.lbl1.setText(text)
下图显示了新的输出: