Qt实现不规则按钮之自绘圆盘式按钮

一、简述

在上一篇文章中我们讲述了如何实现不规则按钮( Qt简述如何实现不规则按钮),其中提到了另外一种方法就是自绘,今天就此谈一谈如何自绘实现一个圆盘式的按钮。下面先看一张效果图。

这里写图片描述

二、代码之路

其实实现很简单,就是通过Qt的QPainterPath来实现圆弧式按钮的绘制,然后通过鼠标事件实现点击效果及点击信号的发送。因为正常QPushButton或者QToolButton是自己发送clicked或者pressed、release等信号的,既然我们是通过自绘而不是继承button,那这些信号都需要我们自己来实现了,如果不知道具体按钮的某个信号是如何发送的或者是何时发送的可以参考源码。下面直接上代码。

CustomButton.h

#pragma once

#include <QtWidgets/QWidget>


class CustomButton : public QWidget
{
	Q_OBJECT

public:
	CustomButton(QWidget* parent = NULL);
	// 设置弧长及半径;
	void setRadiusValue(int radius);
	void setArcLength(int arcLength);
private:
	// 初始化按钮;
	void initButton();
	// 绘制按钮; 
	void paintEvent(QPaintEvent *);
	// 添加圆弧;
	void addArc(qreal startAngle, qreal angleLength, QRgb color);

	// 鼠标事件;
	void mouseMoveEvent(QMouseEvent *event);
	void mousePressEvent(QMouseEvent *event);
	void mouseReleaseEvent(QMouseEvent *event);

	// 鼠标离开事件;
	void leaveEvent(QEvent *event);

signals:
	// 鼠标点击;
	void signalButtonClicked(int buttonId);
	// 鼠标松开;
	void signalButtonReleased(int buttonId);

private:
	// 弧长及半径;
	int m_radius, m_arcLength;
	// 圆弧路径;
	QList<QPainterPath> m_arcPathList;
	QList<QPainterPath> m_textPathList;
	// 圆弧颜色;
	QList<QBrush> m_colorList;
	// 当前鼠标按钮/进入 按钮的索引;
	int m_pressIndex, m_enterIndex;
	// 鼠标事件标志位;
	bool m_isMousePressed;
	bool m_isMouseEntered;
	
};


可以自己设置颜色,文字,圆弧角度,圆弧按钮数目,圆弧长度等,也可以以此为基础进行拓展。以上就完成了不规则按钮之自绘圆盘式按钮。其他类似不规则的按钮也可以通过自绘实现,没有做不到,只有想不到。

这里写图片描述 这里写图片描述

加群下载源码 311750285

参考

Qt之图形(绘制漂亮的圆弧)

©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页