pyqt5学习之动画效果

1.动画属性setPropertyName()值设置及其效果

1.1.位置变换动画

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"pos")  # b代表字节;pos代表位置缩写
        #法二
        # animation = QPropertyAnimation(btn, b'pos',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QPoint(0,0))  # 设置起始点
        animation.setEndValue((QPoint(300, 300)))  # 设置终点

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒


        # 4.启东动画
        animation.start()
        

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

    window = Window()
    window.show()


    sys.exit(app.exec_())
pos

1.2.尺寸变换动画

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"size")  # b代表字节;size代表位置缩写
        #法二
        # animation = QPropertyAnimation(btn, b'pos',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QSize(0,0))  # 设置起始点
        animation.setEndValue((QSize(300, 300)))  # 设置终点

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒


        # 4.启东动画
        animation.start()


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

    window = Window()
    window.show()


    sys.exit(app.exec_())
size

1.3.位置和尺寸同时变化

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"geometry")  # b代表字节;size代表位置缩写
        #法二
        # animation = QPropertyAnimation(btn, b'pos',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QRect(0,0, 0,0))  # 设置起始点;初始尺寸
        animation.setEndValue((QRect(300, 300,150,150)))  # 设置终点;终止尺寸

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒


        # 4.启东动画
        animation.start()


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

    window = Window()
    window.show()


    sys.exit(app.exec_())
geometry

1.4透明度变化

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"windowOpacity")  # b代表字节;size代表位置缩写
        #法二
        # animation = QPropertyAnimation(btn, b'pos',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(1)  # 设置起始点;初始尺寸
        animation.setKeyValueAt(0.5,0.5)
        animation.setEndValue(1)  # 设置终点;终止尺寸

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒


        # 4.启东动画
        animation.start()


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

    window = Window()
    window.show()


    sys.exit(app.exec_())
windowOpacity

2.动画曲线效果

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"pos")  # b代表字节;pos代表位置
        #法二
        # animation = QPropertyAnimation(btn, b'geometry',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QPoint(0, 0))
        animation.setEndValue(QPoint(300, 300))

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒

        animation.setEasingCurve(QEasingCurve.OutBounce)  # setEasingCurve动画曲线

        # 4.启东动画
        animation.start()


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

    window = Window()
    window.show()


    sys.exit(app.exec_())
setEasingCurve

3.父类QAbstractAnimation功能

3.1循环操作

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"pos")  # b代表字节;pos代表位置
        #法二
        # animation = QPropertyAnimation(btn, b'geometry',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QPoint(0, 0))
        animation.setEndValue(QPoint(300, 300))

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒
        animation.setLoopCount(5) #设置动画循环次数

        animation.setEasingCurve(QEasingCurve.OutBounce)  # setEasingCurve动画曲线

        # 4.启东动画
        animation.start()


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

    window = Window()
    window.show()


    sys.exit(app.exec_())
setLoopCount

3.2动画时长操作

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"pos")  # b代表字节;pos代表位置
        #法二
        # animation = QPropertyAnimation(btn, b'geometry',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QPoint(0, 0))
        animation.setEndValue(QPoint(300, 300))

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒
        animation.setLoopCount(5) #设置动画循环次数
        animation.setDuration(2000) # 设置单次动画时长

        animation.setEasingCurve(QEasingCurve.OutBounce)  # setEasingCurve动画曲线

        # 4.启东动画
        animation.start()


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

    window = Window()
    window.show()


    sys.exit(app.exec_())
setDuration

3.2动画方向

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"pos")  # b代表字节;pos代表位置
        #法二
        # animation = QPropertyAnimation(btn, b'geometry',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QPoint(0, 0))
        animation.setEndValue(QPoint(300, 300))

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒
        animation.setLoopCount(5) #设置动画循环次数
        animation.setDuration(2000) # 设置单次动画时长
        animation.setDirection(QAbstractAnimation.Backward) # 设置动画方向反着走
        animation.setEasingCurve(QEasingCurve.OutBounce)  # setEasingCurve动画曲线

        # 4.启东动画
        animation.start()


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

    window = Window()
    window.show()


    sys.exit(app.exec_())
setDirection

3.3动画状态

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"pos")  # b代表字节;pos代表位置
        #法二
        # animation = QPropertyAnimation(btn, b'geometry',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QPoint(0, 0))
        animation.setEndValue(QPoint(300, 300))

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒
        animation.setLoopCount(5) #设置动画循环次数
        animation.setDuration(2000) # 设置单次动画时长
        animation.setDirection(QAbstractAnimation.Backward) # 设置动画方向反着走
        animation.setEasingCurve(QEasingCurve.OutBounce)  # setEasingCurve动画曲线

        # 4.启东动画
        animation.start()
        def animation_operation():
            if animation.state() == QAbstractAnimation.Running:  # 判断动画是否运行
                animation.pause()
            elif animation.state() == QAbstractAnimation.Paused:  # 判断动画是否暂停
                animation.resume()
            elif animation.state() == QAbstractAnimation.Stopped:  # 判断动画是否停止
                animation.resume()

        btn.clicked.connect(animation_operation)

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

    window = Window()
    window.show()


    sys.exit(app.exec_())
