Qt使用QPainter实现自定义圆形进度条
一、项目介绍
本文介绍利用QPainter实现自定义圆形进度条。
二、项目基本配置
新建一个Qt案例,项目名称为“RoundprogressbarTest”,基类选择“QWidget”,点击选中创建UI界面复选框,完成项目创建。
三、UI界面设置
UI界面如下:

为简单起见,这里只设计两个控件:
| 序号 | 名称 | 类型 | 属性 |
|---|---|---|---|
| ① | pushButton | QPushButton | text:Start |
| ② | gridLayout | QGridLayout | / |
四、主程序实现
4.1 roundprogressbar.h和roundprogressbar.cpp
由于roundprogressbar.h和roundprogressbar.cpp代码量较大,这里不进行展示,仅作简要说明。
函数如下:
//设置初始角度,顺时针逆时针
void setdefault(int,bool);
//设置外圈宽度
void setOutterBarWidth(float);
//设置内圈宽度
void setInnerBarWidth(float);
//设置范围
void setRange(float, float);
//设置当前值
void setValue(float);
//设置外圈颜色
void setOutterColor(const QColor&);
//设置内圈渐变色
void setInnerColor(const QColor&,const QColor&);
void setInnerColor(const QColor&);
//设置默认文字颜色
void setDefaultTextColor(const QColor&);
//设置控制命令
void setControlFlags(int);
//设置显示数字精度
void setPrecision(int);
在构造函数中进行了如下初始化设定:
//设置初始角度,顺时针逆时针
setdefault(90,true);
//设置默认外圈宽度
setOutterBarWidth(18);
//设置默认内圈宽度
setInnerBarWidth(16);
//设置默认范围
setRange(0,100);
//设置默认值
setValue(75);
//设置外圈颜色
setOutterColor(QColor(233,248,248));
//设置默认渐变色
setInnerColor(QColor(49, 177, 190),QColor(133, 243, 244));
//设置默认文字颜色
setDefaultTextColor(QColor(49,177,190));
//设置默认精度
setPrecision(0);
//设置内圈默认文字样式
setInnerDefaultTextStyle(RoundProgressBar::percent);
设置初始化角度为90度,顺时针,设置外圈宽度为18,内圈宽度为18;设置默认范围为0-100,设置默认值为75,设置外圈颜色、渐变色、文本颜色和默认精度为0(无小数)设置内圈文字样式为percent(百分比样式)。
4.2 widget.h头文件
头文件中引入roundprogressbar.h头文件,按钮点击槽函数和定时器对应的槽函数、timer对象和bar1对象:
private slots:
void setText();
void on_pushButton_clicked();
private:
RoundProgressBar* bar1;
QTimer timer;
int i=0;
4.3 widget.cpp源文件
源文件中在构造函数中定义圆形进度条和定时器,将定时器timeout信号和槽函数setText连接:
//*********************** RoundProgressBar ************************
bar1=new RoundProgressBar(this);
bar1->setOutterBarWidth(20);
bar1->setInnerBarWidth(20);
bar1->setValue(0);//设置默认值为0
bar1->setControlFlags(RoundProgressBar::all);
ui->gridLayout->addWidget(bar1,0,0);
//计时
timer.setInterval(100);//设置计时间隔为0.1s
connect(&timer,&QTimer::timeout,this,&Widget::setText);
在析构函数中停止定时器:
Widget::~Widget()
{
if(timer.isActive())
timer.stop();
delete ui;
}
两个槽函数定义如下:
//点击
void Widget::on_pushButton_clicked()
{
timer.start();
}
void Widget::setText()
{
bar1->setValue(i++);
bar1->repaint();
if(i>100) //100停止
{
timer.stop();
}
}
五、效果演示
完整效果如下:

到此这篇关于Qt使用QPainter实现自定义圆形进度条的文章就介绍到这了,更多相关Qt自定义进度条内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
Qt实现导出QTableWidget/QTableView数据
这篇文章主要介绍了在Qt中实现将QTableWidget或者QTableView中的数据直接导出的示例代码,文中的示例代码讲解详细,感兴趣的可以了解一下2022-01-01
C++运行时获取类型信息的type_info类与bad_typeid异常
这篇文章主要介绍了C++运行时获取类型信息的type_info类与bad_typeid异常,是C++入门学习中的基础知识,需要的朋友可以参考下2016-01-01
使用Qt/C++实现WGS84,高德GCJ-02与百度BD-09坐标系间相互转化
这篇文章主要为大家详细介绍了如何使用Qt实现WGS84、高德GCJ-02与百度BD-09坐标系间相互转化,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下2023-07-07
C++中SetConsoleCursorPosition()移动光标函数的用法大全
这篇文章主要介绍了C++中SetConsoleCursorPosition()移动光标函数的用法大全,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2021-03-03


最新评论