在冰天雪地里给我们的“查天气”加上GUI界面

最近天气越累越冷，不少地区都下了雪。身在长江流域，既没有像南方一样温暖，又不像北方有集中供暖，取暖也就只能靠“抖”了。

在瑟瑟发抖之余，有同学都想到了我们之前做过的“查天气”小程序：

这段“查天气”实例，见证了数万人入门编程

视频讲解版：

（公众号对话里回复关键字：查天气 ，可以查看更详细的教程和代码）

之前的代码都是在控制台下查询，用户体验不是那么“友好”。今天给大家分享一个 GUI 的版本，带有美观的用户界面，采用 PyQt5 实现。

效果预览：

一、获取天气信息

本例中使用的查天气接口是：

http://wthrcdn.etouch.cn/weather_mini?citykey=城市代码

部分城市代码对应（完整城市代码见源码）：

北京 101010100 天津 101030100 上海 101020100

浏览器返回的天津气温情况如下，该信息其实就是一个JSON字符串，格式化之后的样子如下所示：

代码语言：javascript复制

{
    "data": {
        "yesterday": {
            "date": "1日星期五",
            "high": "高温 17℃",
            "fx": "东北风",
            "low": "低温 8℃",
            "fl": "<![CDATA[<3级]]>",
            "type": "多云"
        },
        "city": "北京",
        "forecast": [
            {
                "date": "2日星期六",
                "high": "高温 14℃",
                "fengli": "<![CDATA[<3级]]>",
                "low": "低温 8℃",
                "fengxiang": "北风",
                "type": "小雨"
            },

        ],
        "ganmao": "昼夜温差较大，较易发生感冒，请适当增减衣服。体质较弱的朋友请注意防护。",
        "wendu": "12"
    },
    "status": 1000,
    "desc": "OK"
}

获取天气的主要代码如下：

代码语言：javascript复制

# cityCode 替换为具体某一个城市的对应编号# 1、发送请求，获取数据
url = f'http://wthrcdn.etouch.cn/weather_mini?citykey={cityCode}'
res = requests.get(url)
res.encoding = 'utf-8'res_json = res.json()

# 2、数据格式化
data = res_json['data']
city = f"城市：{data['city']}n"  
# 字符串格式化的一种方式 f"{}" 通过字典传递值

today = data['forecast'][0]
date = f"日期：{today['date']}n"  # n 换行
now = f"实时温度：{data['wendu']}度n"
temperature = f"温度：{today['high']} {today['low']}n"
fengxiang = f"风向：{today['fengxiang']}n"
type = f"天气：{today['type']}n"
tips = f"贴士：{data['ganmao']}n"

result = city   date   now   temperature   fengxiang   type   tips

print(result)

代码语言：javascript复制

二、界面的实现

1、使用Qt Designer绘制窗口，保存为ui文件

2、把ui文件转为py文件

1）在生成的ui文件目录下，打开cmd

2）输入以下命令（注意替换名称）

代码语言：javascript复制

pyuic5 -o destination.py source.ui

3、信号与槽函数的连接

代码语言：javascript复制

# 1、清空按钮与对应函数连接
clearBtn.clicked.connect(widget.clearResult)

# 2、查询按钮与对应函数连接
queryBtn.clicked.connect(widget.queryWeather)

4、调用主窗口类

代码语言：javascript复制

import sys     
from PyQt5.QtWidgets import QApplication , QMainWindow
from WeatherWin import Ui_widget
import requests
import json

class MainWindow(QMainWindow ):
    def __init__(self, parent=None):    
        super(MainWindow, self).__init__(parent)
        self.ui = Ui_widget()
        self.ui.setupUi(self)

        # 通过文本框传入想要搜索的城市名称:天津
        cityName = self.ui.weatherComboBox.currentText()

        # 获取天气部分省略

        # 在文本框显示查询结果
        self.ui.resultText.setText(result)

    def clearResult(self):
        print('* clearResult  ')
        self.ui.resultText.clear()  

if __name__=="__main__":  
    app = QApplication(sys.argv)  
    win = MainWindow()  
    win.show()  
    sys.exit(app.exec_())

以上，提供了获取天气（GUI）程序的主要过程及部分源码。

1、获取天气信息 2、绘制可视化界面 3、把ui文件转成py文件 4、信号与槽 5、调用主窗口类

GUI 版本完整源码：

https://pan.baidu.com/s/1CR5dKV-4SruoReYV296PJA

提取码：k4jx

公众号里回复关键字 查天气，可查看命令行交互版的详细教程及代码。

作者：GitPython

来源：GitPython

gui python git qt

0 人点赞