YouRetires® is a home-brew Retirement Countdown Clock built on the Elecrow CrowPanel HMI platform. The CrowPanel features a 5.0″ capacitive touch display with a built-in ESP32-S3 module. The project code, written in the Arduino-ESP32 IDE, accepts a user-provided future retirement date and calculates and displays actual work days remaining (excluding holidays and weekends) as well as the real remaining time in years, months and days.
Projects, videos and instructional blog posts like this take a lot of effort to research and produce. If this has been helpful or interesting, please consider a donation to help offset the extensive time and effort I put into these projects. Your support for small creators like me is greatly appreciated. Also, it has been shown that donating will allow much positive karma, fortune and mojo to come your way.
The internal real-time clock of the ESP32 is initially set via an NTP call to a pool of internet time servers with consideration for local time zone to account for daylight saving time. The internal RTC is updated at a set time each day, and the main screen display is updated each minute with the current date and time.
Once the retirement date is set by the user via the on-screen adjustment calendar, the date is stored in EEPROM of the ESP32 to avoid having to re-enter in the case of a power outage.
While there are a good number of complex routines and logic to calculate the work days and actual time remaining, the processor handles it with no lag and therefore the calculations are reevaluated every minute when the display time is updated for immediate updates.
Hardware Requirements
Obviously an Elecrow CrowPanel 5.0″ HMI Display is needed, and I highly recommend purchasing the acrylic case for a few dollars which is a perfect fit. I created 3D-printed legs to attach via screws to the provided inserts on the acrylic case. The CrowPanel 5.0″ (ESP32 S3, Flash 4MB, SRAM 512K) that I coded for is a version 2. Note that newer CrowPanel models may be version 3 and the code would need a few small updates to handle this.
IDE / Library Requirements
Getting the Arduino ESP32 Integrated Development Environment (IDE) and all the necessary libraries set up successfully for this project can be a challenge. The main issue relates to compatibility of the library versions with each other as well as with the CrowPanel hardware. Simply changing the version of one dependent library to a slightly higher or lower version can render the project inoperable, usually in the form of continuous reboots of the ESP32 or simply a blank display screen.
With that in mind, I will list the versions that I know work at the time of this writing. I suggest starting with these versions as a base, and once working, carefully venture into updating one library at a time as needed.
Arduino IDE 2.3.4
LovyanGFX 1.2.0 library (by lovyan03)
Time 1.6.1 library (by Michael Margolis)
lvgl 8.3.11 library (by kisvegabor)
SquareLine Studio 1.5.0 (only needed to modify the display screens)
Board Manager / Settings
esp32 by Espressif Systems 3.1.2(board manager)
Arduino IDE Settings
ESP32 S3 Dev Module
Flash Mode: “QIO 80MHz”
Flash Size: “4MB (32 Mb)”
Partition Scheme: “Huge APP (3MB)”
PSRAM: “OPI PSRAM”
The Code
The project code is written in C++ for the ESP32 in the Arduino IDE.
We will dispense with the library #include clutter and focus on key code areas since the full code base is available on GitHub:
YouRetires® Arduino-ESP32 Retirement Countdown Clock (for CrowPanel 5.0″)
WiFi credentials are defined in a separate include file named “secrets.h”. Static IP address, subnet, gateway and primary DNS are assigned.
// WiFi Credentials / IP Setup
const char* ssid = SECRET_WIFISSID;
const char* password = SECRET_WIFIPASS;
IPAddress ip(192, 168, 20, 22);
IPAddress gateway(192, 168, 20, 1);
IPAddress subnet(255, 255, 255, 0);
IPAddress dns(192, 168, 20, 1); //primaryDNSTime zone parameters are set for my location, Eastern Standard Time and Eastern Daylight Saving Time, as well as the pool of NTP servers. configTzTime will be called later whenever the internal real-time clock needs to be set from the internet.
// Time variables
const char *ntpServer1 = "pool.ntp.org";
const char *ntpServer2 = "time.nist.gov";
const char *time_zone = "EST5EDT,M3.2.0,M11.1.0"; // TimeZone rule for America/New_York including daylight adjustment rules Global project variables are set up, including those which will hold the retirement date, clock update time and how often to update the screen display fields. One minute was chosen so the current time is updated every minute.
// Global Project variables
struct tm gtimeinfo;
Preferences gpreferences;
bool gblnFirstRun = true;
bool gblnFirstRun2 = true;
unsigned int guintRetireMonth = 0;
unsigned int guintRetireDay = 0;
unsigned int guintRetireYear = 0;
unsigned int guintDaysRemaining = 0;
unsigned int guintUpdateHour = 2; // hour of day to update internal clock via NTP
unsigned int guintUpdateMin = 2; // minute of day to update internal clock via NTP
const unsigned long gulngUpdateInterval = 1 * 60000ul; // (1 minute in milliseconds) - how often to update display fields GetRetireDate() is a function that retrieves the stored retirement date from EEPROM and updates the retirment date on the display.
SetRetireDate() is a function that stores an updated retirement date to EEPROM and updates the retirement date on the display.
DisplayRemainingRawDays() is a function that calls another function CalculateDaysBetweenDates() that returns the actual number of work days between two dates, excluding holidays and weekends. For our use, the two dates are the current date and the projected retirement date.
void DisplayRemainingRawDays()
{
guintDaysRemaining = CalculateDaysBetweenDates(gtimeinfo.tm_year+1900, gtimeinfo.tm_mon+1, gtimeinfo.tm_mday, guintRetireYear, guintRetireMonth, guintRetireDay);
Serial.print("Number of RAW days is: ");
Serial.println(guintDaysRemaining);
char chrRawDays[8];
sprintf(chrRawDays, "%d", guintDaysRemaining);
lv_label_set_text(ui_Days, chrRawDays);
}A lot of calculations happen in CalculateDaysBetweenDates(). The holidays selected by default are typical state government holidays. Note that the actual days for some holidays were selected as close but not exact for each year. For example, President’s Day is not always February 15, but “close enough for government work.”
These can be changed if desired. Or add or remove holidays as needed by adjusting the holidays[] array.
// Check if it’s a holiday
unsigned int holidaysCount = 0;
int holidays[][12] = {
{1, 1}, // New's Years Day
{1, 20}, // Martin Luther King Day
{2, 15}, // President's Day
{5, 31}, // Memorial Day
{6, 19}, // Juneteenth
{7, 4}, // July 4
{9, 1}, // Labor Day
{10, 13}, // Columbus Day
{11, 14}, // Veteran's Day
{11, 27}, // Thanksgiving
{11, 28}, // Thanksgiving Friday
{12, 25} // Christmas
};CalculateTimeDiff() is a helper function to calculate and return time difference between start date and end date. This is used to assure that the user can chose only a retirement date on the adjustment calendar that is at least 1 day into the future.
Function DisplayRemainingYMD() calls CalculateYMD() to calculate and display the remaining actual years, months and days until the set retirement date. The actual number of days in each month as well as leap years are taken into consideration.
// Define the number of days in each month
int monthDays(int month, int year) {
int daysInMonth[] = {31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31};
if (month == 2 && isLeapYear(year)) {
return 29;
}
return daysInMonth[month - 1];
}
// Is this a leap year?
bool isLeapYear(int year) {
if (year % 4 == 0) {
if (year % 100 == 0) {
if (year % 400 == 0) {
return true;
}
return false;
}
return true;
}
return false;
}Nothing spectacular happens in the remaining code or setup().
loop() is the standard Arduino loop repeat function. It’s main purpose is to refresh the main display handler, check if the retirement adjustment calendar was triggered via the user, check if the daily internet time update should be triggered and update the current time field every minute.
On the first run through loop(), the real-time clock is set via NTP (there may be some delay in the NTP response) and the retirement date is read from EEPROM and all calculations are done and displayed.
There is a simple status bar at the bottom of the display that shows the last date and time the real-time clock was updated via NTP. The internals of the NTP library seems to update the time via NTP every 3 hours by default, as well as the manually requested update at 2:02 am each day. The status bar will be green if everything is good and red while waiting for the NTP update.
Required Manual Code Changes
lv_calendar_header_dropdown.c
The lvgl library version 8.4.0 adds the ability to set the range of calendar years in the on-screen dropdown control via code. Unfortunately, upgrading the lvgl above 8.3.11 causes incompatibility errors with SquareLine Studio and CrowPanel.
Therefore, one must manually make edits directly in the code for the lvgl library component lv_calendar_header_dropdown.c before compiling.
Depending on your Arduino IDE installation options, the location of lv_calendar_header_dropdown.c is probably:
C:\Users\<username>\Documents\Arduino\libraries\lvgl\src\extra\widgets\calendar\lv_calendar_header_dropdown.cChange year_list as follows:
static const char * year_list = {"2055\n2054\n2053\n2052\n2051\n2050\n2049\n2048\n2047\n2046\n2045\n2044\n2043\n2042\n2041\n2040\n2039\n2038\n2037\n2036\n2035\n2034\n2033\n2032\n2031\n2030\n2029\n2028\n2027\n2026\n2025"};Further down in the code, change the newd.year to 2055 to reflect the changes to year_list above:
newd.year = 2055 - sel;Last, scroll down and change the year to 2055 in this calculation:
lv_dropdown_set_selected(year_dd, 2055 - cur_date->year);Updating the UI via SquareLine Studio
If changes are made to the display screen layout via SquareLine Studio, several manual code changes are REQUIRED after the new UI code has been exported from SquareLine Studio into the Arduino ESP32 project code.
ui.h
add the highlighted lines indicated 9 and 10 below at the end of the //SCREEN: ui_RetirementAdjustScreen section:
// SCREEN: ui_RetirementAdjustScreen
void ui_RetirementAdjustScreen_screen_init(void);
void ui_event_RetirementAdjustScreen(lv_event_t * e);
extern lv_obj_t * ui_RetirementAdjustScreen;
extern lv_obj_t * ui_RetirementAdjustPanel;
extern lv_obj_t * ui_lblRetirementAdjust;
void ui_event_RetirementCalendar(lv_event_t * e);
extern lv_obj_t * ui_RetirementCalendar;
extern bool calendardate_trigger;
extern lv_calendar_date_t calendardate;
// CUSTOM VARIABLESui_events.c
(It may be necessary to to close Arduino IDE studio and reopen, then modify this file and save again. Restart and check that the file shows the newly modified code as below. Completely replace whatever is in ui_events.c initially with the below code:
#include "ui.h"
bool calendardate_trigger = false;
lv_calendar_date_t calendardate;
void GetDateFromCalendarWidget(lv_event_t * e)
{
if(lv_calendar_get_pressed_date(ui_RetirementCalendar, &calendardate))
{
lv_calendar_set_today_date(ui_RetirementCalendar, calendardate.year, calendardate.month, calendardate.day);
calendardate_trigger = true;
}
}ui_RetirementAdjustScreen.c
Add the highlighted line indicated 6 below near the bottom of the file in the location shown:
ui_RetirementCalendar = lv_calendar_create(ui_RetirementAdjustPanel);
lv_calendar_set_today_date(ui_RetirementCalendar, 2025, 1, 1);
lv_calendar_set_showed_date(ui_RetirementCalendar, 2025, 1);
lv_obj_t * ui_RetirementCalendar_header = lv_calendar_header_arrow_create(ui_RetirementCalendar);
lv_calendar_header_dropdown_create(ui_RetirementCalendar);
lv_obj_set_width(ui_RetirementCalendar, 685);
lv_obj_set_height(ui_RetirementCalendar, 371);
lv_obj_set_x(ui_RetirementCalendar, 0);
lv_obj_set_y(ui_RetirementCalendar, 11);
lv_obj_set_align(ui_RetirementCalendar, LV_ALIGN_BOTTOM_MID);Remember to save all files, then recompile and upload the sketch.
Why “YouRetires”?
Lastly, why is the project called YouRetires?
I have been a user of Quicken financial accounting software for over 25 years. There exists a retirement planning section in the software that considers many investment and personal factors to monitor and report progress towards having a successful retirement portfolio. The user provides a projected retirement date as one piece of data and the program displays a graph of portfolio balance over time until retirement.
For years, and still now in 2025, it shows the retirement date on the graph as: “You retires“. I always laughed at the grammar and was fascinated that year after year no one ever noticed or fixed the issue.
It seemed destined to become the name of my project.