Android 天气APP（十一）未来七天的天气预报、逐小时预报、UI优化

| 206 | 疾风 | High Wind, Near Gale | 206.png |

| 207 | 大风 | Gale | 207.png |

| 208 | 烈风 | Strong Gale | 208.png |

| 209 | 风暴 | Storm | 209.png |

| 210 | 狂爆风 | Violent Storm | 210.png |

| 211 | 飓风 | Hurricane | 211.png |

| 212 | 龙卷风 | Tornado | 212.png |

| 213 | 热带风暴 | Tropical Storm | 213.png |

| 300 | 阵雨 | Shower Rain | 300.png |

| 301 | 强阵雨 | Heavy Shower Rain | 301.png |

| 302 | 雷阵雨 | Thundershower | 302.png |

| 303 | 强雷阵雨 | Heavy Thunderstorm | 303.png |

| 304 | 雷阵雨伴有冰雹 | Thundershower with hail | 304.png |

| 305 | 小雨 | Light Rain | 305.png |

| 306 | 中雨 | Moderate Rain | 306.png |

| 307 | 大雨 | Heavy Rain | 307.png |

| 308 | 极端降雨 | Extreme Rain | 308.png |

| 309 | 毛毛雨/细雨 | Drizzle Rain | 309.png |

| 310 | 暴雨 | Storm | 310.png |

| 311 | 大暴雨 | Heavy Storm | 311.png |

| 312 | 特大暴雨 | Severe Storm | 312.png |

| 313 | 冻雨 | Freezing Rain | 313.png |

| 314 | 小到中雨 | Light to moderate rain | 314.png |

| 315 | 中到大雨 | Moderate to heavy rain | 315.png |

| 316 | 大到暴雨 | Heavy rain to storm | 316.png |

| 317 | 暴雨到大暴雨 | Storm to heavy storm | 317.png |

| 318 | 大暴雨到特大暴雨 | Heavy to severe storm | 318.png |

| 399 | 雨 | Rain | 399.png |

| 400 | 小雪 | Light Snow | 400.png |

| 401 | 中雪 | Moderate Snow | 401.png |

| 402 | 大雪 | Heavy Snow | 402.png |

| 403 | 暴雪 | Snowstorm | 403.png |

| 404 | 雨夹雪 | Sleet | 404.png |

| 405 | 雨雪天气 | Rain And Snow | 405.png |

| 406 | 阵雨夹雪 | Shower Snow | 406.png |

| 407 | 阵雪 | Snow Flurry | 407.png |

| 408 | 小到中雪 | Light to moderate snow | 408.png |

| 409 | 中到大雪 | Moderate to heavy snow | 409.png |

| 410 | 大到暴雪 | Heavy snow to snowstorm | 410.png |

| 499 | 雪 | Snow | 499.png |

| 500 | 薄雾 | Mist | 500.png |

| 501 | 雾 | Foggy | 501.png |

| 502 | 霾 | Haze | 502.png |

| 503 | 扬沙 | Sand | 503.png |

| 504 | 浮尘 | Dust | 504.png |

| 507 | 沙尘暴 | Duststorm | 507.png |

| 508 | 强沙尘暴 | Sandstorm | 508.png |

| 509 | 浓雾 | Dense fog | 509.png |

| 510 | 强浓雾 | Strong fog | 510.png |

| 511 | 中度霾 | Moderate haze | 511.png |

| 512 | 重度霾 | Heavy haze | 512.png |

| 513 | 严重霾 | Severe haze | 513.png |

| 514 | 大雾 | Heavy fog | 514.png |

| 515 | 特强浓雾 | Extra heavy fog | 515.png |

| 900 | 热 | Hot | 900.png |

| 901 | 冷 | Cold | 901.png |

| 999 | 未知 | Unknown | 999.png |

七天的天气预报和UI优化

---

在我修改图标颜色的过程中，发现有好几个天气代码的图标是一模一样的，所以代码中判断显示的时候会有几个状态码对应的图标一样，提前说明，不要见怪。

接下里就是修改天气预报列表的item的布局文件了。

item_weather_forecast_list.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android=“http://schemas.android.com/apk/res/android”

android:orientation=“vertical”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”>

<LinearLayout

android:gravity=“center_vertical”

android:padding=“@dimen/sp_12”

