1.产生一个电池的类 Battery
要定义的的东西:
double minValue; //最小值
double maxValue; //最大值
double value; //目标电量
double alarmValue; //电池电量警戒值
double step; //每次移动的步长
int borderWidth; //边框粗细
int borderRadius; //边框圆角角度
int bgRadius; //背景进度圆角角度
int headRadius; //头部圆角角度
QColor borderColorStart; //边框渐变开始颜色
QColor borderColorEnd; //边框渐变结束颜色
QColor alarmColorStart; //电池低电量时的渐变开始颜色
QColor alarmColorEnd; //电池低电量时的渐变结束颜色
QColor normalColorStart; //电池正常电量时的渐变开始颜色
QColor normalColorEnd; //电池正常电量时的渐变结束颜色
2.自己定义一个东西来控制电池的 value 的大小
电池类的自定义函数
//设置范围值
void setRange(double minValue, double maxValue);
void setRange(int minValue, int maxValue);
//设置最大最小值
void setMinValue(double minValue);
void setMaxValue(double maxValue);
//设置电池电量值
void setValue(double value);
void setValue(int value);
//设置电池电量警戒值
void setAlarmValue(double alarmValue);
void setAlarmValue(int alarmValue);
//设置步长
void setStep(double step);
void setStep(int step);
//设置边框粗细
void setBorderWidth(int borderWidth);
//设置边框圆角角度
void setBorderRadius(int borderRadius);
//设置背景圆角角度
void setBgRadius(int bgRadius);
//设置头部圆角角度
void setHeadRadius(int headRadius);
//设置边框渐变颜色
void setBorderColorStart(const QColor &borderColorStart);
void setBorderColorEnd(const QColor &borderColorEnd);
//设置电池电量报警时的渐变颜色
void setAlarmColorStart(const QColor &alarmColorStart);
void setAlarmColorEnd(const QColor &alarmColorEnd);
//设置电池电量正常时的渐变颜色
void setNormalColorStart(const QColor &normalColorStart);
void setNormalColorEnd(const QColor &normalColorEnd);
3.定义一个ui ->设置界面
一个 widget 界面
一个滑动控件
4.只要你有一个widget 的界面 就可以 安装 电池的显示,
电池的显示 是可以自己定义边框的粗细。
电池的大小 是一根据边框的大小来决定的。
5.所有的代码:
battery.h
#ifndef BATTERY_H
#define BATTERY_H
/**
* 电池电量控件
* 1. 可设置电池电量,动态切换电池电量变化。
* 2. 可设置电池电量警戒值。
* 3. 可设置电池电量正常颜色和报警颜色。
* 4. 可设置边框渐变颜色。
* 5. 可设置电量变化时每次移动的步长。
* 6. 可设置边框圆角角度、背景进度圆角角度、头部圆角角度。
*/
#include <QWidget>
#ifdef quc
class Q_DECL_EXPORT Battery : public QWidget
#else
class Battery : public QWidget
#endif
{
Q_OBJECT
Q_PROPERTY(double minValue READ getMinValue WRITE setMinValue)
Q_PROPERTY(double maxValue READ getMaxValue WRITE setMaxValue)
Q_PROPERTY(double value READ getValue WRITE setValue)
Q_PROPERTY(double alarmValue READ getAlarmValue WRITE setAlarmValue)
Q_PROPERTY(double step READ getStep WRITE setStep)
Q_PROPERTY(int borderWidth READ getBorderWidth WRITE setBorderWidth)
Q_PROPERTY(int borderRadius READ getBorderRadius WRITE setBorderRadius)
Q_PROPERTY(int bgRadius READ getBgRadius WRITE setBgRadius)
Q_PROPERTY(int headRadius READ getHeadRadius WRITE setHeadRadius)
Q_PROPERTY(QColor borderColorStart READ getBorderColorStart WRITE setBorderColorStart)
Q_PROPERTY(QColor borderColorEnd READ getBorderColorEnd WRITE setBorderColorEnd)
Q_PROPERTY(QColor alarmColorStart READ getAlarmColorStart WRITE setAlarmColorStart)
Q_PROPERTY(QColor alarmColorEnd READ getAlarmColorEnd WRITE setAlarmColorEnd)
Q_PROPERTY(QColor normalColorStart READ getNormalColorStart WRITE setNormalColorStart)
Q_PROPERTY(QColor normalColorEnd READ getNormalColorEnd WRITE setNormalColorEnd)
public:
explicit Battery(QWidget *parent = 0);
~Battery();
protected:
void paintEvent(QPaintEvent *);
void drawBorder(QPainter *painter);
void drawBg(QPainter *painter);
void drawHead(QPainter *painter);
private slots:
void updateValue();
private:
double minValue; //最小值
double maxValue; //最大值
double value; //目标电量
double alarmValue; //电池电量警戒值
double step; //每次移动的步长
int borderWidth; //边框粗细
int borderRadius; //边框圆角角度
int bgRadius; //背景进度圆角角度
int headRadius; //头部圆角角度
QColor borderColorStart; //边框渐变开始颜色
QColor borderColorEnd; //边框渐变结束颜色
QColor alarmColorStart; //电池低电量时的渐变开始颜色
QColor alarmColorEnd; //电池低电量时的渐变结束颜色
QColor normalColorStart; //电池正常电量时的渐变开始颜色
QColor normalColorEnd; //电池正常电量时的渐变结束颜色
bool isForward; //是否往前移
double currentValue; //当前电量
QRectF batteryRect; //电池主体区域
QTimer *timer; //绘制定时器
public:
double getMinValue() const;
double getMaxValue() const;
double getValue() const;
double getAlarmValue() const;
double getStep() const;
int getBorderWidth() const;
int getBorderRadius() const;
int getBgRadius() const;
int getHeadRadius() const;
QColor getBorderColorStart() const;
QColor getBorderColorEnd() const;
QColor getAlarmColorStart() const;
QColor getAlarmColorEnd() const;
QColor getNormalColorStart() const;
QColor getNormalColorEnd() const;
QSize sizeHint() const;
QSize minimumSizeHint() const;
public Q_SLOTS:
//设置范围值
void setRange(double minValue, double maxValue);
void setRange(int minValue, int maxValue);
//设置最大最小值
void setMinValue(double minValue);
void setMaxValue(double maxValue);
//设置电池电量值
void setValue(double value);
void setValue(int value);
//设置电池电量警戒值
void setAlarmValue(double alarmValue);
void setAlarmValue(int alarmValue);
//设置步长
void setStep(double step);
void setStep(int step);
//设置边框粗细
void setBorderWidth(int borderWidth);
//设置边框圆角角度
void setBorderRadius(int borderRadius);
//设置背景圆角角度
void setBgRadius(int bgRadius);
//设置头部圆角角度
void setHeadRadius(int headRadius);
//设置边框渐变颜色
void setBorderColorStart(const QColor &borderColorStart);
void setBorderColorEnd(const QColor &borderColorEnd);
//设置电池电量报警时的渐变颜色
void setAlarmColorStart(const QColor &alarmColorStart);
void setAlarmColorEnd(const QColor &alarmColorEnd);
//设置电池电量正常时的渐变颜色
void setNormalColorStart(const QColor &normalColorStart);
void setNormalColorEnd(const QColor &normalColorEnd);
Q_SIGNALS:
void valueChanged(double value);
};
#endif // BATTERY_H
widget.h
#ifndef WIDGET_H
#define WIDGET_H
#include <QWidget>
namespace Ui {
class Widget;
}
class Widget : public QWidget
{
Q_OBJECT
public:
explicit Widget(QWidget *parent = 0);
~Widget();
private:
Ui::Widget *ui;
private slots:
void initForm();//初始化滑动的链条,来控制电池的电量
};
#endif // WIDGET_H
battery.cpp
#pragma execution_character_set("utf-8")
#include "battery.h"
#include "qpainter.h"
#include "qtimer.h"
#include "qdebug.h"
Battery::Battery(QWidget *parent) : QWidget(parent)
{
// double minValue; //最小值
// double maxValue; //最大值
// double value; //目标电量
// double alarmValue; //电池电量警戒值
// double step; //每次移动的步长
// int borderWidth; //边框粗细
// int borderRadius; //边框圆角角度
// int bgRadius; //背景进度圆角角度
// int headRadius; //头部圆角角度
// QColor borderColorStart; //边框渐变开始颜色
// QColor borderColorEnd; //边框渐变结束颜色
// QColor alarmColorStart; //电池低电量时的渐变开始颜色
// QColor alarmColorEnd; //电池低电量时的渐变结束颜色
// QColor normalColorStart; //电池正常电量时的渐变开始颜色
// QColor normalColorEnd; //电池正常电量时的渐变结束颜色
// bool isForward; //是否往前移
// double currentValue; //当前电量
// QRectF batteryRect; //电池主体区域
// QTimer *timer; //绘制定时器
//下面的值可以自己定义 !!
minValue = 0; //最小值
maxValue = 100; //最大值
value = 0; //目标电量
alarmValue = 30; //电池电量警戒值
step = 0.5; //每次移动的步长
borderWidth = 2; //边框粗细
borderRadius = 4; //边框圆角角度
bgRadius = 2; //背景进度圆角角度
headRadius = 1; //头部圆角角度
borderColorStart = QColor(100, 100, 100);//边框渐变开始颜色
borderColorEnd = QColor(80, 80, 80);//边框渐变结束颜色
alarmColorStart = QColor(250, 118, 113); //电池低电量时的渐变开始颜色
alarmColorEnd = QColor(204, 38, 38); //电池低电量时的渐变结束颜色
normalColorStart = QColor(50, 205, 51);//电池正常电量时的渐变开始颜色
normalColorEnd = QColor(60, 179, 133);//电池正常电量时的渐变结束颜色
isForward = false;//是否往前移
currentValue = 0;//当前电量
timer = new QTimer(this);//绘制定时器
timer->setInterval(10);
connect(timer, SIGNAL(timeout()), this, SLOT(updateValue()));
}
Battery::~Battery()
{
if (timer->isActive()) {
timer->stop();
}
}
void Battery::paintEvent(QPaintEvent *)
{
//绘制准备工作,启用反锯齿
QPainter painter(this);
painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);
//绘制边框
drawBorder(&painter);
//绘制背景
drawBg(&painter);
//绘制头部
drawHead(&painter);
}
void Battery::drawBorder(QPainter *painter)
{
painter->save();
double headWidth = width() / 15;
//headWidth=headWidth/2;//控制头部的大小
double batteryWidth = width() - headWidth;
//batteryWidth=batteryWidth/2;
//绘制电池边框
QPointF topLeft(borderWidth, borderWidth);
QPointF bottomRight(batteryWidth, height() - borderWidth);
batteryRect = QRectF(topLeft, bottomRight);
painter->setPen(QPen(borderColorStart, borderWidth));
painter->setBrush(Qt::NoBrush);
painter->drawRoundedRect(batteryRect, borderRadius, borderRadius);
painter->restore();
}
void Battery::drawBg(QPainter *painter)
{
if (value == minValue) {
return;
}
painter->save();
QLinearGradient batteryGradient(QPointF(0, 0), QPointF(0, height()));
if (currentValue <= alarmValue) {
batteryGradient.setColorAt(0.0, alarmColorStart);
batteryGradient.setColorAt(1.0, alarmColorEnd);
} else {
batteryGradient.setColorAt(0.0, normalColorStart);
batteryGradient.setColorAt(1.0, normalColorEnd);
}
int margin = qMin(width(), height()) / 40;
//margin=margin/2;
double unit = (batteryRect.width() - (margin * 2)) / 100;
//unit=unit/2;
double width = currentValue * unit;
//width=width/4;
QPointF topLeft(batteryRect.topLeft().x() + margin, batteryRect.topLeft().y() + margin);
QPointF bottomRight(width + margin + borderWidth, batteryRect.bottomRight().y() - margin);
QRectF rect(topLeft, bottomRight);
painter->setPen(Qt::NoPen);
painter->setBrush(batteryGradient);
painter->drawRoundedRect(rect, bgRadius, bgRadius);
painter->restore();
}
void Battery::drawHead(QPainter *painter)
{
painter->save();
QPointF headRectTopLeft(batteryRect.topRight().x(), height() / 3);
QPointF headRectBottomRight(width(), height() - height() / 3);
QRectF headRect(headRectTopLeft, headRectBottomRight);
QLinearGradient headRectGradient(headRect.topLeft(), headRect.bottomLeft());
headRectGradient.setColorAt(0.0, borderColorStart);
headRectGradient.setColorAt(1.0, borderColorEnd);
painter->setPen(Qt::NoPen);
painter->setBrush(headRectGradient);
painter->drawRoundedRect(headRect, headRadius, headRadius);
painter->restore();
}
void Battery::updateValue()
{
if (isForward) {
currentValue -= step;
if (currentValue <= value) {
currentValue = value;
timer->stop();
}
} else {
currentValue += step;
if (currentValue >= value) {
currentValue = value;
timer->stop();
}
}
this->update();
}
double Battery::getMinValue() const
{
return this->minValue;
}
double Battery::getMaxValue() const
{
return this->maxValue;
}
double Battery::getValue() const
{
return this->value;
}
double Battery::getAlarmValue() const
{
return this->alarmValue;
}
double Battery::getStep() const
{
return this->step;
}
int Battery::getBorderWidth() const
{
return this->borderWidth;
}
int Battery::getBorderRadius() const
{
return this->borderRadius;
}
int Battery::getBgRadius() const
{
return this->bgRadius;
}
int Battery::getHeadRadius() const
{
return this->headRadius;
}
QColor Battery::getBorderColorStart() const
{
return this->borderColorStart;
}
QColor Battery::getBorderColorEnd() const
{
return this->borderColorEnd;
}
QColor Battery::getAlarmColorStart() const
{
return this->alarmColorStart;
}
QColor Battery::getAlarmColorEnd() const
{
return this->alarmColorEnd;
}
QColor Battery::getNormalColorStart() const
{
return this->normalColorStart;
}
QColor Battery::getNormalColorEnd() const
{
return this->normalColorEnd;
}
QSize Battery::sizeHint() const
{
return QSize(150, 80);
}
QSize Battery::minimumSizeHint() const
{
return QSize(30, 10);
}
void Battery::setRange(double minValue, double maxValue)
{
//如果最小值大于或者等于最大值则不设置
if (minValue >= maxValue) {
return;
}
this->minValue = minValue;
this->maxValue = maxValue;
//如果目标值不在范围值内,则重新设置目标值
//值小于最小值则取最小值,大于最大值则取最大值
if (value < minValue) {
setValue(minValue);
} else if (value > maxValue) {
setValue(maxValue);
}
this->update();
}
void Battery::setRange(int minValue, int maxValue)
{
setRange((double)minValue, (double)maxValue);
}
void Battery::setMinValue(double minValue)
{
setRange(minValue, maxValue);
}
void Battery::setMaxValue(double maxValue)
{
setRange(minValue, maxValue);
}
void Battery::setValue(double value)
{
//值和当前值一致则无需处理
if (value == this->value) {
return;
}
//值小于最小值则取最小值,大于最大值则取最大值
if (value < minValue) {
value = minValue;
} else if (value > maxValue) {
value = maxValue;
}
if (value > currentValue) {
isForward = false;
} else if (value < currentValue) {
isForward = true;
} else {
this->value = value;
this->update();
return;
}
this->value = value;
this->update();
emit valueChanged(value);
timer->stop();
timer->start();
}
void Battery::setValue(int value)
{
setValue((double)value);
}
void Battery::setAlarmValue(double alarmValue)
{
if (this->alarmValue != alarmValue) {
this->alarmValue = alarmValue;
this->update();
}
}
void Battery::setAlarmValue(int alarmValue)
{
setAlarmValue((double)alarmValue);
}
void Battery::setStep(double step)
{
if (this->step != step) {
this->step = step;
this->update();
}
}
void Battery::setStep(int step)
{
setStep((double)step);
}
void Battery::setBorderWidth(int borderWidth)
{
if (this->borderWidth != borderWidth) {
this->borderWidth = borderWidth;
this->update();
}
}
void Battery::setBorderRadius(int borderRadius)
{
if (this->borderRadius != borderRadius) {
this->borderRadius = borderRadius;
this->update();
}
}
void Battery::setBgRadius(int bgRadius)
{
if (this->bgRadius != bgRadius) {
this->bgRadius = bgRadius;
this->update();
}
}
void Battery::setHeadRadius(int headRadius)
{
if (this->headRadius != headRadius) {
this->headRadius = headRadius;
this->update();
}
}
void Battery::setBorderColorStart(const QColor &borderColorStart)
{
if (this->borderColorStart != borderColorStart) {
this->borderColorStart = borderColorStart;
this->update();
}
}
void Battery::setBorderColorEnd(const QColor &borderColorEnd)
{
if (this->borderColorEnd != borderColorEnd) {
this->borderColorEnd = borderColorEnd;
this->update();
}
}
void Battery::setAlarmColorStart(const QColor &alarmColorStart)
{
if (this->alarmColorStart != alarmColorStart) {
this->alarmColorStart = alarmColorStart;
this->update();
}
}
void Battery::setAlarmColorEnd(const QColor &alarmColorEnd)
{
if (this->alarmColorEnd != alarmColorEnd) {
this->alarmColorEnd = alarmColorEnd;
this->update();
}
}
void Battery::setNormalColorStart(const QColor &normalColorStart)
{
if (this->normalColorStart != normalColorStart) {
this->normalColorStart = normalColorStart;
this->update();
}
}
void Battery::setNormalColorEnd(const QColor &normalColorEnd)
{
if (this->normalColorEnd != normalColorEnd) {
this->normalColorEnd = normalColorEnd;
this->update();
}
}
main.cpp
#include "widget.h"
#include <QApplication>
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
Widget w;
w.show();
return a.exec();
}
widget.cpp
#include "widget.h"
#include "ui_widget.h"
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
this->initForm();
}
Widget::~Widget()
{
delete ui;
}
void Widget::initForm()
{
connect(ui->shezhi,SIGNAL(valueChanged(int)),ui->widget,SLOT(setValue(int)));
ui->shezhi->setValue(20);
}
成果:
补充的知识:
Qt提供了一个绝妙的属性系统。跟那些由编译器提供的属性差不多。然而,作为一个独立于编译器和平台的库,Qt不依赖于非标准的编译特性,比如__property 或[property]。Qt可以在任何平台上的标准编译器下编译。Qt属性系统基于元数据对象系统--就是那个提供了对象内置信号和槽通讯机制的家伙。
Q_PROPERTY()是一个宏,用来在一个类中声明一个属性property,由于该宏是qt特有的,需要用moc进行编译,故必须继承于QObject类。
Q_PROPERTY(type name
READ getFunction
[WRITE setFunction]
[RESET resetFunction]
[NOTIFY notifySignal]
[DESIGNABLE bool]
[SCRIPTABLE bool]
[STORED bool]
[USER bool]
[CONSTANT]
[FINAL])
下面是一些典型的声明属性的示例:
Q_PROPERTY(double minValue READ getMinValue WRITE setMinValue)
Q_PROPERTY(bool animation READ getAnimation WRITE setAnimation)
Q_PROPERTY(QColor barColor READ getBarColor WRITE setBarColor)
- 一个属性的行为就像类的数据成员,但是它还具有附加的特性,这些特性可以被元数据对象系统操作。这些特性是:
需要一个READ访问器函数。用于读属性的值。理想情况下,有一个不变的函数用于此目的,并且它必须返回属性的类型的值或指针或引用。例如,QWidget::focus是一个只读的属性,它对应一个读函数:QWidget::hasFocus()。 - 一个可选的WRITE访问器函数。它用于设置属性的值。它必须返回空并且至少具有一个参数,参数是属性类型的值或指针或引用。例如:QWidget::enabled具有WRITE函数QWidget::setEnable()。只读属性不需要写函数。例如,QWidget::focus没有对应的写函数。
- 一个可选的RESET函数。用于设置属性的值到它的默认值。例如:QWidget::cursor具有典型的READ和WRITE函数,QWidget::cursor()和QWidget::setCursor(),并且它也具有一个RESET函数,QWidget::unsetCursor()。RESET函数必须返回void并且不带有任何参数。
- 一个可选的NOTIFY信号。如果被定义了,信号将在属性的值改变时发出。信号必须带有一个参数,这个参数的类型必须与属性相同;参数保存的是属性的新值。
- 一个DESIGNABLE变量表明此属性是否在界面设计器的属性编辑器中出现。大多数属性是可见的,除了为这个变量传入true或false,你还可以指定一个bool型的成员函数。
- SCRIPTABLE变量表明这个属性是否可以被一个脚本引擎操作(默认是true)。你也可以赋予它true或false或bool型函数。
- STORED变量表明了属性是否被认为是独立存在还是依赖于其它的值而存在。它也表明是否在保存对象状态时保存此属性的值。大多数属性都是需要保存的,但是,如QWidget::minimumWidth()就是不被保存的,因为它的值是从另一个属性QWidget::minimumSize()得来的。
- USER变量表明属性是否被设计为面向用户的或用户可修改的类属性。通常,每个类只有一个USER属性。例如,QAbstractButton::checked是按钮类的用户可修改属性。注意QItemDelegate获取和设置widget的USER属性。
- CONSTANT的出现表明属性的值是不变的。对于一个object实例,常量属性的READ方法在每次被调用时必须返回相同的值。此常量值可能在不同的object实例中不相同。一个常量属性不能具有WRITE方法或NOYIFY信号。
- FINAL变量的出现表明属性不能被派生类所重写。有些情况下,这可以用于效率优化,但不是被moc强制的。程序员必须永远注意不能重写一个FINAL属性。
READ,WRITE和RESET函数都可以被继承。它们也可以是虚函数。当它们在被多重继承中被继承时,它们必须出现在第一个被继承的类中。
属性的类型可以是被QVariant支持的所有类型,也可以是用户定义的类型。在下面的例子中,类QDate被当作用户自定义类型。
Q_PROPERTY(QDate data READ getDate WRITE setDate)
因为QDate是用户定义的,你必须包含<QDate>头文件。
对于QMap,QList和QValueList属性,属性的值是一个QVariant,它包含整个list或map。注意Q_PROPERTY字符串不能包含逗号,因为逗号会划分宏的参数。因此,你必须使用QMap作为属性的类型而不是QMap<QString,QVariant>。为了保持一致性,也需要用QList和QValueList而不是QList<QVariant>和QValueList<QVariant>。