1.项目目标

   制作一个自动联网的天气预报仪，在设计界面显示温湿度、天气情况、空气质量以及未来三天内的天气变化。

2.硬件介绍

Wio Terminal的运行速度为 120MHz (最高可达200MHz), 4MB 外部闪存和 192KB RAM。

Wio Terminal自身配有一个2.4英寸 LCD屏幕, 板载IMU(LIS3DHTR)，麦克风，蜂鸣器，microSD卡槽，光传感器和940nm红外发射器。 除了这些它还有两个用于Grove生态系统的多功能Grove接口和兼容Raspberry pi的40个GPIO引脚，用于支持更多附加组件。

3.主要代码

（1）页面的设置

void make_table(lv_obj_t * parent, JsonObject &obj_1, JsonObject &obj_2)
{

    lv_obj_t * table = lv_table_create(parent, NULL);
    lv_obj_clean_style_list(table, LV_TABLE_PART_BG);
    lv_obj_set_click(table, false);

    lv_table_set_col_cnt(table, 2);
    lv_table_set_row_cnt(table, 4);
    
    lv_coord_t w = lv_page_get_width_fit(parent) - 10;
    lv_table_set_col_width(table, 1, 3 * w / 10);
    lv_table_set_col_width(table, 1, w  / 4);
          
    lv_obj_set_pos(table, 130, 5);
    lv_obj_set_size(table, 190, 45);

    /*Fill the first column*/
    lv_table_set_cell_value(table, 0, 0, "Today");
    lv_table_set_cell_value(table, 1, 0, "TEMP('c)");
    lv_table_set_cell_value(table, 2, 0, "AQI");
    lv_table_set_cell_value(table, 3, 0, "RH(%)");

    /*Fill the second column*/
    char str_hum[20];
    char str_aqi[20];
    char str_temp[20];
    char str_high[20];
    char str_low[20];
    itoa(humidity, str_hum, 10);
    itoa(aqi, str_aqi, 10);
    itoa(temp_high, str_high, 10);
    itoa(temp_low, str_low, 10);
    sprintf(str_temp, "%s~%s", str_low, str_high);
    lv_table_set_cell_value(table, 0, 1, get_weather_type(code));
    lv_table_set_cell_value(table, 1, 1, str_temp);
    lv_table_set_cell_value(table, 2, 1, str_aqi);
    lv_table_set_cell_value(table, 3, 1, str_hum);
}

    // LOGO: keqng's Weather Report
    lv_obj_t * logo = lv_btn_create(page, NULL);
    lv_btn_set_fit(logo, LV_FIT_TIGHT);
    lv_obj_align(logo, NULL, LV_ALIGN_IN_TOP_LEFT, 0, 0);

    lv_obj_t * label = lv_label_create(logo, NULL);
    lv_label_set_text(label, "keqing's\nWeather\nReport~");
    
    
        
    // 城市显示
    lv_obj_t * city = lv_label_create(page, NULL);
    lv_label_set_text_fmt(city, "%s", city_name);
    lv_obj_set_pos(city, 10, 95);    
    
    // 当日日期显示
    lv_obj_t * date = lv_label_create(page, NULL);
    lv_label_set_text_fmt(date, "%s", date_name);
    lv_obj_set_pos(date, 10, 125);
    
    // 未来三天预报
    lv_obj_t * title_day1 = lv_label_create(page, NULL);
    lv_label_set_text(title_day1, date_day1);
    lv_obj_set_pos(title_day1, 10, 170);

    lv_obj_t * info_day1 = lv_label_create(page, NULL);
    lv_label_set_text(info_day1, get_weather_type(code_day2));
    lv_obj_set_pos(info_day1, 15, 190);    

    lv_obj_t * temp_day1 = lv_label_create(page, NULL);
    lv_label_set_text_fmt(temp_day1, "%d~%d", low_day1, high_day1);
    lv_obj_set_pos(temp_day1, 15, 210);     


    lv_obj_t * title_day2 = lv_label_create(page, NULL);
    lv_label_set_text(title_day2, date_day2);
    lv_obj_set_pos(title_day2, 110, 170);

    lv_obj_t * info_day2 = lv_label_create(page, NULL);
    lv_label_set_text(info_day2, get_weather_type(code_day2));
    lv_obj_set_pos(info_day2, 115, 190);  

    lv_obj_t * temp_day2 = lv_label_create(page, NULL);
    lv_label_set_text_fmt(temp_day2, "%d~%d", low_day2, high_day2);
    lv_obj_set_pos(temp_day2, 115, 210);      


    lv_obj_t * title_day3 = lv_label_create(page, NULL);
    lv_label_set_text(title_day3, date_day3);
    lv_obj_set_pos(title_day3, 210, 170);

    lv_obj_t * info_day3 = lv_label_create(page, NULL);
    lv_label_set_text(info_day3, get_weather_type(code_day3));
    lv_obj_set_pos(info_day3, 215, 190);  

    lv_obj_t * temp_day3 = lv_label_create(page, NULL);
    lv_label_set_text_fmt(temp_day3, "%d~%d", low_day3, high_day3);
    lv_obj_set_pos(temp_day3, 215, 210);          
            
    make_table(page, obj_1, obj_2);
}