android:orientation=“horizontal”

android:layout_width=“match_parent”

android:layout_height=“wrap_content”>

<TextView

android:id=“@+id/tv_date”

android:text=“1234”

android:textSize=“@dimen/sp_14”

android:textColor=“#FFF”

android:layout_width=“0dp”

android:layout_weight=“1”

android:layout_height=“wrap_content”/>

<TextView

android:visibility=“gone”

android:gravity=“center”

android:id=“@+id/tv_info”

android:textSize=“@dimen/sp_14”

android:textColor=“#FFF”

android:layout_width=“0dp”

android:layout_weight=“1”

android:layout_height=“wrap_content”/>

<ImageView

android:id=“@+id/iv_weather_state”

android:background=“@mipmap/icon_100”

android:layout_width=“30dp”

android:layout_height=“30dp”/>

<TextView

android:gravity=“right”

android:id=“@+id/tv_low_and_height”

android:textSize=“@dimen/sp_14”

android:textColor=“#FFF”

android:layout_width=“0dp”

android:layout_weight=“1”

android:layout_height=“wrap_content”/>

改动并不大，加了一个ImageView而已,然后在创建工具类

在utils包下创建一个WeatherUtil类

代码如下：

package com.llw.goodweather.utils;

import android.widget.ImageView;

import com.llw.goodweather.R;

/**

• 天气工具类

*/

public class WeatherUtil {

/**

• 根据传入的状态码修改填入的天气图标

• @param weatherStateIcon 显示的ImageView

• @param code 天气状态码

*/

public static void changeIcon(ImageView weatherStateIcon,int code){

switch (code){

case 100://晴

weatherStateIcon.setBackgroundResource(R.mipmap.icon_100);

break;

case 101://多云

weatherStateIcon.setBackgroundResource(R.mipmap.icon_101);

break;

case 102://少云

weatherStateIcon.setBackgroundResource(R.mipmap.icon_102);

break;

case 103://晴间多云

weatherStateIcon.setBackgroundResource(R.mipmap.icon_103);

break;

case 200://有风

case 202://微风

case 203://和风

case 204://清风

weatherStateIcon.setBackgroundResource(R.mipmap.icon_200);//因为这几个状态的图标是一样的

break;

case 201://平静

weatherStateIcon.setBackgroundResource(R.mipmap.icon_201);

break;

case 205://强风/劲风

case 206://疾风

case 207://大风

weatherStateIcon.setBackgroundResource(R.mipmap.icon_205);//因为这几个状态的图标是一样的

break;

case 208://烈风

case 209://风暴

case 210://狂爆风

case 211://飓风

case 212://龙卷风

case 213://热带风暴

weatherStateIcon.setBackgroundResource(R.mipmap.icon_208);//因为这几个状态的图标是一样的

break;

case 300://阵雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_300);

break;

case 301://强阵雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_301);

break;

case 302://雷阵雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_302);

break;

case 303://强雷阵雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_303);

break;

case 304://雷阵雨伴有冰雹

weatherStateIcon.setBackgroundResource(R.mipmap.icon_304);

break;

case 305://小雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_305);

break;

case 306://中雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_306);

break;

case 307://大雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_307);

break;

case 308://极端降雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_312);

break;

case 309://毛毛雨/细雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_309);

break;

case 310://暴雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_310);

break;

case 311://大暴雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_311);

break;

case 312://特大暴雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_312);

break;

case 313://冻雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_313);

break;

case 314://小到中雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_306);

break;

case 315://中到大雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_307);

break;

case 316://大到暴雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_310);

break;

case 317://大暴雨到特大暴雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_312);

break;

case 399://雨

weatherStateIcon.setBackgroundResource(R.mipmap.icon_399);

break;

case 400://小雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_400);

break;

case 401://中雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_401);

break;

case 402://大雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_402);

break;

case 403://暴雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_403);

break;

case 404://雨夹雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_404);

break;

case 405://雨雪天气

weatherStateIcon.setBackgroundResource(R.mipmap.icon_405);

break;

case 406://阵雨夹雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_406);

break;

case 407://阵雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_407);

break;

case 408://小到中雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_408);

break;

case 409://中到大雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_409);

break;

case 410://大到暴雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_410);

break;

case 499://雪

weatherStateIcon.setBackgroundResource(R.mipmap.icon_499);

break;

case 500://薄雾

weatherStateIcon.setBackgroundResource(R.mipmap.icon_500);

break;

case 501://雾

weatherStateIcon.setBackgroundResource(R.mipmap.icon_501);

break;

case 502://霾

weatherStateIcon.setBackgroundResource(R.mipmap.icon_502);

break;

case 503://扬沙

weatherStateIcon.setBackgroundResource(R.mipmap.icon_503);

break;

case 504://扬沙

weatherStateIcon.setBackgroundResource(R.mipmap.icon_504);

break;

case 507://沙尘暴

weatherStateIcon.setBackgroundResource(R.mipmap.icon_507);

break;

case 508://强沙尘暴

weatherStateIcon.setBackgroundResource(R.mipmap.icon_508);

break;

case 509://浓雾

case 510://强浓雾

case 514://大雾

case 515://特强浓雾

weatherStateIcon.setBackgroundResource(R.mipmap.icon_509);

break;

case 511://中度霾

weatherStateIcon.setBackgroundResource(R.mipmap.icon_511);

break;

case 512://重度霾

weatherStateIcon.setBackgroundResource(R.mipmap.icon_512);

break;

case 513://严重霾

weatherStateIcon.setBackgroundResource(R.mipmap.icon_513);

break;

case 900://热

weatherStateIcon.setBackgroundResource(R.mipmap.icon_900);

break;

case 901://冷

weatherStateIcon.setBackgroundResource(R.mipmap.icon_901);

break;

case 999://未知

weatherStateIcon.setBackgroundResource(R.mipmap.icon_999);

break;

}

}

}

