基于win8的天气新闻类应用实现
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
(1)htmlDoc.DocumentNode.ChildNodes，此方法用来 获取根节点的一级子节点。
(2)htmlDoc.DocumentNode.Descendants(). ElementAt(num)，此方法获得根节点的所有子 孙结点中第num个结点。
(3)htmlDoc.DocumentNode.Descendants ("div")，此方法获得根节点的所有指定子 孙标签(如div) 结点。
{"weatherinfo": {"city":"武汉", "cityid":"101200101", "temp":"19", "WD":"西风", "WS":"1级", "time":"20:30", }
} 可以看到里面包含了武汉的实时天气信息，包括温度、 风力风向等，然后可以利用.NET提供的相关类的某些方法可
//..... } } 4.4 得到的结果
5.1 获取温度数据 采用和获取天气新闻一样的技术，先从中国天气网获取
未来六天的温度，比如说打开网址 http://www.weather. com.cn/weather/101200101.shtml，其中“101200101”是 武汉的城市编号，在这个页面中可以查看到相应城市的未来 一周的天气预报，应用只需要获取六天的温度(包括每天的最 低温和最高温)，然后根据温度画出温度曲线，举例说明，假 如现在获得了一组数据如下：
基金项目：校级科技创新基金项目(项目编号：1322A066).
34
软件工程师
2014年5月
以把这些数据解析出来显示给用户[2]。 3.2 获取预报天气
关于这一部分，应用需要获取未来六天的详细的预报天 气，有两种方法：第一种，也是上面提到的，利用中国气象 局提供的相应API，可以获取到未来六天的天气信息；第二 种，是采用第三方的一个类库，里面封装了相应方法，可以 用来提取网页上面的数据，比如可以找到中国天气网的官方 网站，里面有专门的一个网页是用来显示指定城市的未来天 气预报信息，只需要查看它的Html源文件，对其进行分析， 找规律，然后把数据提取出来，详细说明在下面介绍。 3.3 绘制温度曲线
这一部分是本应用最难实现的部分，主要过程是先得通 过提取网页指定的未来几天的最高温和最低温，然后把这些 温度值以坐标曲线的方式显示在界面上，详细说明在第4段中 将介绍。 3.4 获取天气新闻
此部分是采用第三方的一个类库，里面封装了相应方 法，可以用来提取网页上面的数据，详细说明在下面介绍。
4 提取网页数据(Extract data from web page)
2 应用主体框架(Application main framework)
首先把此应用的主题框架分成如下几个部分:实时天气、 预报天气、温度曲线、天气新闻。主体界面设计大致如下：
图１ 应用主体框架 Fig.1 Application main framework
可以看到，对于大多数普通用户来说，此结构基本上已 经满足了需求。
foreach (HtmlNode ulNode in divNode2. Descendants("ul"))//循环获取ul
{ if (newsNum == 9)//只需要9个新闻消息
break; HtmlNode liNode = ulNode.Descendants("li"). ElementAt(0);//取每个ul的第一条新闻 string Titlestr = liNode.Descendants("a").First(). InnerText;//获得标题 string Timestr = liNode.Descendants("span").First(). InnerText; //获得时间 string url= liNode.Descendants("a").First(). GetAttributeValue("href, null);//获取详细新闻url //根据新闻的url跳转到新闻内容页面，获取详细信息， 处理过程也类似上面的，不再赘述
第17卷第5期 2014年5月
软件工程师 SOFTWARE ENGINEER
Vol.17 No.5 May 2014
文章编号：1008-0775(2014)-05-33-04
基于win8的天气新闻类应用实现
王 帆，张俊杰，欧阳琳
（武汉科技大学计算机科学与技术学院，湖北 武汉 ４３００６５）
摘 要：Windows8应用商店开发是微软的一个全新开发技术，本文详细介绍了一款基于win8的天气新闻类应用在
(4)htmlDoc.DocumentNode.GetAttributeValue ("href", null)，此方法获得结点的某一个属性值 (如a标签的href)。 4.2 新闻网页源文件Html分析
这一部分是提取的中国天气网上的最新天气资讯，通过 打开该网页的源文件，可以看到关于天气新闻的Html代码大 致格式如下：
表1 六天最低最高温度表 Tab.1 The lowest and highest temperature of six days 项目 第一天 第二天 第三天 第四天 第五天 第六天 最低温 9℃ 11℃ 12℃ 21℃ 20℃ 24℃ 最高温 19℃ 22℃ 25℃ 12℃ 10℃ 13℃
//得到中国天气网新闻天气资讯的Html源代码 HtmlDocument htmlDoc = new HtmlDocument(); htmlDoc.LoadHtml(html); HtmlNode divNode = htmlDoc.DocumentNode.
Descendants("div").ElementAt(18);
中图分类号：TP311.5
wenku.baidu.com
文献标识码：A
The Implementation of Weather News Application Based on WIN8
WANG Fan,ZHANG Junjie,OUYANG Lin
（ Ｗｕｈａｎ Ｕｎｉｖｅｒｓｉｔｙ ｏｆ Ｓｃｉｅｎｃｅ ａｎｄ Ｔｅｃｈｎｏｌｏｇｙ，Ｃｏｌｌｅｇｅ ｏｆ Ｃｏｍｐｕｔｅｒ Ｓｃｉｅｎｃｅ ａｎｄ Ｔｅｃｈｎｏｌｏｇｙ，Ｗｕｈａｎ ４３００６５，Ｃｈｉｎａ）
Keywords:the development of Windows8 app store;make use of API;extract data from web page;plot mutable temperature curves
1 引 言(Introduction)
微软新的操作系统Windows8已经发布了，它拥有更为精 美的界面设计，操作也更简单快捷，
受到了一定范围的关注[1]。用户可以在win8应用商店里下 载不同种类的应用，比如我们最常用的:天气新闻类。在这类 应用当中，我们可以发现有许多应用只是集合某个优点,显得 太过于单一而难以被用户接受，或者说功能设计起来有点冗 余，普通用户甚至不清楚应用的某些功能的具体目的。针对 以上情况，本文提出了此类应用在开发过程中的设计思路， 用到的相关技术以及难点所在，志在为广大win8爱好者提供 学习平台以及为行内入门朋友分享开发经验。
</li> <!--共有5个<li>结点--> </ul> <ul class="newList"> <li><a title="北京空气..." target="_blank" href="climate/2014/04/qhbhyw/2089026.shtml"> 北京空气..</a><span>2014-04-03 10:13:59</ span> </li> <!--共有5个<li>结点--> </ul> <!--共有10个<ul> 标签--> </div> </div> </div> 也就是说一共有10段新闻，每段新闻里面又包含5条新 闻，于是可以很明显的找出这段Html代码的规律，只需要在 每一段新闻里面取第一条新闻即可(当然也可以根据不同需要 选择其他的新闻)[3]。 4.3 提取新闻内容 主要代码描述： private async void GetWeatherNews() { int newsNum = 0;//计数，只要9条新闻 App.httpClient = new HttpClient(); string html = await App.httpClient. GetStringAsync("http://www.weather.com.cn/news/ index.shtml");
//可以发现 "weatherMain"的 div是html文件的第18个
第17卷第5期
王 帆等：基于win8的天气新闻类应用实现
35
HtmlNode divNode1 = divNode.Descendants("div"). ElementAt(0);//得到"weatherLeft"子节点
HtmlNode divNode2 = divNode1.Descendants("div"). ElementAt(0);//得到"content_list1"子节点
对于获取预报天气和天气新闻，其实原理都是一样的， 都是运用第三方的一个类库，运用里面提供的某些方法来对 获取某个特定网页的信息，下面以获取天气新闻为例来说明 主要实现过程。 4.1 第三方类库HtmlAgilityPack.dll介绍
在开发过程中用到的最多的方法是以下几个，也是 HtmlAgilityPack.dll这个类库最核心的方法：
3 相关技术说明(Relevant technical description) 3.1 获取实时天气
中国气象局给广大开发者提供了一个免费的API，可以 用来查询国内所有城市的当前实时天气，该API的格式为： http://www.weather.com.cn/data/sk/城市编号.html， 其中城市编号是指中国气象局把全国的城市都编了一个号， 如武汉的编号为：101200101,通过访问此API，可以从中国气 象局获取最新的实时天气信息，格式为Json格式：
开发过程中的设计思路，用到的相关技术：如何使用API，如何提取动态网页中的数据，如何根据动态改变的温度值绘
制出正确的温度曲线。应用最终的成功开发表明，设计达到了最初的预期要求，并且对类似应用的开发与研究起了较好
的借鉴作用。
关键词：Windows8应用商店开发；使用API；提取网页数据；绘制动态温度曲线
Abstract:The development of WINDOWS8 app store is a brand new technology of Microsoft. This paper introduces a weather news application based on win8 in the process of developing the design train of thought.The use of related technologies:How to make use of API?How to extract data from dynamic Web page?How to plot correct temperature curves according to the mutable temperature values.The ultimate success of the exploring application manifests that this design has met the expected requirements and has offered successful experiences for other similar explorations and researches.
<div class="weatherMain"> <div class="weatherLeft">
<div class="content_list1"> <h1>天气资讯 </h1> <ul class="newList">
<li><a title="新疆乌鲁木齐.." target="_ blank" href="news/2014/04/2089342.shtml">新疆乌鲁木 齐..</a><span>2014-04-03 15:51:12</span>
(2)htmlDoc.DocumentNode.Descendants(). ElementAt(num)，此方法获得根节点的所有子 孙结点中第num个结点。
(3)htmlDoc.DocumentNode.Descendants ("div")，此方法获得根节点的所有指定子 孙标签(如div) 结点。
{"weatherinfo": {"city":"武汉", "cityid":"101200101", "temp":"19", "WD":"西风", "WS":"1级", "time":"20:30", }
} 可以看到里面包含了武汉的实时天气信息，包括温度、 风力风向等，然后可以利用.NET提供的相关类的某些方法可
//..... } } 4.4 得到的结果
5.1 获取温度数据 采用和获取天气新闻一样的技术，先从中国天气网获取
未来六天的温度，比如说打开网址 http://www.weather. com.cn/weather/101200101.shtml，其中“101200101”是 武汉的城市编号，在这个页面中可以查看到相应城市的未来 一周的天气预报，应用只需要获取六天的温度(包括每天的最 低温和最高温)，然后根据温度画出温度曲线，举例说明，假 如现在获得了一组数据如下：
基金项目：校级科技创新基金项目(项目编号：1322A066).
34
软件工程师
2014年5月
以把这些数据解析出来显示给用户[2]。 3.2 获取预报天气
关于这一部分，应用需要获取未来六天的详细的预报天 气，有两种方法：第一种，也是上面提到的，利用中国气象 局提供的相应API，可以获取到未来六天的天气信息；第二 种，是采用第三方的一个类库，里面封装了相应方法，可以 用来提取网页上面的数据，比如可以找到中国天气网的官方 网站，里面有专门的一个网页是用来显示指定城市的未来天 气预报信息，只需要查看它的Html源文件，对其进行分析， 找规律，然后把数据提取出来，详细说明在下面介绍。 3.3 绘制温度曲线
这一部分是本应用最难实现的部分，主要过程是先得通 过提取网页指定的未来几天的最高温和最低温，然后把这些 温度值以坐标曲线的方式显示在界面上，详细说明在第4段中 将介绍。 3.4 获取天气新闻
此部分是采用第三方的一个类库，里面封装了相应方 法，可以用来提取网页上面的数据，详细说明在下面介绍。
4 提取网页数据(Extract data from web page)
2 应用主体框架(Application main framework)
首先把此应用的主题框架分成如下几个部分:实时天气、 预报天气、温度曲线、天气新闻。主体界面设计大致如下：
图１ 应用主体框架 Fig.1 Application main framework
可以看到，对于大多数普通用户来说，此结构基本上已 经满足了需求。
foreach (HtmlNode ulNode in divNode2. Descendants("ul"))//循环获取ul
{ if (newsNum == 9)//只需要9个新闻消息
break; HtmlNode liNode = ulNode.Descendants("li"). ElementAt(0);//取每个ul的第一条新闻 string Titlestr = liNode.Descendants("a").First(). InnerText;//获得标题 string Timestr = liNode.Descendants("span").First(). InnerText; //获得时间 string url= liNode.Descendants("a").First(). GetAttributeValue("href, null);//获取详细新闻url //根据新闻的url跳转到新闻内容页面，获取详细信息， 处理过程也类似上面的，不再赘述
第17卷第5期 2014年5月
软件工程师 SOFTWARE ENGINEER
Vol.17 No.5 May 2014
文章编号：1008-0775(2014)-05-33-04
基于win8的天气新闻类应用实现
王 帆，张俊杰，欧阳琳
（武汉科技大学计算机科学与技术学院，湖北 武汉 ４３００６５）
摘 要：Windows8应用商店开发是微软的一个全新开发技术，本文详细介绍了一款基于win8的天气新闻类应用在
(4)htmlDoc.DocumentNode.GetAttributeValue ("href", null)，此方法获得结点的某一个属性值 (如a标签的href)。 4.2 新闻网页源文件Html分析
这一部分是提取的中国天气网上的最新天气资讯，通过 打开该网页的源文件，可以看到关于天气新闻的Html代码大 致格式如下：
表1 六天最低最高温度表 Tab.1 The lowest and highest temperature of six days 项目 第一天 第二天 第三天 第四天 第五天 第六天 最低温 9℃ 11℃ 12℃ 21℃ 20℃ 24℃ 最高温 19℃ 22℃ 25℃ 12℃ 10℃ 13℃
//得到中国天气网新闻天气资讯的Html源代码 HtmlDocument htmlDoc = new HtmlDocument(); htmlDoc.LoadHtml(html); HtmlNode divNode = htmlDoc.DocumentNode.
Descendants("div").ElementAt(18);
中图分类号：TP311.5
wenku.baidu.com
文献标识码：A
The Implementation of Weather News Application Based on WIN8
WANG Fan,ZHANG Junjie,OUYANG Lin
（ Ｗｕｈａｎ Ｕｎｉｖｅｒｓｉｔｙ ｏｆ Ｓｃｉｅｎｃｅ ａｎｄ Ｔｅｃｈｎｏｌｏｇｙ，Ｃｏｌｌｅｇｅ ｏｆ Ｃｏｍｐｕｔｅｒ Ｓｃｉｅｎｃｅ ａｎｄ Ｔｅｃｈｎｏｌｏｇｙ，Ｗｕｈａｎ ４３００６５，Ｃｈｉｎａ）
Keywords:the development of Windows8 app store;make use of API;extract data from web page;plot mutable temperature curves
1 引 言(Introduction)
微软新的操作系统Windows8已经发布了，它拥有更为精 美的界面设计，操作也更简单快捷，
受到了一定范围的关注[1]。用户可以在win8应用商店里下 载不同种类的应用，比如我们最常用的:天气新闻类。在这类 应用当中，我们可以发现有许多应用只是集合某个优点,显得 太过于单一而难以被用户接受，或者说功能设计起来有点冗 余，普通用户甚至不清楚应用的某些功能的具体目的。针对 以上情况，本文提出了此类应用在开发过程中的设计思路， 用到的相关技术以及难点所在，志在为广大win8爱好者提供 学习平台以及为行内入门朋友分享开发经验。
</li> <!--共有5个<li>结点--> </ul> <ul class="newList"> <li><a title="北京空气..." target="_blank" href="climate/2014/04/qhbhyw/2089026.shtml"> 北京空气..</a><span>2014-04-03 10:13:59</ span> </li> <!--共有5个<li>结点--> </ul> <!--共有10个<ul> 标签--> </div> </div> </div> 也就是说一共有10段新闻，每段新闻里面又包含5条新 闻，于是可以很明显的找出这段Html代码的规律，只需要在 每一段新闻里面取第一条新闻即可(当然也可以根据不同需要 选择其他的新闻)[3]。 4.3 提取新闻内容 主要代码描述： private async void GetWeatherNews() { int newsNum = 0;//计数，只要9条新闻 App.httpClient = new HttpClient(); string html = await App.httpClient. GetStringAsync("http://www.weather.com.cn/news/ index.shtml");
//可以发现 "weatherMain"的 div是html文件的第18个
第17卷第5期
王 帆等：基于win8的天气新闻类应用实现
35
HtmlNode divNode1 = divNode.Descendants("div"). ElementAt(0);//得到"weatherLeft"子节点
HtmlNode divNode2 = divNode1.Descendants("div"). ElementAt(0);//得到"content_list1"子节点
对于获取预报天气和天气新闻，其实原理都是一样的， 都是运用第三方的一个类库，运用里面提供的某些方法来对 获取某个特定网页的信息，下面以获取天气新闻为例来说明 主要实现过程。 4.1 第三方类库HtmlAgilityPack.dll介绍
在开发过程中用到的最多的方法是以下几个，也是 HtmlAgilityPack.dll这个类库最核心的方法：
3 相关技术说明(Relevant technical description) 3.1 获取实时天气
中国气象局给广大开发者提供了一个免费的API，可以 用来查询国内所有城市的当前实时天气，该API的格式为： http://www.weather.com.cn/data/sk/城市编号.html， 其中城市编号是指中国气象局把全国的城市都编了一个号， 如武汉的编号为：101200101,通过访问此API，可以从中国气 象局获取最新的实时天气信息，格式为Json格式：
开发过程中的设计思路，用到的相关技术：如何使用API，如何提取动态网页中的数据，如何根据动态改变的温度值绘
制出正确的温度曲线。应用最终的成功开发表明，设计达到了最初的预期要求，并且对类似应用的开发与研究起了较好
的借鉴作用。
关键词：Windows8应用商店开发；使用API；提取网页数据；绘制动态温度曲线
Abstract:The development of WINDOWS8 app store is a brand new technology of Microsoft. This paper introduces a weather news application based on win8 in the process of developing the design train of thought.The use of related technologies:How to make use of API?How to extract data from dynamic Web page?How to plot correct temperature curves according to the mutable temperature values.The ultimate success of the exploring application manifests that this design has met the expected requirements and has offered successful experiences for other similar explorations and researches.
<div class="weatherMain"> <div class="weatherLeft">
<div class="content_list1"> <h1>天气资讯 </h1> <ul class="newList">
<li><a title="新疆乌鲁木齐.." target="_ blank" href="news/2014/04/2089342.shtml">新疆乌鲁木 齐..</a><span>2014-04-03 15:51:12</span>