Arduino + ESP32-C3 + TFT（1.8‘ ST7735S）基础平台（实验五）温湿度

 --------------------------------------------------------------------------------------------------------

 ​​​​​​Arduino + ESP32-C3 + TFT（1.8‘ ST7735S）基础平台

Arduino + ESP32-C3 + TFT（1.8‘ ST7735S）基础平台（实验一）

Arduino + ESP32-C3 + TFT（1.8‘ ST7735S）基础平台（实验二）玩具示波器

Arduino + ESP32-C3 + TFT（1.8‘ ST7735S）基础平台（实验三）折腾 TFT_eSPI 库

Arduino + ESP32-C3 + TFT（1.8‘ ST7735S）基础平台（实验四）直接显示网络图片

Arduino + ESP32-C3 + TFT（1.8‘ ST7735S）基础平台（实验五）温湿度

--------------------------------------------------------------------------------------------------------

最近天气历史性的。。。热！ 有必要关注一下存在感平时比较低的温湿度，下面程序并不是新的，把之前做的替换为速度比较快的 TFT_eSPI 库（前篇有详细设置），刷新快好多，比较满意了。

--------------------------------------------------------------------------------------------------------

硬件连接：

用到零件为：

• 合宙 ESP32-C3
• 合宙 1.8' ST7735S TFT
• AHT10  （DHT11精度低，AHT10买了4个，3个一致性比较好，算是便宜货里面堪用的）

不需要杜邦线，仔细看图和程序，注意看USB口确定方向。

• TFT ：右上角开始的连续 8 个孔。
• 空 3 个孔（被TFT遮挡）
• AHT10 ：紧挨着TFT的连续 4个孔；
• 空 1 个孔 （右下角）

8 3 4 1 。。。好熟悉 。。。

ESP32-C3 直插 TFT 演示https://v.youku.com/v_show/id_XNTg5NDM2ODQ1Ng==.html

 上面照片可以看出，只焊接了右边一排的 排母， 左边因为会被 TFT 遮挡的原因可以不焊，需要用到时可以焊接一排 弯排针 （弯排母比较少见），这样就不冲突了。

需要注意的是：这样插虽然比较方便，但 AHT10 过于靠近 ESP32-C3与TFT ，容易受到这两发热的影响。也就是说只有刚加电时AHT10的读数是准的，后续可能偏高一度左右。追求完美着需要引出4条杜邦线，让AHT远离热源。

--------------------------------------------------------------------------------------------------------------------

程序 

没有做花里胡哨的太空人，把尽可能把显示面积用在需要的数值上，甚至湿度都不要小数点了，毕竟没太多必要追求湿度的精度。

第一排 AHT10 传感器温湿度

第二排 天气网站 在线温湿度

第三排 天气网站 天气的英文描述。暂时没想好怎么处理，后期可能会读在线天气图标，这比较符合主流玩法。先学习下纯正的英文天气描述也没坏处，比如 晚上的 晴 怎么说： clear sky， 反正学历教育的这么多年我是白学了。

第四排 在线时钟，上电后等一会同步

程序仅保证适配我自己这个“基础平台”的连接方法（上图这样直接插） 

需要替换三处 xxxx， 两个为 WiFi，后一个为 appid，  天气网站 免费注册后获得。

程序跑起来没问题后，可以再去修改为自己的城市 id 或 经纬度。

程序里面有浮点转字符串的方法，因为TFT库自己不处理这个，没有串口打印方便。

/* ESP32-C3 TFT_eSPI AHT10，显示本地和网络温湿度 网络时钟 ，ESP32 ESP8266 因为引脚原因，不能使用此程序 */

#include <WiFi.h>
#include <HTTPClient.h>
#include <WiFiUdp.h>
#include <WiFiClient.h>
#include <NTPClient.h>
#include <ArduinoJson.h>  // 按错误提示在线更新库

#include <Adafruit_AHT10.h>
Adafruit_AHT10 aht; 

int timeZone = 8; // 时区 +8 
WiFiUDP ntpUDP;
NTPClient timeClient(ntpUDP, "ntp.aliyun.com", timeZone*3600, 60000);
WiFiClient client;
HTTPClient http;

#include <TFT_eSPI.h> 
#include <SPI.h>
TFT_eSPI tft = TFT_eSPI();
 