WeatherForecastAdapter.java中做判断显示图标，代码如下：

package com.llw.goodweather.adapter;

import android.widget.ImageView;

import androidx.annotation.Nullable;

import com.chad.library.adapter.base.BaseQuickAdapter;

import com.chad.library.adapter.base.BaseViewHolder;

import com.llw.goodweather.R;

import com.llw.goodweather.bean.WeatherForecastResponse;

import com.llw.goodweather.utils.WeatherUtil;

import java.util.List;

/**

• 天气预报列表展示适配器

*/

public class WeatherForecastAdapter extends BaseQuickAdapter<WeatherForecastResponse.HeWeather6Bean.DailyForecastBean, BaseViewHolder> {

public WeatherForecastAdapter(int layoutResId, @Nullable List<WeatherForecastResponse.HeWeather6Bean.DailyForecastBean> data) {

super(layoutResId, data);

}

@Override

protected void convert(BaseViewHolder helper, WeatherForecastResponse.HeWeather6Bean.DailyForecastBean item) {

helper.setText(R.id.tv_date, item.getDate())//日期

// .setText(R.id.tv_info, item.getCond_txt_d())//天气

.setText(R.id.tv_low_and_height, item.getTmp_min() + “/” + item.getTmp_max() + “℃”);//最低温和最高温

//天气状态图片

ImageView weatherStateIcon = helper.getView(R.id.iv_weather_state);

int code = Integer.parseInt(item.getCond_code_d());//获取天气状态码，根据状态码来显示图标

WeatherUtil.changeIcon(weatherStateIcon,code);//调用工具类中写好的方法

}

}

因为写作过程中，还有其他事情，所以并不是一蹴而就的，当我写适配器代码的时候就我的邮箱就已经收到通过审核的短信了，你如果没有收到也不要着急，只要资料没有问题，审核还是蛮快的，关键看审核的人员那个时候有没有帮你审核。现在我成为一个认证开发者了，那么可以直接运行一下。

再切换一个城市

从这个运行的效果图来看，完成了两件事，第一个就是未来七天的天气预报，这个只要你通过了审核，成为开发者，返回的数据自然就变成7天的，第二个就是UI优化，感觉图标显示还是比文字显示更好一些，这个就属于细节优化问题了，因为这个细节，你还是要做很多准备工作的。

逐小时预报和UI优化

---

https://free-api.heweather.net/s6/weather/hourly?location=%E7%A6%8F%E7%94%B0&key=3086e91d66c04ce588a7f538f917c7f4

访问测试地址，请以自己的Key去访问，返回的结果

