QT绘制wifi图标

动机:

工作当中需要进行wifi图标的绘制，在老项目当中，发现是使用贴图的方式实现，想了想，WiFi图标的绘制并不是很难，于是打算自己实现。

思路:

首先，我们需要绘制wifi图标的圆点以及弧线，信号弱时，代表强信号的弧线应当变为深色，也就是说，我们需要一个参数来表示信号强弱，并且根据参数进行圆点以及弧线的绘制。

QT主要函数:

setBrush(QColor(color)):设置绘制图形的填充颜色。

drawEllipse:绘制圆。

arcTo：绘制扇形。

addEllipse：绘制内圆，与扇形配合，达到wifi圆弧的效果。

translate:绘图原点转换。

运行截图:

 

代码实现:

头文件:

#ifndef CWIFIWIDGET_H
#define CWIFIWIDGET_H

#include <QWidget>
class QPainter;
class QPoint;

class CwifiWidget : public QWidget
{
    Q_OBJECT
public:
    CwifiWidget();
    ~CwifiWidget();
    virtual void paintEvent(QPaintEvent *event) override;
public slots:
    void simulateData();

private:
    void drawCircle(QPainter& painter,int radius,QRgb color);             //绘制圆
    void drawWifiArc(QPainter& painter,int arcHight,int arcwidth,int startAngle,int lenAngle,QRgb color);     //绘制圆弧
    void setQualityValue(int value);
private:
    int wifiQuality=0;
    QTimer *m_timer;
};

#endif // CWIFIWIDGET_H

源文件:

#include "cwifiwidget.h"
#include <QTimer>
#include <QPainter>
#include <QRectF>
#include <QPainterPath>


CwifiWidget::CwifiWidget()
{
    update();
    m_timer=new QTimer(this);
    connect(m_timer,&QTimer::timeout,this,&CwifiWidget::simulateData);
    m_timer->start(1000);
}

CwifiWidget::~CwifiWidget()
{
    delete m_timer;
}

void CwifiWidget::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    //painter.save();
    int arcLength=height()/10.5;

    //设置反走样
    painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);

    //画笔原点转换
    painter.translate(width()*0.5, height()*0.9);

    //根据信号强度绘制
    if(4==wifiQuality)
    {
        drawCircle(painter,height()/15,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.3,45,90,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.5,45,90,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.7,45,90,qRgb(255, 255, 255));
    }else if(3==wifiQuality){
        drawCircle(painter,height()/15,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.3,45,90,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.5,45,90,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.7,45,90,qRgb(100, 100, 100));
    }else if(2==wifiQuality){
        drawCircle(painter,height()/15,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.3,45,90,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.5,45,90,qRgb(100, 100, 100));
        drawWifiArc(painter,arcLength,height()*0.7,45,90,qRgb(100, 100, 100));
    }else if(1==wifiQuality){
        drawCircle(painter,height()/15,qRgb(255, 255, 255));
        drawWifiArc(painter,arcLength,height()*0.3,45,90,qRgb(100, 100, 100));
        drawWifiArc(painter,arcLength,height()*0.5,45,90,qRgb(100, 100, 100));
        drawWifiArc(painter,arcLength,height()*0.7,45,90,qRgb(100, 100, 100));
    }else if(0==wifiQuality){
        drawCircle(painter,height()/15,qRgb(100, 100, 100));
        drawWifiArc(painter,arcLength,height()*0.3,45,90,qRgb(100, 100, 100));
        drawWifiArc(painter,arcLength,height()*0.5,45,90,qRgb(100, 100, 100));
        drawWifiArc(painter,arcLength,height()*0.7,45,90,qRgb(100, 100, 100));
    }
}

void CwifiWidget::simulateData()
{
    static int tmpValue=0;
    if(tmpValue<=4){
        setQualityValue(tmpValue);
        ++tmpValue;
    }else{
        tmpValue=0;
    }
}

void CwifiWidget::drawCircle(QPainter &painter, int radius,QRgb color)
{
    painter.setPen(Qt::NoPen);
    painter.setBrush(QColor(color));
    painter.drawEllipse(QPoint(0,0),radius,radius);
}

void CwifiWidget::drawWifiArc(QPainter &painter, int arcHight,int radius, int startAngle, int lenAngle,QRgb color)
{
    painter.save();
    QRect rect(-radius, -radius, radius << 1, radius << 1);
    QPainterPath path;
    path.arcTo(rect, startAngle, lenAngle);

    QPainterPath subPath;
    subPath.addEllipse(rect.adjusted(arcHight, arcHight, -arcHight, -arcHight));

    // path为扇形 subPath为椭圆
    path -= subPath;
    painter.setPen(Qt::NoPen);

    painter.setBrush(QColor(color));
    painter.drawPath(path);
    painter.restore();
}

void CwifiWidget::setQualityValue(int value)
{
    wifiQuality=value;
    update();
}