Qt天气预报系统绘制温度曲线

绘制温度曲线

1、安装事件过滤器

cpp 复制代码
//给标签添加事件过滤器
ui->higntTemLabel->installEventFilter(this);        //高温事件过滤器
ui->lowTemLabel->installEventFilter(this);          //低温事件过滤器

2、实现事件过滤器

cpp 复制代码
//事件过滤
bool MainWindow::eventFilter(QObject *watched, QEvent *event)
{
    if(event->type() == QEvent::Paint)
    {
        //"watched" 是否等于 "ui->higntTemLabel",来判断是否是标签控件 "ui->higntTemLabel" 的绘图事件
        if(watched == ui->higntTemLabel)
        {
            paintHightTemCure();        //绘制高温
        }

        if(watched == ui->lowTemLabel)
        {
            paintLowTemCure();          //绘制低温
        }
    }
    return QWidget::eventFilter(watched,event);

}

3、定义一些常量

cpp 复制代码
#define INCREMENT 3         //温度升高或降低y轴增量
#define POINT_RADIUS 3      //绘制温度曲线点的半径

#define OFFSET_X 19  //离温度曲线平均值的x坐标
#define OFFSET_Y 12  //离温度曲线平均值的x坐标

4、绘制高温曲线

cpp 复制代码
//绘制高温曲线
void MainWindow::paintHightTemCure()
{
    QPainter painter(ui->higntTemLabel);    // 创建一个QPainter对象,将ui->higntTemLabel作为绘图设备

    //抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);

    //1、获取x坐标
    int pointX[7] = {0};        //定义一个数组存储温度x坐标
    //遍历7个点
    for(int i=0; i<7;i++)
    {
        pointX[i] = windDirectionList[i]->pos().x() + windDirectionList[i]->width()/2;;
    }


    //获取y坐标
    int tempSum = 0;         //高温总和
    int tempAverage = 0;    //高温平均值

    for(int i=0; i<7; i++)
    {
        tempSum += day[i].highTem;      //7天高温值的总和
    }
    tempAverage = tempSum/7;            //7天温度平均值

    //计算Y坐标
    int pointY[7] = {0};        //7个y点坐标

    int centerY = ui->higntTemLabel->height()/2;    //高温标签y的中心坐标
    for(int i=0; i<7; i++)
    {
        pointY[i] = centerY - ((day[i].highTem-tempAverage)*INCREMENT);    //获得7个点y坐标
    }

    //开始绘制
    //初始化画笔
    QPen pen = painter.pen();                //获得画笔
    pen.setWidth(1);                        //画笔宽度
    pen.setColor(QColor(45,224,217));       //设置画笔颜色

    painter.setPen(pen);            //设置画笔
    painter.setBrush(QColor(45,224,217));       //设置画刷,内部填充颜色

    //画点,画文本
    for(int i=0; i<7; i++)
    {
        painter.drawEllipse(QPoint(pointX[i],pointY[i]), POINT_RADIUS,POINT_RADIUS);    //画7个点的圆圈


        //显示文本
        painter.drawText(pointX[i]-OFFSET_X,pointY[i]-OFFSET_Y,QString::number(day[i].highTem) + "℃");
    }

    //绘制曲线
    for(int i=0; i < 6; i++)
    {
        if(i==0)
        {
            pen.setStyle(Qt::DotLine);      //画虚线
            painter.setPen(pen);            //设置画笔
        }
        else
        {
            pen.setStyle(Qt::SolidLine);     //画实线
            painter.setPen(pen);             //设置画笔
        }

        painter.drawLine(pointX[i],pointY[i],pointX[i+1],pointY[i+1]);      //画7天的线
    }
}

5、绘制低温曲线