在bean包下创建一个HourlyResponse.java，里面的代码如下：

package com.llw.goodweather.bean;

import java.util.List;

public class HourlyResponse {

private List HeWeather6;

public List getHeWeather6() {

return HeWeather6;

}

public void setHeWeather6(List HeWeather6) {

this.HeWeather6 = HeWeather6;

}

public static class HeWeather6Bean {

/**

• basic : {“cid”:“CN101280603”,“location”:“福田”,“parent_city”:“深圳”,“admin_area”:“广东”,“cnty”:“中国”,“lat”:“22.5410099”,“lon”:“114.05095673”,“tz”:“+8.00”}

• update : {“loc”:“2020-04-28 19:56”,“utc”:“2020-04-28 11:56”}

• status : ok

• hourly : [{“cloud”:“43”,“cond_code”:“101”,“cond_txt”:“多云”,“dew”:“19”,“hum”:“71”,“pop”:“0”,“pres”:“1010”,“time”:“2020-04-28 22:00”,“tmp”:“23”,“wind_deg”:“82”,“wind_dir”:“东风”,“wind_sc”:“1-2”,“wind_spd”:“2”},{“cloud”:“35”,“cond_code”:“100”,“cond_txt”:“晴”,“dew”:“18”,“hum”:“74”,“pop”:“0”,“pres”:“1011”,“time”:“2020-04-29 01:00”,“tmp”:“22”,“wind_deg”:“14”,“wind_dir”:“东北风”,“wind_sc”:“1-2”,“wind_spd”:“11”},{“cloud”:“69”,“cond_code”:“100”,“cond_txt”:“晴”,“dew”:“18”,“hum”:“72”,“pop”:“0”,“pres”:“1011”,“time”:“2020-04-29 04:00”,“tmp”:“21”,“wind_deg”:“43”,“wind_dir”:“东北风”,“wind_sc”:“1-2”,“wind_spd”:“4”},{“cloud”:“90”,“cond_code”:“101”,“cond_txt”:“多云”,“dew”:“19”,“hum”:“62”,“pop”:“0”,“pres”:“1008”,“time”:“2020-04-29 07:00”,“tmp”:“21”,“wind_deg”:“53”,“wind_dir”:“东北风”,“wind_sc”:“1-2”,“wind_spd”:“9”},{“cloud”:“91”,“cond_code”:“101”,“cond_txt”:“多云”,“dew”:“19”,“hum”:“58”,“pop”:“0”,“pres”:“1008”,“time”:“2020-04-29 10:00”,“tmp”:“27”,“wind_deg”:“45”,“wind_dir”:“东北风”,“wind_sc”:“1-2”,“wind_spd”:“10”},{“cloud”:“75”,“cond_code”:“101”,“cond_txt”:“多云”,“dew”:“18”,“hum”:“59”,“pop”:“0”,“pres”:“1009”,“time”:“2020-04-29 13:00”,“tmp”:“29”,“wind_deg”:“32”,“wind_dir”:“东北风”,“wind_sc”:“1-2”,“wind_spd”:“4”},{“cloud”:“59”,“cond_code”:“100”,“cond_txt”:“晴”,“dew”:“18”,“hum”:“60”,“pop”:“0”,“pres”:“1009”,“time”:“2020-04-29 16:00”,“tmp”:“27”,“wind_deg”:“50”,“wind_dir”:“东北风”,“wind_sc”:“1-2”,“wind_spd”:“6”},{“cloud”:“37”,“cond_code”:“101”,“cond_txt”:“多云”,“dew”:“19”,“hum”:“61”,“pop”:“0”,“pres”:“1008”,“time”:“2020-04-29 19:00”,“tmp”:“26”,“wind_deg”:“-1”,“wind_dir”:“无持续风向”,“wind_sc”:“1-2”,“wind_spd”:“2”}]

*/

private BasicBean basic;

private UpdateBean update;

private String status;

private List hourly;

public BasicBean getBasic() {

return basic;

}

public void setBasic(BasicBean basic) {

this.basic = basic;

}

public UpdateBean getUpdate() {

return update;

}

public void setUpdate(UpdateBean update) {

this.update = update;

}

public String getStatus() {

return status;

}

public void setStatus(String status) {

this.status = status;

}

public List getHourly() {

return hourly;

}

public void setHourly(List hourly) {

this.hourly = hourly;

}

public static class BasicBean {

/**

• cid : CN101280603

• location : 福田

• parent_city : 深圳

• admin_area : 广东

• cnty : 中国

• lat : 22.5410099

• lon : 114.05095673

• tz : +8.00

*/

private String cid;

private String location;

private String parent_city;

private String admin_area;

private String cnty;

private String lat;

private String lon;

private String tz;

public String getCid() {

return cid;

}

public void setCid(String cid) {

this.cid = cid;

}

public String getLocation() {

return location;

}

public void setLocation(String location) {

this.location = location;

}

public String getParent_city() {

return parent_city;

}

public void setParent_city(String parent_city) {

this.parent_city = parent_city;

}

public String getAdmin_area() {

return admin_area;

}

public void setAdmin_area(String admin_area) {

this.admin_area = admin_area;

}

public String getCnty() {

return cnty;

}

public void setCnty(String cnty) {

this.cnty = cnty;

}

public String getLat() {

return lat;

}

public void setLat(String lat) {

this.lat = lat;

}

public String getLon() {

return lon;

}

public void setLon(String lon) {

this.lon = lon;

}

public String getTz() {

return tz;

}

public void setTz(String tz) {

this.tz = tz;

}

}

public static class UpdateBean {

/**

• loc : 2020-04-28 19:56

• utc : 2020-04-28 11:56

*/

private String loc;

private String utc;

public String getLoc() {

return loc;

}

public void setLoc(String loc) {

this.loc = loc;

}

public String getUtc() {

return utc;

}

public void setUtc(String utc) {

this.utc = utc;

}

}

public static class HourlyBean {

/**

• cloud : 43

• cond_code : 101

• cond_txt : 多云

• dew : 19

• hum : 71

• pop : 0

• pres : 1010

• time : 2020-04-28 22:00

• tmp : 23

• wind_deg : 82

• wind_dir : 东风

• wind_sc : 1-2

• wind_spd : 2

*/

private String cloud;

private String cond_code;

private String cond_txt;

private String dew;

private String hum;

private String pop;

private String pres;

private String time;

private String tmp;

private String wind_deg;

private String wind_dir;

private String wind_sc;

private String wind_spd;

public String getCloud() {

return cloud;

}

public void setCloud(String cloud) {

this.cloud = cloud;

}

public String getCond_code() {

return cond_code;

}

public void setCond_code(String cond_code) {

this.cond_code = cond_code;

}

public String getCond_txt() {

return cond_txt;

}

public void setCond_txt(String cond_txt) {

this.cond_txt = cond_txt;

}

public String getDew() {

return dew;

}

public void setDew(String dew) {

this.dew = dew;

}

public String getHum() {

return hum;

}

public void setHum(String hum) {

this.hum = hum;

}

public String getPop() {

return pop;

}

public void setPop(String pop) {

this.pop = pop;

}

public String getPres() {

return pres;

}

public void setPres(String pres) {

this.pres = pres;

}

public String getTime() {

return time;

}

public void setTime(String time) {

this.time = time;

}

public String getTmp() {

return tmp;

}

public void setTmp(String tmp) {

this.tmp = tmp;

}

public String getWind_deg() {

return wind_deg;

}

public void setWind_deg(String wind_deg) {

this.wind_deg = wind_deg;

}

public String getWind_dir() {

return wind_dir;

}

public void setWind_dir(String wind_dir) {

this.wind_dir = wind_dir;

}

public String getWind_sc() {

return wind_sc;

}

public void setWind_sc(String wind_sc) {

this.wind_sc = wind_sc;

}

public String getWind_spd() {

return wind_spd;

}

public void setWind_spd(String wind_spd) {

this.wind_spd = wind_spd;

}

}

}

}

页面渲染的数据从这些返回实体里面取，下一步，创建接口，打开ApiService.java

在里面增加

注意Key用自己的，然后创建订阅，打开WeatherContract.java

订阅方法

/**

• 逐小时预报

• @param context

• @param location

*/

public void hourly(final Context context,String location){

ApiService service = ServiceGenerator.createService(ApiService.class,0);

service.getHourly(location).enqueue(new NetCallBack() {

@Override

public void onSuccess(Call call, Response response) {

if(getView() != null){