QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

这篇具有很好参考价值的文章主要介绍了QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前言

        经过之前一段时间的QT学习,做出一个小软件来总结自己掌握关于qt的知识点。网络上有许多免费的天气接口(api),有xml格式的,也有json格式的。具体xml和json有什么区别,这里我就不去深究了,我们这里用的是一个json格式的数据,所以重点是对json格式的数据进行处理

 效果的展示

         颜面是很重要的,首先介绍我的ui

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

然后介绍ui上各个按键的功能

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

 

“1”:这是小狗按钮,点击此键,跳转出一个小狗界面

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

tips:点击小狗即可实现播报出今天的天气内容,以及温馨提醒。

“2”:实时温度

“3”:现在的天气图片状态

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

“4”:现在的天气文字状态

“5”:具体今天的温度范围

“6”:刷新界面,然后访问api接口

“7”:定位选择的城市

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

构造实现

        把 ui 和 网络请求解析 分开,ui 是主线程,网络的请求解析是一个单独的线程,net_thread.cpp是线程的文件,将weather.cpp类移入到线程中运行,这样在解析数据的时候,如果数据过大,不至于会影响到 ui 的响应。
把所有的图片都加到了资源里,资源里还有一个包含了所有城市ID的.json文件(这是在网上不知道哪个不知名大佬总结的,在获取天气信息之前,需要先将 .json 里的城市ID读取出来,在拼凑成一个完整的 url 。

#ifndef NET_THREAD_H
#define NET_THREAD_H

#include <QObject>
#include <QThread>

#include <class_weather/weather.h>

class NET_THREAD : public QObject
{
    Q_OBJECT
signals:
    void thread(QString);
public:
    explicit NET_THREAD(QObject *parent = nullptr);
    ~NET_THREAD();

    QThread * qThread = nullptr;

    WEATHER * weather = nullptr;

    void startThread();

    void stopThread();

signals:

};

#endif // NET_THREAD_H

api接口函数,json数据的分段

        

http://t.weather.sojson.com/api/weather/city/城市ID

连接api之后,返回的数值如图所示:

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

 那我们该如何对返回的数据进行分段处理呢?

   这里借鉴了csdn上大佬的处理方法

        数据的分段:

        

JSON返回示例 :
{
errNum: 0,
errMsg: "success",
retData: {
   city: "北京", //城市
   pinyin: "beijing", //城市拼音
   citycode: "101010100",  //城市编码   
   date: "15-02-11", //日期
   time: "11:00", //发布时间
   postCode: "100000", //邮编
   longitude: 116.391, //经度
   latitude: 39.904, //维度
   altitude: "33", //海拔 
   weather: "晴",  //天气情况
   temp: "10", //气温
   l_tmp: "-4", //最低气温
   h_tmp: "10", //最高气温
   WD: "无持续风向",  //风向
   WS: "微风(<10m/h)", //风力
   sunrise: "07:12", //日出时间
   sunset: "17:44" //日落时间
  }    
}
备注 :
请将apikey作为参数添加到header中;
当返回{"errNum":300003,"errMsg":"url is not parse"} 时,请校验是否传入apikey;

为了取到其中的各条信息需要用到JSON数据的解析

$cityname = urlencode($_POST['cityname']);
            //设置天气API的url地址,初始化cURL 根据城市名称查询
            $url = 'http://apis.baidu.com/apistore/weatherservice/cityname?cityname='.$cityname; //天气API
            //$this->display();
            $ch = curl_init();
            $header = array(
                'apikey: e858d877f6febd23d6623e14a3dbf220',
            );
            //设置cURL的相关参数,执行HTTP请求
            curl_setopt($ch,CURLOPT_URL,$url);
            // 添加apikey到header
            curl_setopt($ch, CURLOPT_HTTPHEADER  , $header);
            curl_setopt($ch,CURLOPT_RETURNTRANSFER,true);
            //采集数据
            $output = curl_exec($ch);
            //关闭
            curl_close($ch);
            $res = json_decode($output,true);   //将生成的结果转化为json数据
            $this->assign('city',$res["retData"]['city']);
            $this->assign('date',$res["retData"]['date']);
            $this->assign('time',$res["retData"]['time']);
            $this->assign('temp',$res["retData"]['temp']);
            $this->assign('l_tmp',$res["retData"]['l_tmp']);
            $this->assign('h_tmp',$res["retData"]['h_tmp']);
            $this->assign('weather',$res["retData"]['weather']);
            $this->assign('WS',$res["retData"]['WS']);
            $this->display();

通过这种方式就可以获取其中的每条信息。这种方式基本可以处理所有API返回数据。

$city = $res["resData"]["city"];

分段之后我们用文本的方式记录下来:

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

关于界面跳转问题

         QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

 当我们点击地点查询,和小狗这两个按钮,我们的主界面会消失然后分别出现

小狗:

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

 地点查询:

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

 关于界面的跳转,我都是运用信号与槽的方式来实现的。

 具体代码:

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

 QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

 思路:

        拿小狗界面举例,首先我用hide隐藏小狗这个界面,当我点击小狗这个按钮的时候,实现小狗显示,然后在小狗的类里实现主界面的消失隐藏,形成一种交互过程,实现了点击按钮,一个消失一个出现。

天气图标实现 

          在网上找到了很多关于天气打包好的图片:

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)  