cpp 复制代码
//绘制低温曲线
void MainWindow::paintLowTemCure()
{
    QPainter painter(ui->lowTemLabel);    // 创建一个QPainter对象,将ui->higntTemLabel作为绘图设备

    //抗锯齿
    painter.setRenderHint(QPainter::Antialiasing,true);

    //1、获取x坐标
    int pointX[7] = {0};        //定义一个数组存储温度x坐标
    //遍历7个点
    for(int i=0; i<7;i++)
    {
        pointX[i] = windDirectionList[i]->pos().x() + windDirectionList[i]->width()/2;;
    }


    //获取y坐标
    int tempSum = 0;         //高温总和
    int tempAverage = 0;    //高温平均值

    for(int i=0; i<7; i++)
    {
        tempSum += day[i].lowTem;      //7天高温值的总和
    }
    tempAverage = tempSum/7;            //7天温度平均值

    //计算Y坐标
    int pointY[7] = {0};        //7个y点坐标

    int centerY = ui->lowTemLabel->height()/2;    //高温标签y的中心坐标
    for(int i=0; i<7; i++)
    {
        pointY[i] = centerY - ((day[i].lowTem-tempAverage)*INCREMENT);    //获得7个点y坐标
    }

    //开始绘制
    //初始化画笔
    QPen pen = painter.pen();                //获得画笔
    pen.setWidth(1);                        //画笔宽度
    pen.setColor(QColor(255,223,0));       //设置画笔颜色

    painter.setPen(pen);            //设置画笔
    painter.setBrush(QColor(255,223,0));       //设置画刷,内部填充颜色

    //画点,画文本
    for(int i=0; i<7; i++)
    {
        painter.drawEllipse(QPoint(pointX[i],pointY[i]), POINT_RADIUS,POINT_RADIUS);    //画7个点的圆圈

//        qDebug() << day[i].lowTem;
        //显示文本
        painter.drawText(pointX[i]-OFFSET_X,pointY[i]-OFFSET_Y,QString::number(day[i].lowTem) + "℃");
    }

    //绘制曲线
    for(int i=0; i < 6; i++)
    {
        if(i==0)
        {
            pen.setStyle(Qt::DotLine);      //画虚线
            painter.setPen(pen);            //设置画笔
        }
        else
        {
            pen.setStyle(Qt::SolidLine);     //画实线
            painter.setPen(pen);             //设置画笔
        }

        painter.drawLine(pointX[i],pointY[i],pointX[i+1],pointY[i+1]);      //画7天的线
    }

}

6、在UI函数里更新事件

cpp 复制代码
//不添加温度就会显示为0℃
ui->higntTemLabel->update();
ui->lowTemLabel->update();

7、代码仓库地址

仓库地址

8、总结

|--------------------------------------------------------------------------------------------------|
| 以上就是Qt天气预报系统实现的整个过程了,浏览过程中,如若发现错误,欢迎大家指正,有问题的欢迎评论区留言或者私信。最后,如果大家觉得有所帮助,可以点一下赞,谢谢大家!祝大家天天开心,顺遂无虞! |

Qt天气预报系统完成!

相关推荐
卢锡荣26 分钟前
乐得瑞Type-c接口产品描述
c语言·开发语言
晴天的雨.99226 分钟前
【C++】模板进阶
开发语言·c++·算法
mengzhi啊1 小时前
SerialPortItem对串口再封装一层,省去一些常用的步骤,不用每次都去写类
qt
死磕音视频11 小时前
让小模型做选择题:限定候选项并读取 logits 概率的入门实践(附 Python 代码)
开发语言·python·大模型·文本分类·transformers
顽疲13 小时前
Java vue 养老系统源码详解:月账单 care_month_bill 与 Quartz 扣费 Job 实践
java·开发语言·vue.js·vue养老·springboot养老·java养老
用户83344239661413 小时前
从批量操作到任务中心,再到现场工作台:DeviceForge v2.10—v2.12 完整演进
qt
Wang's Blog13 小时前
Java 项目实战: 交友项目 - 安装开发工具与环境准备
java·开发语言·交友
宛 禾15 小时前
Qt 控件入门:QLabel 从拖拽到对象树,一篇讲透
c++·qt·学习
程序喵大人15 小时前
【C++入门】编译链接模型 - 07 链接器怎样把符号对上号
开发语言·c++·编译器·编译链接·链接器
微三云 - 廖会灵 (私域系统开发)15 小时前
供应链系统实战:多渠道订单聚合与分布式库存一致性方案总结
开发语言·分布式·php