(2)天气信息的调用

使用的api网址：心知天气https://www.seniverse.com/

设置当日天气信息的获取，包括气温，天气，湿度，空气质量，以及未来三天的气温和天气，同时显示日期

    // get today's weather info
    int code = obj_1["results"][0]["daily"][0]["day_code"];    
    int temp_high = obj_1["results"][0]["daily"][0]["high"];
    int temp_low = obj_1["results"][0]["daily"][0]["low"];
    int humidity = obj_1["results"][0]["daily"][0]["humidity"];
    int wind = obj_1["results"][0]["daily"][0]["wind_scale"];    

    int aqi = obj_2["results"][0]["air"]["city"]["aqi"]; 

void update_display(JsonObject &obj_1, JsonObject &obj_2)
{

    // today
    const char * date_name = obj_1["results"][0]["daily"][0]["date"];

    // day 1
    const char * date_day1 = obj_1["results"][0]["daily"][1]["date"];
    int high_day1 = obj_1["results"][0]["daily"][1]["high"];
    int low_day1 = obj_1["results"][0]["daily"][1]["low"];
    int code_day1 = obj_1["results"][0]["daily"][1]["day_code"];

    // day 2
    const char * date_day2 = obj_1["results"][0]["daily"][2]["date"];
    int high_day2 = obj_1["results"][0]["daily"][2]["high"];
    int low_day2 = obj_1["results"][0]["daily"][2]["low"];
    int code_day2 = obj_1["results"][0]["daily"][2]["day_code"];

    // day 3
    const char * date_day3 = obj_1["results"][0]["daily"][3]["date"];
    int high_day3 = obj_1["results"][0]["daily"][3]["high"];
    int low_day3 = obj_1["results"][0]["daily"][3]["low"];
    int code_day3 = obj_1["results"][0]["daily"][3]["day_code"];
    
    // display settings
    lv_obj_clean(lv_scr_act());

    lv_obj_t* page = lv_page_create(lv_scr_act(), NULL);
    lv_obj_set_size(page, LV_HOR_RES, LV_VER_RES);

（3）wifi的设置

注意一定要更新Wio Terminal硬件的wifi模块！！！

    // Set WiFi to station mode and disconnect from an AP if it was previously connected
    WiFi.mode(WIFI_STA);
    WiFi.disconnect();

    Serial.println("Connecting to WiFi..");
    WiFi.begin(ssid, password);

    while (WiFi.status() != WL_CONNECTED) {
        delay(500);
        Serial.println("Connecting to WiFi..");
        WiFi.begin(ssid, password);
    }
    Serial.println("Connected to the WiFi network");
    Serial.print("IP Address: ");
    Serial.println (WiFi.localIP()); // prints out the device's IP address
}

4.成果展示