然后把这些图片添加到资源,例如:
QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

 然后每个图片通过比较字符串判断是什么天气,例如:

如果是小雨,则会去找到小雨天气的图片的路径并且显示出来:

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

代码实现

 if(info->forecast[0].weatherType.contains("多云"))
    {
        pixmap = ":/icons/weather_icons/duoyun.png";
    }
    else if(info->forecast[0].weatherType.contains("晴"))
    {
        pixmap = ":/icons/weather_icons/qing.png";
    }
    else if(info->forecast[0].weatherType.contains("小雨"))
    {
        pixmap = ":/icons/weather_icons/xiaoyu.png";
    }
    else if(info->forecast[0].weatherType.contains("沙尘"))
    {
        pixmap = ":/icons/weather_icons/shachen.png";
    }
    else if(info->forecast[0].weatherType.contains("雾霾"))
    {
        pixmap = ":/icons/weather_icons/wumai.png";
    }
    else if(info->forecast[0].weatherType.contains("雪转晴"))
    {
        pixmap = ":/icons/weather_icons/xuezhuanqing.png";
    }
    else if(info->forecast[0].weatherType.contains("夜多云"))
    {
        pixmap = ":/icons/weather_icons/yeduoyun.png";
    }
    else if(info->forecast[0].weatherType.contains("中雨"))
    {
        pixmap = ":/icons/weather_icons/zhongyu.png";
    }
    else if(info->forecast[0].weatherType.contains("暴雨"))
    {
        pixmap = ":/icons/weather_icons/baoyu.png";
    }
    else if(info->forecast[0].weatherType.contains("冰雹"))
    {
        pixmap = ":/icons/weather_icons/bingbao.png";
    }
    else if(info->forecast[0].weatherType.contains("大雪"))
    {
        pixmap = ":/icons/weather_icons/daxue.png";
    }
    else if(info->forecast[0].weatherType.contains("大雨"))
    {
        pixmap = ":/icons/weather_icons/dayu.png";
    }
    else if(info->forecast[0].weatherType.contains("雷雨"))
    {
        pixmap = ":/icons/weather_icons/leiyu.png";
    }

    ui->label_weather_icon->setPixmap(QPixmap(pixmap));
}

小狗语音播报 

当我们点击小狗,小狗就会自动播报处今天的天气情况,以及提醒。我是这样实现的:

        因为,天气的数据处理和小狗不是同一个类,所以我决定在天气数据的类里创建一个文本文件,然后经过字符格式的转换写入文件,然后进行文本的换行处理,在狗的类里在根据路径打开文本文件并朗读,使语音有分段。

QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)

具体代码

天气类里实现的部分

  QFile file("qwer.txt");
    char *zxc="\n";
    file.open(QIODevice::WriteOnly);
     file.write(info->cityName.toUtf8());

    char* zaxc="今日实时温度";

    file.write(zxc);
    file.write(zaxc);

    file.write(info->realTime.temp.toUtf8());
file.write(zxc);
    file.write(info->forecast[0].temp.toUtf8());
    file.write(zxc);
     file.write(info->forecast[0].weatherType.toUtf8());
     file.write(zxc);


    for(int i=0;i<4;i++)
    {
    QString str=showMessageList[i];
    QByteArray buf =str.toUtf8();
    file.write(buf);
    file.write(zxc);
    }


    file.close();

小狗类里实现的部分文章来源地址https://www.toymoban.com/news/detail-416267.html


        QTextToSpeech *s = new QTextToSpeech;
        QFile file("qwer.txt");
        file.open(QIODevice::ReadOnly);
        QByteArray zbc;
        zbc=file.readAll();
        s->say(zbc);

