This project was described earlier in Instructables

My dad is always interested in the latest news and the latest weather information. So that brought me to the perfect birthday gift when he became 76: A small alway-on weather station with no nonsense, it just sits quietly in a corner all day and gives a summary of the latest predictions. 

It is designed around two Dutch websites. Probably you can see that on the funny local title of this topic! One gives the local forecast per city every 10 minutes in json format. The other one gives the rain forecast for the next two hours in plain text format which is always handy to know. I’m sure if you are not living in the Netherlands you can easily adapt this topic to any other service.

Supplies:

  • An ESP8266 board; suggest to use a Wemos D1 mini
  • A 1.8 inch TFT screen with 128*160 dots; 16 bit color
  • A few cables
  • The program as is or to start with to create your own
  • A nice box to put it all together. Use a standard one or print your own with the design attached.

Step 1: Make the prototype

Connecting screen and controller

Use a small flat cable and solder the board and the TFT screen together. Use the list to connect the parts ion the right way

TFT SCREEN —————— WEMOS

LED ——————————- D8 
SCK ——————————- D5
SDA ——————————- D7
A0 ———————————- D3
RESET —————————- D2
CS ———————————- D4
GND ——————————- GND
VCC ——————————- 3V3

Alternatively you can put the LED on 3v3 instead of pin D8. I have used pin D8 to have the device to go to sleep at around 23:00 at night and wake around 07:00 again. Effective this will be the first moment it reads the weather bulletin after that time, since it reads the header to check the time. There is no real time clock in this device.

If this all works plugin your usb cable to the Wemos and load the software. If it all works you can start building the box.

Step 2: Program Design

My ideas of this weather device where

  • Easily adaptable to another wifi environment 
  • Display weather forecast and rain forecast 
  • No buttons 
  • No sound, simple qui, no fuzz

With that in mind I created a program which starts with the WifiManager code when it cannot discover a known Wifi network. It creates its own network and shows the name on the display. This gives you the chance to set the Wifi parameters to your own home network. 

After this setup it shows the weather forecast and the rain precipiation in turns, every 20 seconds. If for some reason it is not possible to read the next forecast, a small error number will be displayed at the right side of the display; and the previous image will be shown. In the next run a new attempt is done to retrieve the information.

The weather information is received from the site in a json style message. The info in it is converted and saved in global variables. In this way we can decouple the retrieval of the information from displaying it. There is no reason to retrieve the weather faster as once per 10 minutes.

Getting the rain precipiation is even more simpler. It is served in plain text format, with the amount of rain expected as a value 0..255; a vertical bar; a time on each line. This for every 5 minutes for the next 2 hours. The rainvalue is delivered in a smart way where small values give more room to show the difference as larger values. The used formula is as follows:

mmhour = round(pow(10,(rainvalue – 109) / 32) * 10) / 10;

Note that the “times 10, divide by 10” is trick to ensure we have 1 decimal behind the dot. Depending on the maximum amount of rain expected the coming 2 hours there are 3 scales used for the graph;

  1. Max of 5 mm/hour expected 
  2. Max of 20 mm/hour expected 
  3. Max is taken from the highest value in the forecast

Here in the Netherlands the all-time-high our value lies around 80 mm/hour; so this scale will perfectly do. For other countries it might be wise to change this.

Step 3: Program Code

Editor settings

The software for this weather device is created in the Arduino programming environment. You will find it attached here for your convenience. Use it as is; or change it to suit your needs. All text which can be displayed at the TFT screen are DEFINEd on top of the program; which means you can easily change it to your own language if you want. I used the Wemos D1 mini, but similar boards will work as well.

In the Arduino environment I used the following settings;

  • Board : LOLIN(WEMOS) D1 RA & Mini 
  • Upload Speed : 115200 
  • CPU freq : 80 MHz 
  • Flash Size : 4M (No SPIFFS) V2 Lower Memory Disabled

Software timers are used to make the loop() easier and more readable. The display of the information is separated from the download of the information. In this way we can use other screen sizes etc without having to change the whole program.

Use the .ino file and load it in the arduino editor. Setup your board in the editor. Attach the header file which ensures the needed C-style PROGMEM arrays are included in the program. 


SD card

Note that most of the available 1.8 inch displays have a SD card slot at the back of the screen. This is a nice feature which helps you storing large images on the card. Most of the micro-controllers do not have too much memory on board so that helps. 

Although I spend a lot of time trying to get the SD card to work with the display I was not able to have a workable situation. I could use the display; retrieve a file from the SD card successfully, but after that I could no longer reach the TFT screen. Changing libraries, changing order of the libraries, and “undressing” the program to the smallest body to rule out other possibilities did not help me. 

To add to my frustration; there are tons of examples on the internet of people doing similar things with positive result, hmmm. Might be a hardware issue on my TFT screen? Or something I did not think of? Any suggestions are welcome for a next attempt. At the end after spending some evenings on it; I decided to leave that path. Since the pictures are only 50×50 pixels (which results to 5000 bytes each at 16 bit color) the ESP is capable to store this in PROGMEM with ease. So that is the trick I used. 

This choice resulted in yet another challenge. How to get the BMP picture I had into a readable format. After some searching I discovered the site from Henning Karlsen who solved this puzzle earlier. He created a program which converts PNG type files to C style arrays. Thanks Henning!

Attachments

todo

Step 4: Create the box

This is not the first box I needed. Lots of standard boxes are available from suppliers. Using a small saw, a knife, drill etc it is easy to create a hole for the display in the box. But I nevermanaged to make a exact nice rectangle. Probably not enough skills and/or patience 😉

The solution: I was lucky. I have a college who is like superman if it comes to fiddle with technical stuff. That includes 3D design and printing as well. So he decided to offer lots of his free time to measure the TFT display and the micro controller and create a box around it. It all fits nicely, have a look at the pictures. It even contains snap ons for the display, a hole for the USB connector, and a place to fix the micro controller.

Thanks Arjan for this super job done!!! Even better, he was so kind to give everyone acces to his work, so if you download his files from the link and use it for your own 3D printer you can create the same box with content.