小白白也能学会的 PyQt 教程 —— 自定义组件 Switch Button
前言
最近在搞 Python 课程设计,想要搞一个好看的 UI,惊艳全班所有人。但打开 Qt Creator,Win7 风格的复古的按钮是在让我难以下手。
其次,我因为想要打造一个 Fluent UI 样式的设置页面,需要一个好看的 Switch Button,来用于设置界面部分设置项的转换,于是便决定动手写一个;然而 Qt 中貌似没有原生的 Switch Button 可供使用,因此边决定自己动手写一个 Switch Button。话不多说,先看效果:
观赏结束,整活开始🐶
思路讲解
接下来简单分析一下 Switch Button 需要实现的部分:
首先,Switch Button 有开关两个状态,可以在初始化时声明一个变量来获取按钮的状态。在代码中,使用了一个布尔类型的变量 _switch_on
来表示按钮的状态,初始状态为 False
,表示关闭状态。在点击按钮后,会切换状态并更新按钮的颜色。
接下来,我们需要绘制按钮的外观。在代码中,使用了 paintEvent
方法来实现按钮的绘制。该方法会被 Qt 框架自动调用,我们可以在其中使用 QPainter
对象进行绘制操作。
为了美观,绘制过程中,首先绘制了按钮的背景,使用了一个带圆角的矩形,并填充了浅灰色。然后根据按钮的状态绘制按钮的内部,使用了带圆角的矩形,并填充了相应的颜色。这样就完成了按钮的外观绘制。
当用户点击按钮时,mousePressEvent
方法会被调用。在该方法中,首先检查是否是鼠标左键按下,然后根据当前按钮的状态设置动画的方向,并启动动画。动画会逐渐改变按钮的位置,从而实现平滑的过渡效果。
在动画完成后,会调用 _on_animation_finished
方法。该方法会更新按钮的状态和颜色,并发射 switch_toggled
信号,通知应用程序按钮状态的变化。
最后,在主程序中创建了一个 QApplication
对象,实例化了 SwitchButton
类,并显示了按钮部件。这样就完成了整个 Switch Button 的实现。
代码部分
代码放在最后,大家在需要 Switch Button 的时候可以复制代码并进行简单修改,来打造自己的应用。
最后,如果这篇博客对你有帮助,那就点个赞👍呗!
版权声明: 本文为 InfoQ 作者【繁依Fanyi】的原创文章。
原文链接:【http://xie.infoq.cn/article/185537ca920d43aeb01599d34】。文章转载请联系作者。
评论