tkinter-TinUI-xml实战（1）天气预报

引言

在TinUI推出TinUIXml后，允许编写者使用xml文件或xml类型的字符串为TinUI或BasicTinUI编写用户界面，减少了重复调试的时间，并且使界面代码和逻辑代码层次分明，方便维护。

本篇文章，将使用该功能编写一个天气预报程序。

声明

本项目仅着重使用xml搭建TinUI界面，功能代码参考 Z小旋 的CSDN博客文章：Python天气预报。

本项目使用的TinUI为我开源并维护在GitHub上的主文件——TinUI.py。当然，使用PYPI中下载安装的tinui也可以。

文件结构

本次项目使用的文件结构如下：

• TinUI.py - TinUI界面核心支持
• 天气预报.py - 本次项目文件
• main.xml - 主界面
• table.xml - 天气预报结果呈现界面

编写界面

在该程序中，我打算使用两个xml文件来编写界面：

1. 显示初始界面，整体不会改动
2. 显示结果页面，每次查询天气需要变更

初始化界面（main.xml）

以下是main.xml的内容：

<tinui>
    <line>
        <label text='输入一个中国城市名称：'>label>
        <entry width='200'>entryentry>
        <button text='查询' command='self.funcs["get"]'>button>
    line>
    <line>
        <label text='当前状态：正常' outline=''>statelabel>
    line>
tinui>

基本思路就是显示两行内容，一行显示输入信息和相关内容；第二行显示网络信息获取的情况，以防止输入城市错误或者是网络访问失败。

其中，需要导入函数get和导出entry, state：

def get_weather_data(event):
    city_name = entry.get()
    url1 = 'http://wthrcdn.etouch.cn/weather_mini?city='+urllib.parse.quote(city_name)
    url2 = 'http://wthrcdn.etouch.cn/weather_mini?citykey=101010100'
    #网址1只需要输入城市名，网址2需要输入城市代码
    #print(url1)
    weather_data = urllib.request.urlopen(url1).read()
    #读取网页数据
    weather_data = gzip.decompress(weather_data).decode('utf-8')
    #解压网页数据
    weather_dict = json.loads(weather_data)
    #将json数据转换为dict数据
    show_weather(weather_dict)

#导入接口
xh.funcs['get']=get_weather_data
#导出接口
entry=xh.tags['entry'][0]
state=xh.tags['state'][0]

结果返回界面（table.xml）

这个界面有两部分组成：

1. 显示当天天气的表格；显示未来四天天气的按钮
2. 按钮被点击后，显示未来四天天气信息

在table.xml中：

<tinui>
    <line y='150'>
        <label text='以下为获取内容'>label>
    line>
    <line>
        <table data='self.datas["weather"]'>table>
        <line>
            <button text='显示未来四天天气' command='self.funcs["show_more"]'>morebbutton>
        line>
        <line>
            <label text='' outline=''>morellabel>
        line>
    line>
tinui>

这里需要导入show_more和导出moreb, morel：

#导入接口
xb.datas['weather']=table
xb.datas['more']=more_weather
xb.funcs['show_more']=show_more
#导出接口
moreb=xb.tags['moreb'][2]
morel=xb.tags['morel'][0]

完整代码（天气预报.py）

#参考：https://blog.csdn.net/as480133937/article/details/100981820
import urllib.request
import gzip
import json
from tkinter import Tk
from TinUI import *

def get_weather_data(event):
    city_name = entry.get()
    url1 = 'http://wthrcdn.etouch.cn/weather_mini?city='+urllib.parse.quote(city_name)
    url2 = 'http://wthrcdn.etouch.cn/weather_mini?citykey=101010100'
    #网址1只需要输入城市名，网址2需要输入城市代码
    #print(url1)
    weather_data = urllib.request.urlopen(url1).read()
    #读取网页数据
    weather_data = gzip.decompress(weather_data).decode('utf-8')
    #解压网页数据
    weather_dict = json.loads(weather_data)
    #将json数据转换为dict数据
    show_weather(weather_dict)

def show_weather(weather_dict):
    def show_more(event):
        moreb[1](bg='#eddfdf')
        body.itemconfig(morel,text=more_weather)
    #将json数据转换为dict数据
    if weather_dict.get('desc') == 'invilad-citykey':
        head.itemconfig(state,text='城市名有误，或者天气中心未收录该城市')
    elif weather_dict.get('desc') =='OK':
        head.itemconfig(state,text='当前状态：正常')
        xb.clean()
        forecast = weather_dict.get('data').get('forecast')
        table=[['项目','内容']]
        table.append(['城市：',weather_dict.get('data').get('city')])
        table.append(['温度：',weather_dict.get('data').get('wendu')+'℃'])
        table.append(['感冒：',weather_dict.get('data').get('ganmao')])
        table.append(['风向：',forecast[0].get('fengxiang')])
        table.append(['风级：',forecast[0].get('fengli')])
        table.append(['高温：',forecast[0].get('high')])
        table.append(['低温：',forecast[0].get('low')])
        table.append(['天气：',forecast[0].get('type')])
        table.append(['日期：',forecast[0].get('date')])
        #=====
        more_weather=''
        for i in range(1,5):
            more_weather+='日期：'+forecast[i].get('date')+'\n'
            more_weather+='风向：'+forecast[i].get('fengxiang')+'\n'
            more_weather+='风级：'+forecast[i].get('fengli')+'\n'
            more_weather+='高温：'+forecast[i].get('high')+'\n'
            more_weather+='低温：'+forecast[i].get('low')+'\n'
            more_weather+='天气：'+forecast[i].get('type')+'\n\n'
        #in
        xb.datas['weather']=table
        xb.datas['more']=more_weather
        xb.funcs['show_more']=show_more
        #during
        xb.loadxml(table_xml)
        #out
        moreb=xb.tags['moreb'][2]
        morel=xb.tags['morel'][0]


r=Tk()
r.title('天气查询')
r.geometry('500x500+50+50')

head=BasicTinUI(r)
xh=TinUIXml(head)
head.pack(fill='both',expand=True)
#in
xh.funcs['get']=get_weather_data
#during
with open('main.xml',mode='r',encoding='utf-8') as f:
    xh.loadxml(f.read())
bbox=head.bbox('all')
head['height']=bbox[3]-bbox[1]
#out
entry=xh.tags['entry'][0]
state=xh.tags['state'][0]

body=TinUI(r)
xb=TinUIXml(body)
body.pack(fill='both',expand=True)
with open('table.xml',mode='r',encoding='utf-8') as f:
    table_xml=f.read()

r.mainloop()

效果

---

结语

这就是用tkinter和TinUI混合编程的一个示例。

tkinter创新