PyQt5之实现网易云播放唱片的动作

原文链接（本人写的啊，不算抄袭😎）：《ESP32-Arduino》LVGL之输入设备详解及实例(触摸屏,实体按键,编码器,多功能按键)

最近在做项目的播放器部分，在实现播放器像网易云那样点击播放唱片就会自动转动时遇到了问题，经过一套搜索引擎组合拳，终于是实现了该功能，成品如下
成品

闲话少说，上代码（代码部分做了大量的注释和个人理解，就不额外的解释了，因为我也是查大佬的案例过来的，所以理解仅供参考）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
"""唱片"""
class Cp_Comp_1(QObject):
    def __init__(self):
        super(Cp_Comp_1, self).__init__()
        # 加载图片资源
        pixmap_1 = QPixmap('./img/main_UI/play/play_cp_comp1.png')
        # 按比例设置图片大小
        scaledPixmap_1 = pixmap_1.scaled(150,150)
        # 初始化动作
        self.animation()
        # 定义QGraphicsPixmapItem
        self.pixmap_item_1 = QGraphicsPixmapItem(scaledPixmap_1)
        # 设置item旋转的中心点
        self.pixmap_item_1.setTransformOriginPoint(75,75)   # 中心
        # 设置图片的初始位置
        self.pixmap_item_1.setPos(0,30)

    def _set_rotation(self,degree):
        self.pixmap_item_1.setRotation(degree)    # 自身改变角度
    def animation(self):
        # 创建唱片360°无死角转动
        self.anim = QPropertyAnimation(self, b'rotation')   # 动画类型('rotation':转动,'pos':位置移动)
        self.anim.setDuration(40000)     # 运行的秒速(经测试，网易云用户每播放40s的歌曲，世界上就会有一张无辜唱片被转动一周)
        self.anim.setStartValue(0)  # 起始角度
        self.anim.setEndValue(360)  # 结束角度
        self.anim.setLoopCount(-1)  # 设置循环次数
    rotation = pyqtProperty(int, fset=_set_rotation)    # 属性动画改变自身数值(传递信号？？)

"""把柄"""
class Cp_Comp_2(QObject):
    def __init__(self):
        super(Cp_Comp_2, self).__init__()
        # 加载图片资源
        pixmap_2 = QPixmap('./img/main_UI/play/play_cp_comp2.png')
        # 按比例设置图片大小
        scaledPixmap_2 = pixmap_2.scaled(85,50)
        # 初始化动作
        self.animation()
        # 定义QGraphicsPixmapItem
        self.pixmap_item_2 = QGraphicsPixmapItem(scaledPixmap_2)
        # 设置item旋转的中心点
        self.pixmap_item_2.setTransformOriginPoint(0,0) # 左上角
        # 设置图片的初始位置
        self.pixmap_item_2.setPos(70,-12)

    def _set_rotation(self,degree):
        self.pixmap_item_2.setRotation(degree)    # 自身改变角度
    def animation(self):
        # 转轴转动的动画之开和关
        self.anim_1 = QPropertyAnimation(self, b'rotation')
        self.anim_1.setStartValue(0)  # 起始角度
        self.anim_1.setEndValue(30)  # 结束角度
        self.anim_1.setLoopCount(1)  # 设置循环次数
        self.anim_2 = QPropertyAnimation(self, b'rotation')
        self.anim_2.setStartValue(30)  # 起始角度
        self.anim_2.setEndValue(0)  # 结束角度
        self.anim_2.setLoopCount(1)  # 设置循环次数

    rotation = pyqtProperty(int, fset=_set_rotation)    # 属性动画改变自身数值(传递信号？？)
"""呈现动画的界面"""
"""因为QWeidget之类的是静态的，所以不能用来作为动画的呈现界面(是这样子理解的吧)"""
class View(QGraphicsView):
    def __init__(self):
        super(View, self).__init__()
        self.resize(180,220)
        self.setAttribute(Qt.WA_TranslucentBackground)  # 透明背景
        self.setWindowFlags(Qt.FramelessWindowHint) # 无边框
        self.setStyleSheet('background:cyan')
        self.initView()
    def initView(self):
        self.cp_comp_1 = Cp_Comp_1()
        self.cp_comp_2 = Cp_Comp_2()
        self.scene = QGraphicsScene(self)
        self.scene.setSceneRect(-10,0,170,210)    # 设置动画区域，在此区域内的控件会被动态刷新
        self.scene.addItem(self.cp_comp_1.pixmap_item_1)   # 往容器里面添加item
        self.scene.addItem(self.cp_comp_2.pixmap_item_2)   # 往容器里面添加item
        self.setScene(self.scene)       # 英文翻译:设置场景？？

        btn_1 = QPushButton('播放',self)
        btn_1.setGeometry(10,178,40,40)
        btn_1.clicked.connect(self.start)
        btn_2 = QPushButton('暂停',self)
        btn_2.setGeometry(138,178,40,40)
        btn_2.clicked.connect(self.stop)

    def start(self):
        self.cp_comp_1.anim.start()
        self.cp_comp_2.anim_1.start()
    def stop(self):
        self.cp_comp_1.anim.pause()
        self.cp_comp_2.anim_2.start()

app = QApplication(argv)
vi = View()
vi.show()
exit(app.exec_())

这里的动作演示仅是作为案例分享

项目进程：PyQt5初级实战项目-ABAB阅读器
参考文献：pyqt5 动画学习（四） 旋转动画