在 pyqt 中淡化选项卡更改

Question

我有一个包含两个 tabs.i 的页面，想在我更改 tabs.Is 时添加淡入效果吗？

import sys
from PyQt4.QtCore import QTimeLine
from PyQt4.QtGui import *

class FaderWidget(QWidget):

    def __init__(self, old_widget, new_widget):

        QWidget.__init__(self, new_widget)

        self.old_pixmap = QPixmap(new_widget.size())
        old_widget.render(self.old_pixmap)
        self.pixmap_opacity = 1.0

        self.timeline = QTimeLine()
        self.timeline.valueChanged.connect(self.animate)
        self.timeline.finished.connect(self.close)
        self.timeline.setDuration(333)
        self.timeline.start()

        self.resize(new_widget.size())
        self.show()

    def paintEvent(self, event):

        painter = QPainter()
        painter.begin(self)
        painter.setOpacity(self.pixmap_opacity)
        painter.drawPixmap(0, 0, self.old_pixmap)
        painter.end()

    def animate(self, value):

        self.pixmap_opacity = 1.0 - value
        self.repaint()

class StackedWidget(QStackedWidget):

    def __init__(self, parent = None):
        QStackedWidget.__init__(self, parent)

    def setCurrentIndex(self, index):
        self.fader_widget = FaderWidget(self.currentWidget(), self.widget(index))
        QStackedWidget.setCurrentIndex(self, index)

    def setPage1(self):
        self.setCurrentIndex(0)

    def setPage2(self):
        self.setCurrentIndex(1)


if __name__ == "__main__":

    app = QApplication(sys.argv)

    window = QWidget()

    stack = StackedWidget()
    stack.addWidget(QCalendarWidget())
    editor = QTextEdit()
    editor.setPlainText("Hello world! "*100)
    stack.addWidget(editor)

    page1Button = QPushButton("Page 1")
    page2Button = QPushButton("Page 2")
    page1Button.clicked.connect(stack.setPage1)
    page2Button.clicked.connect(stack.setPage2)

    layout = QGridLayout(window)
    layout.addWidget(stack, 0, 0, 1, 2)
    layout.addWidget(page1Button, 1, 0)
    layout.addWidget(page2Button, 1, 1)

    window.show()

    sys.exit(app.exec_())

这是显示一些淡入淡出效果的代码，但我从中一无所获，它是如何工作的以及如何在选项卡上实现。如果有人能帮助我在选项卡上实现它，那将是非常可观的。提前致谢。

Answer 1

使用与您显示的代码相同的逻辑，每个小部件都将放置在一个 QStackedWidget 中，其中一个将是将要显示的小部件，另一个将是 FaderWidget。

class FaderWidget(QWidget):
    def __init__(self, *args, **kwargs):
        QWidget.__init__(self, *args, **kwargs)
        self.pixmap_opacity = None
        self.timeline = QTimeLine(333, self)
        self.timeline.valueChanged.connect(self.animate)
        self.timeline.finished.connect(self.close)

    def start(self, old_widget, new_widget):
        self.pixmap_opacity = 1.0
        self.old_pixmap = QPixmap(new_widget.size())
        old_widget.render(self.old_pixmap)

        self.timeline.start()

        self.resize(new_widget.size())
        self.show()

    def paintEvent(self, event):
        if self.pixmap_opacity:
            QWidget.paintEvent(self, event)
            painter = QPainter(self)
            painter.setOpacity(self.pixmap_opacity)
            painter.drawPixmap(0, 0, self.old_pixmap)

    def animate(self, value):
        self.pixmap_opacity = 1.0 - value
        self.update()


class FaderTabWidget(QTabWidget):
    def __init__(self, parent=None):
        QTabWidget.__init__(self, parent)
        self.currentChanged.connect(self.onCurrentIndex)
        self.last = -1
        self.current = self.currentIndex()

    def onCurrentIndex(self, index):
        self.last = self.current
        self.current = self.currentIndex()
        if self.widget(self.last):
            self.widget(self.last).setCurrentIndex(1)
            old_widget = self.widget(self.last).widget(0)
            current_widget = self.widget(self.current).widget(0)
            fade = self.widget(self.current).widget(1)
            fade.start(old_widget, current_widget)

    def addTab(self, widget, text):
        stack = QStackedWidget(self)
        stack.addWidget(widget)
        fade = FaderWidget(self)
        fade.timeline.finished.connect(lambda: stack.setCurrentIndex(0))
        stack.addWidget(fade)
        stack.setCurrentIndex(0 if self.currentIndex() == -1 else 1)
        QTabWidget.addTab(self, stack, text)


if __name__ == "__main__":
    app = QApplication(sys.argv)

    window = QWidget()

    tabWidget = FaderTabWidget()
    tabWidget.addTab(QCalendarWidget(), "Tab1")
    editor = QTextEdit()
    editor.setPlainText("Hello world! " * 100)
    tabWidget.addTab(editor, "Tab2")
    layout = QVBoxLayout(window)
    layout.addWidget(tabWidget)
    window.show()
    sys.exit(app.exec_())

在 pyqt 中淡化选项卡更改

Fading on Tab Change in pyqt

qt

pyqt

pyqt4

python-3.x

pyqt5