仪表盘

1.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QPainter>
#include <QtMath>
#include <QKeyEvent>
#include <QTimer>
namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();
protected:
    void paintEvent(QPaintEvent *event);
    void DrawSmallScale(QPainter&,int);
    void DrawCircle_line(QPainter& ,int );
    void Draw_jian_bian_Circle(QPainter &, int);
    void Draw_jian_bian_Circle1(QPainter &, int);
    void DrawCircle1(QPainter & ,int );
    void DrawDigital(QPainter & ,int );
    void DrawUnit(QPainter &, int );
    void DrawPointer(QPainter &, int);
    void DrawNum(QPainter &,int h);
    void keyPressEvent(QKeyEvent *event);
    void keyReleaseEvent(QKeyEvent *event);
private slots:
    void slot_speed_changed();
private:
    Ui::MainWindow *ui;
    int direction;
    QTimer * myTimer;
    int degRotate;
};

#endif // MAINWINDOW_H

#define M_PI		3.14159265358979323846

 

2.

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QDebug>
#pragma execution_character_set("utf-8")
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    setFixedSize(1280,800);

    this->setStyleSheet("#MainWindow{background-image:url(:/res/pic/background.png)}");
    myTimer=new QTimer(this);
    myTimer->start(50);
    direction=1;
    degRotate=0;
    connect(myTimer,&QTimer::timeout,this,&MainWindow::slot_speed_changed);
//1.画刻度:0-20-40---240   0-20中间5个空格
//0-40：10个空格
//0-20*x：5*x个空格
//0-240：60个空格
//2.画0，20，40，60---240
//3.在刻度外面画渐变发光圆弧
//4.画指针
//5.画最外层的一条极细的蓝色圆弧
//6.画中间的黑色大圆10, 20, 30
//7.在黑色大圆里画渐变发光的蓝色小圆
//8.在蓝色小圆里再画黑色小圆(10, 20, 30),只留下一部分蓝色渐变
//9.画单位km/h和文字(1)当前车速,(2)请按space键加速
//10.画中心圆内的时速
//要画这些东西，需要(1)颜色,(2)位置


}

MainWindow::~MainWindow()
{
    delete myTimer;
    delete ui;
}

void MainWindow::paintEvent(QPaintEvent *event)
{
    QPainter painter(this);
    painter.setRenderHint(QPainter::Antialiasing);
    //先确定圆心
    int x_center=width()/2;
    int y_center=height()/2;
    //偏移坐标系统
    painter.translate(x_center,y_center);

    int radius=350;
    DrawCircle_line(painter,radius);
    Draw_jian_bian_Circle(painter,radius-5);//390-5=385
    DrawSmallScale(painter,radius-5-30);//385-355=30
    DrawDigital(painter,radius-5-30-27);//355-27
    DrawPointer(painter,radius-5-30-27-40);
    DrawCircle1(painter,150);
    Draw_jian_bian_Circle1(painter,130);
    DrawUnit(painter,40);
    DrawNum(painter,100);
}

void MainWindow::DrawSmallScale(QPainter &painter, int radius)
{
    QPainterPath pointPath_small;
    pointPath_small.moveTo(-2,-2);
    pointPath_small.lineTo(2,-2);
    pointPath_small.lineTo(2,8);
    pointPath_small.lineTo(-2,8);

    QPainterPath pointPath_big;
    pointPath_big.moveTo(-2,-2);
    pointPath_big.lineTo(2,-2);
    pointPath_big.lineTo(2,20);
    pointPath_big.lineTo(-2,20);

    int i=-30;
    int a=0;
    int speed;
    while(i<=210)
    {
        //最左边对应i==-30,最右边对应i==210
        speed=i+30;
        QPointF point(0,-radius);
        painter.save();
        //qDebug()<<point;
        painter.rotate(-90+i);
        painter.translate(point.x(),point.y());
        if(speed<160)painter.setBrush(QColor(255,255,255));
        else painter.setBrush(QColor(235, 70, 70));
        if(a%5==0)painter.drawPath(pointPath_big);
        else painter.drawPath(pointPath_small);
        i+=4;
        //rotate:0---90°
        //rotate:-30---60°
        //rotate:30---120°
        a++;
        painter.restore();
    }
}

void MainWindow::DrawCircle_line(QPainter &painter, int r2)
{
    //最外细圆线
    painter.save();
    QPainterPath outRing;
    outRing.moveTo(0,0);
    outRing.arcTo(-r2,-r2,2*r2,2*r2,-30,240);
    outRing.closeSubpath();
    QPainterPath inRing;
    inRing.moveTo(0,0);
    int r3=r2-5;
    inRing.addEllipse(-r3,-r3,2*r3,2*r3);

    painter.setBrush(QColor(6, 217, 244));
    painter.drawPath(outRing.subtracted(inRing));
    painter.restore();
}