void setup()
{   
  Serial.begin(115200);  // 暂时用不上
  
  /*tft这段为屏幕初始化，觉得Hello字样没意思可以只保留这段的头两行*/
  tft.init();
  tft.setRotation(1);     // 0=默认排针向上 1=逆时针转90°
  tft.fillScreen(TFT_RED);
  tft.fillRect(2, 2, 156, 124, TFT_BLACK);
  tft.setCursor(10, 20);  // 坐标为文字的左上角
  tft.setTextColor(ST7735_YELLOW); 
  tft.setTextSize(1);
  tft.println("Hello");  
  tft.setCursor(10, 30); 
  tft.setTextColor(ST7735_GREEN); 
  tft.setTextSize(2);
  tft.println("Hello");
  tft.setCursor(10, 48); 
  tft.setTextColor(ST7735_BLUE); 
  tft.setTextSize(3);
  tft.println("Hello");
  tft.setCursor(10, 76); 
  tft.setTextColor(ST7735_CYAN); 
  tft.setTextSize(4);
  tft.println("Hello");  

  /*AHT需要电流小，按 C3引脚排列用 9 做供电Gnd， 刚好可以插在 TFT旁边*/
  pinMode(9, OUTPUT);digitalWrite(9, LOW); // AHT10 GND
  
  WiFi.begin("xxxx", "xxxx");           
  Wire.begin(/*SDA*/4,/*SCL*/8); 
  aht.begin();
  timeClient.begin();
}
 
void loop()
{    
    Serial.println("开始一轮新的测温");
    
    /* ---------- 以下为数据获得部分 ------------- */    
    sensors_event_t  aht_humidity, aht_temp;                            // sensors_event_t Adafruit定义的结构体struct
    aht.getEvent(&aht_humidity, &aht_temp);                             // 采集一次传感器
    char temp_aht[6]; dtostrf(aht_temp.temperature,3,1,temp_aht);       // 浮点转字符串 （用temp_aht[5]无显示，原因不明）
    char hum_aht[6]; dtostrf(aht_humidity.relative_humidity,3,0,hum_aht);
    
    http.begin(client,"http://api.openweathermap.org/data/2.5/weather?q=Chengdu,CN&APPID=xxxx");
    int    website_return_code = http.GET()        ;
    String website_return_text = http.getString()  ;  
 
    DynamicJsonDocument doc(1024)                  ;
    deserializeJson(doc, website_return_text)      ;    
    JsonObject obj   = doc.as<JsonObject>()        ; 
 
    float  temp       = float(obj["main"]["temp"]) -273.15  ;    
    char   temp_web[6]; dtostrf(temp,3,1,temp_web) ;   // 浮点数在print()可以限制位数，但TFT显示没有相关功能。dtostrf()浮点转字符并限制小数点后位数，暂时没有找到更好的办法。       
    int    hum_web    = obj["main"]["humidity"]             ;
    int    pressure   = obj["main"]["pressure"]             ;
    String weather    = obj["weather"][0]["description"]    ;
    int    wind       = obj["wind"]["speed"]                ;           
    int    visibility = obj["visibility"]                   ;

    timeClient.update();

    /* ---------- 以下为 TFT 显示部分 ------------- */        
    tft.fillScreen(ST7735_BLACK);                      // 清屏      
    tft.setCursor(15, 0); tft.setTextColor(ST7735_CYAN);  tft.setTextSize(3); tft.print(temp_aht); tft.println(hum_aht);      
    tft.setCursor(15, 27);tft.setTextColor(ST7735_GREEN); tft.setTextSize(3); tft.print(temp_web); tft.print(" "); tft.println(hum_web);      
    tft.setCursor(0, 52); tft.setTextColor(ST7735_ORANGE);tft.setTextSize(2); tft.println(weather);   
    tft.setCursor(5, 90); tft.setTextColor(ST7735_WHITE); tft.setTextSize(5); tft.print(timeClient.getFormattedTime());  
    
    delay(20000);                                      // 网页抓数据不能太频繁，避免服务器屏蔽：20秒一次
}

 如果想显示温度历史曲线，把温度值保存到数组，再按屏幕宽度绘制下曲线。。。即可。 

-----------------------------------------------------------------------------------------------------

天气图标也可以在线获得，比如下文，需要的自己琢磨下吧。

MSN 天气爬取

https://assets.msn.com/weathermapdata/1/static/icons/106/AAehOqD.png