Monday, June 27, 2022

WebApp for Singapore Weather forecasts rewritten using Flutter

I thought the old Singapore Weather Nowcast WebApp at this site https://dominoc925-pages.appspot.com/webapp/weather_sg/default.html written using the AngularJS framework and Bootstrap was a good candidate for a Flutter app. So I rolled up the sleeves and rewrote it using Flutter. Now it has Material design and this is how it looks and works.

4 day outlooks

For the Flutter version, I included additional data from the National Environment Agency (NEA)'s 4 day outlooks with temperature, wind and humidity values.


2 hour nowcasts

The 2 hour weather nowcast is now displayed in a responsive 2 pane display.


On small screens, a tab bar will appear displaying the nowcast list and map on separate tabs. 

 

24 hour forecasts

The new 24 hour forecasts are separated by 3 tabs as shown in the screenshot below. Clicking each tab will show the forecast for that time period. And like the 2 hour nowcast display, the 24 hour forecasts display is also responsive to screen sizes.

To try out the new Flutter WebApp, visit this web site: https://dominoc925-pages.appspot.com/webapp/weather_sg/default.html.