void MainWindow::Draw_jian_bian_Circle(QPainter &painter, int r2)
{
    //渐变圆环
    painter.save();
    QPainterPath outRing;
    outRing.moveTo(0,0);
    outRing.arcTo(-r2,-r2,2*r2,2*r2,-30,240);//从-30度出发，共240度
    outRing.closeSubpath();
    QPainterPath inRing;
    inRing.moveTo(0,0);
    int r3=r2-25;//
    inRing.addEllipse(-r3,-r3,2*r3,2*r3);
    QRadialGradient radialGradient(0,0,r2,0,0);
    radialGradient.setColorAt(1,QColor(0,82,199));
    radialGradient.setColorAt(0.92,Qt::transparent);
    painter.setBrush(radialGradient);
    painter.drawPath(outRing.subtracted(inRing));
    painter.restore();
}

void MainWindow::Draw_jian_bian_Circle1(QPainter &painter, int r2)
{
    //渐变圆环
    painter.save();
    QPainterPath outRing;
    outRing.moveTo(0,0);
    outRing.arcTo(-r2,-r2,2*r2,2*r2,0,360);
    outRing.closeSubpath();
    QPainterPath inRing;
    inRing.moveTo(0,0);
    int r3=r2-30;//
    inRing.addEllipse(-r3,-r3,2*r3,2*r3);
    QRadialGradient radialGradient(0,0,r2,0,0);
    radialGradient.setColorAt(1,QColor(10,68,185,150));
    radialGradient.setColorAt(0.8,Qt::transparent);
    painter.setBrush(radialGradient);
    painter.drawPath(outRing.subtracted(inRing));
    painter.restore();
}

void MainWindow::DrawCircle1(QPainter &painter, int r1)
{
    QRect  rect(-r1,-r1,2*r1,2*r1);
    painter.setBrush(QBrush(QColor(10, 20, 30)));
    painter.drawEllipse(rect);
}

void MainWindow::DrawDigital(QPainter &painter, int r)
{
    painter.save();
    painter.setPen(QColor(255,255,255));
    QFont font;
    font.setFamily("Arial");
    font.setPointSize(15);
    font.setBold(true);
    painter.setFont(font);
    //0,20,40,,,240
    //20*0,20*1,20*2,,,20*12
    //0-12,13个数
    for(int i=0;i<13;i++)
    {
        QPointF point(0,-r);
        painter.save();
        //0:210,20:190,120:90

        int angle=210-i*20;
        //angle:90:不用旋转（0），70：-20
        painter.rotate(angle-90);
        painter.translate(point);
        //240度
        //120---不用旋转
        painter.drawText(-25,0,50,30,Qt::AlignCenter,QString::number(240-i*20));
        painter.restore();
    }
    painter.restore();
}

void MainWindow::DrawUnit(QPainter &painter, int h)
{
    painter.save();
    painter.setPen(QColor(255,255,255));
    QFont font;
    font.setFamily("Arial");
    font.setPointSize(16);
    font.setBold(true);
    painter.setFont(font);
    painter.drawText(-50,h,100,20,Qt::AlignCenter,QString("km/h"));
    painter.drawText(-70,h+150,140,40,Qt::AlignCenter,QString("当前车速"));

    painter.setPen(QColor(255,255,255,80));
    painter.drawText(-125,h+280,250,40,Qt::AlignCenter,QString("-请按space键加速-"));
    painter.restore();
}

void MainWindow::DrawPointer(QPainter &painter, int radius)
{
    QPainterPath pointPath;
    pointPath.moveTo(10,0);
    pointPath.lineTo(1,-radius);
    pointPath.lineTo(-1,-radius);
    pointPath.lineTo(-10,0);
    pointPath.arcTo(-10,-10,20,20,180,180);
    QPainterPath inRing;
    inRing.addEllipse(-5,-8,10,10);
    painter.save();

    //计算并选择绘图对象坐标
    painter.rotate(degRotate-120);
    painter.setBrush(QColor(255,255,255));
    painter.drawPath(pointPath);
    painter.drawPath(pointPath.subtracted(inRing));
    painter.restore();
}

void MainWindow::DrawNum(QPainter &painter,int h)
{
    painter.save();
    painter.setPen(QColor(255,255,255));
    QFont font;
    font.setFamily("Arial");
    font.setPointSize(45);
    painter.setFont(font);
    painter.drawText(-75,-h*2/3,150,h,Qt::AlignCenter,QString::number(degRotate));
    painter.restore();
}

void MainWindow::keyPressEvent(QKeyEvent *event)
{
    //按下就加速，释放就减速
    //direction=0,加速
    //direction=1,减速
    if(event->key()==Qt::Key_Space){
        direction=0;
    }
}

void MainWindow::keyReleaseEvent(QKeyEvent *event)
{
    if(event->key()==Qt::Key_Space){
        direction=1;
    }
}

void MainWindow::slot_speed_changed()
{
    if(direction){
        //减速
        if(degRotate>0)degRotate--;
    }
    else{
        if(degRotate<240)degRotate++;
    }
    qDebug()<<degRotate;
    update();
}

 

3.效果

 4.背景图片