animation.state()

3.3动画信号

三个信号:currentLoopChanged;finished;stateChanged

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super(Window, self).__init__()
        self.setWindowTitle('动画学习')
        self.resize(500,500)
        self.setup_ui()

    def setup_ui(self):
        btn = QPushButton('测试按钮',self)
        btn.move(100,100)
        btn.resize(200,200)
        btn.setStyleSheet('background-color: cyan;')

        # 1.创建一个动画对象,并且设置目标 属性

        # 有两种方式
        # 法一
        animation = QPropertyAnimation(self)
        animation.setTargetObject(btn)  # 设置动画对象
        animation.setPropertyName(b"pos")  # b代表字节;pos代表位置
        #法二
        # animation = QPropertyAnimation(btn, b'geometry',self)

        # 2.设置属性值: 开始 插值 结束
        animation.setStartValue(QPoint(0, 0))
        animation.setEndValue(QPoint(300, 300))

        # 3.动画时长
        animation.setDuration(3000)  # 时长单位毫秒
        animation.setLoopCount(5) #设置动画循环次数
        animation.setDuration(2000) # 设置单次动画时长
        animation.setDirection(QAbstractAnimation.Backward) # 设置动画方向反着走
        animation.setEasingCurve(QEasingCurve.OutBounce)  # setEasingCurve动画曲线

        # 4.启东动画
        animation.start()
        def animation_operation():
            if animation.state() == QAbstractAnimation.Running:  # 判断动画是否运行
                animation.pause()
            elif animation.state() == QAbstractAnimation.Paused:  # 判断动画是否暂停
                animation.resume()
            elif animation.state() == QAbstractAnimation.Stopped:  # 判断动画是否停止
                animation.resume()

        btn.clicked.connect(animation_operation)

        animation.currentLoopChanged.connect(lambda val: print("当前循环次数发生改变", val))
        # 循环次数发生变化发射信号
        animation.finished.connect(lambda: print("动画执行完毕"))
        # 循环结束发射信号
        animation.stateChanged.connect(lambda ns, os: print("状态发生改变", ns, os))
        # 循环状态发生变化发射信号

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

    window = Window()
    window.show()


    sys.exit(app.exec_())
View Code

3.4动画组

from PyQt5.Qt import *

class Window(QWidget):
    def __init__(self):
        super().__init__()
        self.setWindowTitle("动画组的学习")
        self.resize(800, 800)
        self.setup_ui()

    def setup_ui(self):
        red_btn = QPushButton("红色按钮", self)
        green_btn = QPushButton("绿色按钮", self)

        red_btn.resize(100, 100)
        green_btn.resize(100, 100)
        green_btn.move(150, 150)

        red_btn.setStyleSheet("""
            background-color: red;
        """)

        green_btn.setStyleSheet("""
                    background-color: green;
        """)


        # 动画设置
        animation = QPropertyAnimation(green_btn, b"pos", self)

        animation.setKeyValueAt(0, QPoint(150, 150))
        animation.setKeyValueAt(0.25, QPoint(550, 150))
        animation.setKeyValueAt(0.5, QPoint(550, 550))
        animation.setKeyValueAt(0.75, QPoint(150, 550))
        animation.setKeyValueAt(1, QPoint(150, 150))

        animation.setDuration(5000)
        # animation.setLoopCount(3)

        # animation.start()

        animation2 = QPropertyAnimation(red_btn, b"pos", self)

        animation2.setKeyValueAt(0, QPoint(0, 0))
        animation2.setKeyValueAt(0.25, QPoint(0, 700))
        animation2.setKeyValueAt(0.5, QPoint(700, 700))
        animation2.setKeyValueAt(0.75, QPoint(700, 0))
        animation2.setKeyValueAt(1, QPoint(0, 0))

        animation2.setDuration(5000)
        # animation2.setLoopCount(3)

        # animation2.start()

        animation_group1 = QSequentialAnimationGroup(self)  # 设置一个动画组
        # QSequentialAnimationGroup # 串行动画,多个动画挨个执行
        # QParallelAnimationGroup  # 并行动画,多个动画一块执行
        animation_group1.addAnimation(animation)  # 添加动画
        # animation_group1.addPause(5000) #串行动画暂时时间,串行

        pasuse_animation = QPauseAnimation()  #暂停动画
        pasuse_animation.setDuration(3000)  # 设置暂停时间
        animation_group1.addAnimation(pasuse_animation)  # 添加动画

        animation_group1.addAnimation(animation2)   # 添加动画
        animation_group1.start()  # 动画组开始执行

        red_btn.clicked.connect(animation_group1.pause)
        green_btn.clicked.connect(animation_group1.resume)


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

    window = Window()
    window.show()


    sys.exit(app.exec_())
View Code

QT的c++代码该为python代码只要把::改为.即可

原文地址:https://www.cnblogs.com/mosewumo/p/12470737.html