到了这里,关于QT练手小项目-——天气播报小狗(ui展示分析,构造实现,json格式数据分析,界面交互,天气图标处理,小狗语音)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Qt完成文本转换为语音播报与保存(系统内置语音引擎)(一)

    在当今数字化社会,人们对于交互式应用程序的需求越来越高。除了传统的图形用户界面,语音交互也成为了一种流行的交互方式。在这种情况下,将文本转换为语音成为了一项重要的技术,它可以为用户提供更加人性化和便捷的交互方式。在此背景下,Qt提供了QTextToSpeech类

    2024年02月15日
    浏览(60)
  • Android Studio 实现天气预报App (简单方便展示内容超多)

    🍅 文章末尾有获取完整项目源码方式 🍅 目录 前言 一、任务介绍 1.1 背景 1.2目的和意义 二、 实现介绍 视频演示 2.1 启动页实现 2.2注册页面实现 2.3 登陆页面实现 2.4 首页实现 2.5 城市管理列表页面实现                三、获取源码         在使用Android Studio开发

    2024年04月24日
    浏览(48)
  • VS中Qt项目不能打开ui文件

    在VS中创建的Qt项目,若不能打开ui文件,或者弹出以下提示的:其本质是找不到designer.exe的路径 那么需要手动添加designer.exe的路径 第一步:右键点击打不开的ui文件,选择打开方式 第二步:点击添加 第三步:点击右侧浏览查找对应的Qt编译器安装路径的designer,然后点击确定

    2024年02月13日
    浏览(51)
  • Android Compose UI实战练手----Google Bloom欢迎页

    在之前的博客中,我已经介绍了Compose 的基础UI和布局组件,现在我们就利用这些基础UI和布局组件去做一个实战项目。Bloom是Google提供的一个假想产品,我们可以作为练手项目使用,这个产品的详细UI设计稿大家可以自行去百度下,个人决定这里主要是熟练去使用Compose UI,不

    2024年02月09日
    浏览(42)
  • qt打开项目缺少ui_文件,使用手动生成

    打开项目看到,缺少ui_myMainWindow.h文件,它是和myMainWindow.ui相对应的,所以我们需要手动生成对应的ui_文件。 步骤如下: 使用 uic.exe 来生成,如果在系统变量Path中设置了qt的bin目录,那么就可以直接使用uic.exe。 使用方法是: 在myMainWindow.ui所在文件夹的空白处点击右键,选择

    2024年02月11日
    浏览(45)
  • (vue)vue项目实现语音播报

    解决参考1: 在 Vue 项目中,你可以使用 Web Speech API 中的 SpeechSynthesis 接口来实现文本内容的自动朗读。下面是一个示例: 1.在 Vue 组件的模板中添加一个按钮,用于触发朗读: 2.在 Vue 组件的方法中实现朗读功能: 学习参考2:https://www.yzktw.com.cn/post/1266165.html

    2024年02月15日
    浏览(39)
  • Qt优秀开源项目之二十一:遇见QSkinny,一个轻量级Qt UI库

    目录 一.QSkinny简介 二.工作原理 三.编译 QSkinny库基于Qt Graphic View和Qt/Quick中少量的核心类。它提供了一组轻量级控件,可以在C++或QML中使用这些控件。QSkinny默认是启用硬件加速的,非常适合嵌入式设备,目前已经应用于大量汽车GUI的代码实现中。正如预期的那样,它有良好的

    2024年01月23日
    浏览(63)
  • 【嵌入式Linux项目】基于Linux的全志H616开发板智能家居项目(语音控制、人脸识别、安卓APP和PC端QT客户端远程操控)有视频功能展示

    目录 一、功能需求 二、开发环境 1、硬件: 2、软件: 3、引脚分配: 三、关键点 1、设计模式之工厂模式 2、线程 3、wiringPi库下的相关硬件操作函数调用 4、语音模块的串口通信 5、摄像头的实时监控和拍照功能 6、人脸识别 7、qt程序跨平台运行(编译成安卓APP) 四、编译和

    2024年02月15日
    浏览(61)
  • 机器学习实战练手项目

    更多文章代码详情可查看博主个人网站:https://www.iwtmbtly.com/ 下文用到的数据集和代码可以从这里下载《数据集》 机器学习是一种从数据生成规则、发现模型,来帮助我们预测、判断、分析和解决问题的技术。 一个机器学习项目从开始到结束大致分为5步,分别是 定义问题、

    2023年04月13日
    浏览(42)
  • java框架与练手项目

    Struts框架是一个开源的Java Web应用程序框架,用于简化Web应用程序的开发。Struts框架基于MVC设计模式,提供了Controller、View、Model等组件,可以快速地创建Web应用程序。 Apache Tomcat框架是一个开源的Java Web服务器,用于运行Java Web应用程序。Tomcat框架支持各种Web应用程序,如JSP、

    2024年02月10日
    浏览(42)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包