Skip to content

UI color refactor #3034

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
ripplebiz wants to merge 6 commits into
base: dev
Choose a base branch
from
Open

UI color refactor #3034

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
b8504e5
* refactor of Color mapping in UITasks / DisplayDrivers
ripplebiz Jul 22, 2026
a96a66a
* build fixes for NullDisplayDriver
ripplebiz Jul 22, 2026
56274db
* build fixes for old ESP32 boards
ripplebiz Jul 22, 2026
3857f45
* monochrome displays now do _not_ invert titlebar
ripplebiz Jul 24, 2026
0c04a47
* fixed for mono ST7789 display driver
ripplebiz Jul 24, 2026
f83ad03
* T114 display fix
ripplebiz Jul 24, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
71 changes: 47 additions & 24 deletions examples/companion_radio/ui-new/UITask.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,23 +53,24 @@ class SplashScreen : public UIScreen {

int render(DisplayDriver& display) override {
// meshcore logo
display.setColor(DisplayDriver::BLUE);
display.setColor(UIColor::corp_blue);
int logoWidth = 128;
display.drawXbm((display.width() - logoWidth) / 2, 3, meshcore_logo, logoWidth, 13);

// meshcore website
const char* website = "https://meshcore.io";
display.setColor(DisplayDriver::LIGHT);
display.setColor(UIColor::primary_txt);
display.setTextSize(1);
uint16_t websiteWidth = display.getTextWidth(website);
display.setCursor((display.width() - websiteWidth) / 2, 22);
display.print(website);

// version info
display.setColor(DisplayDriver::LIGHT);
display.setColor(UIColor::primary_txt);
display.setTextSize(1);
display.drawTextCentered(display.width()/2, 35, _version_info);

display.setColor(UIColor::secondary_txt);
display.setTextSize(1);
display.drawTextCentered(display.width()/2, 48, FIRMWARE_BUILD_DATE);

Expand Down Expand Up @@ -128,7 +129,7 @@ class HomeScreen : public UIScreen {
int iconHeight = 10;
int iconX = display.width() - iconWidth - 5; // Position the icon near the top-right corner
int iconY = 0;
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::title_txt);

// battery outline
display.drawRect(iconX, iconY, iconWidth, iconHeight);
Expand All @@ -143,7 +144,7 @@ class HomeScreen : public UIScreen {
// show muted icon if buzzer is muted
#ifdef PIN_BUZZER
if (_task->isBuzzerQuiet()) {
display.setColor(DisplayDriver::RED);
display.setColor(UIColor::warning_txt);
display.drawXbm(iconX - 9, iconY + 1, muted_icon, 8, 8);
}
#endif
Expand Down Expand Up @@ -188,34 +189,41 @@ class HomeScreen : public UIScreen {
}

int render(DisplayDriver& display) override {
display.setColor(UIColor::title_bkg);
display.fillRect(0, 0, display.width(), 12);
char tmp[80];
// node name
display.setTextSize(1);
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::title_txt);
char filtered_name[sizeof(_node_prefs->node_name)];
display.translateUTF8ToBlocks(filtered_name, _node_prefs->node_name, sizeof(filtered_name));
display.setCursor(0, 0);
display.setCursor(0, 2);
display.print(filtered_name);

// battery voltage
renderBatteryIndicator(display, _task->getBattMilliVolts());

// curr page indicator
if (UIColor::title_bkg == UIColor::window_bkg) {
display.setColor(UIColor::title_txt);
} else {
display.setColor(UIColor::title_bkg);
}
int y = 14;
int x = display.width() / 2 - 5 * (HomePage::Count-1);
for (uint8_t i = 0; i < HomePage::Count; i++, x += 10) {
if (i == _page) {
display.fillRect(x-1, y-1, 3, 3);
display.fillRect(x-1, y-1, 4, 4);
} else {
display.fillRect(x, y, 1, 1);
display.fillRect(x, y, 2, 2);
}
}

if (_page == HomePage::FIRST) {
display.setColor(DisplayDriver::YELLOW);
display.setColor(UIColor::primary_txt);
display.setTextSize(2);
sprintf(tmp, "MSG: %d", _task->getMsgCount());
display.drawTextCentered(display.width() / 2, 20, tmp);
display.drawTextCentered(display.width() / 2, 22, tmp);

#ifdef WIFI_SSID
IPAddress ip = WiFi.localIP();
Expand All @@ -224,19 +232,19 @@ class HomeScreen : public UIScreen {
display.drawTextCentered(display.width() / 2, 54, tmp);
#endif
if (_task->hasConnection()) {
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::warning_txt);
display.setTextSize(1);
display.drawTextCentered(display.width() / 2, 43, "< Connected >");

} else if (the_mesh.getBLEPin() != 0) { // BT pin
display.setColor(DisplayDriver::RED);
display.setColor(UIColor::warning_txt);
display.setTextSize(2);
sprintf(tmp, "Pin:%d", the_mesh.getBLEPin());
display.drawTextCentered(display.width() / 2, 43, tmp);
}
} else if (_page == HomePage::RECENT) {
the_mesh.getRecentlyHeard(recent, UI_RECENT_LIST_SIZE);
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::primary_txt);
int y = 20;
for (int i = 0; i < UI_RECENT_LIST_SIZE; i++, y += 11) {
auto a = &recent[i];
Expand All @@ -260,7 +268,7 @@ class HomeScreen : public UIScreen {
display.print(tmp);
}
} else if (_page == HomePage::RADIO) {
display.setColor(DisplayDriver::YELLOW);
display.setColor(UIColor::primary_txt);
display.setTextSize(1);
// freq / sf
display.setCursor(0, 20);
Expand All @@ -279,15 +287,17 @@ class HomeScreen : public UIScreen {
sprintf(tmp, "Noise floor: %d", radio_driver.getNoiseFloor());
display.print(tmp);
} else if (_page == HomePage::BLUETOOTH) {
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::corp_blue);
display.drawXbm((display.width() - 32) / 2, 18,
_task->isSerialEnabled() ? bluetooth_on : bluetooth_off,
32, 32);
display.setColor(UIColor::secondary_txt);
display.setTextSize(1);
display.drawTextCentered(display.width() / 2, 64 - 11, "toggle: " PRESS_LABEL);
} else if (_page == HomePage::ADVERT) {
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::corp_blue);
display.drawXbm((display.width() - 32) / 2, 18, advert_icon, 32, 32);
display.setColor(UIColor::secondary_txt);
display.drawTextCentered(display.width() / 2, 64 - 11, "advert: " PRESS_LABEL);
#if ENV_INCLUDE_GPS == 1
} else if (_page == HomePage::GPS) {
Expand All @@ -305,24 +315,33 @@ class HomeScreen : public UIScreen {
#else
strcpy(buf, gps_state ? "gps on" : "gps off");
#endif
display.setColor(UIColor::primary_txt);
display.drawTextLeftAlign(0, y, buf);
if (nmea == NULL) {
y = y + 12;
display.setColor(UIColor::secondary_txt);
display.drawTextLeftAlign(0, y, "Can't access GPS");
} else {
display.setColor(UIColor::primary_txt);
strcpy(buf, nmea->isValid()?"fix":"no fix");
display.drawTextRightAlign(display.width()-1, y, buf);
y = y + 12;
display.setColor(UIColor::secondary_txt);
display.drawTextLeftAlign(0, y, "sat");
display.setColor(UIColor::primary_txt);
sprintf(buf, "%d", nmea->satellitesCount());
display.drawTextRightAlign(display.width()-1, y, buf);
y = y + 12;
display.setColor(UIColor::secondary_txt);
display.drawTextLeftAlign(0, y, "pos");
display.setColor(UIColor::primary_txt);
sprintf(buf, "%.4f %.4f",
nmea->getLatitude()/1000000., nmea->getLongitude()/1000000.);
display.drawTextRightAlign(display.width()-1, y, buf);
y = y + 12;
display.setColor(UIColor::secondary_txt);
display.drawTextLeftAlign(0, y, "alt");
display.setColor(UIColor::primary_txt);
sprintf(buf, "%.2f", nmea->getAltitude()/1000.);
display.drawTextRightAlign(display.width()-1, y, buf);
y = y + 12;
Expand Down Expand Up @@ -390,7 +409,9 @@ class HomeScreen : public UIScreen {
strcpy(name, "unk"); sprintf(buf, "");
}
display.setCursor(0, y);
display.setColor(UIColor::secondary_txt);
display.print(name);
display.setColor(UIColor::primary_txt);
display.setCursor(
display.width()-display.getTextWidth(buf)-1, y
);
Expand All @@ -401,11 +422,13 @@ class HomeScreen : public UIScreen {
else sensors_scroll_offset = 0;
#endif
} else if (_page == HomePage::SHUTDOWN) {
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::corp_blue);
display.setTextSize(1);
if (_shutdown_init) {
display.setColor(UIColor::warning_txt);
display.drawTextCentered(display.width() / 2, 34, "hibernating...");
} else {
display.setColor(UIColor::secondary_txt);
display.drawXbm((display.width() - 32) / 2, 18, power_icon, 32, 32);
display.drawTextCentered(display.width() / 2, 64 - 11, "hibernate:" PRESS_LABEL);
}
Expand Down Expand Up @@ -498,7 +521,7 @@ class MsgPreviewScreen : public UIScreen {
char tmp[16];
display.setCursor(0, 0);
display.setTextSize(1);
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::corp_blue);
sprintf(tmp, "Unread: %d", num_unread);
display.print(tmp);

Expand All @@ -518,13 +541,13 @@ class MsgPreviewScreen : public UIScreen {
display.drawRect(0, 11, display.width(), 1); // horiz line

display.setCursor(0, 14);
display.setColor(DisplayDriver::YELLOW);
display.setColor(UIColor::secondary_txt);
char filtered_origin[sizeof(p->origin)];
display.translateUTF8ToBlocks(filtered_origin, p->origin, sizeof(filtered_origin));
display.print(filtered_origin);

display.setCursor(0, 25);
display.setColor(DisplayDriver::LIGHT);
display.setColor(UIColor::primary_txt);
char filtered_msg[sizeof(p->msg)];
display.translateUTF8ToBlocks(filtered_msg, p->msg, sizeof(filtered_msg));
display.printWordWrap(filtered_msg, display.width());
Expand Down Expand Up @@ -806,9 +829,9 @@ void UITask::loop() {
_display->setTextSize(1);
int y = _display->height() / 3;
int p = _display->height() / 32;
_display->setColor(DisplayDriver::DARK);
_display->setColor(UIColor::popup_bkg);
_display->fillRect(p, y, _display->width() - p*2, y);
_display->setColor(DisplayDriver::LIGHT); // draw box border
_display->setColor(UIColor::popup_txt); // draw box border
_display->drawRect(p, y, _display->width() - p*2, y);
_display->drawTextCentered(_display->width() / 2, y + p*3, _alert);
_next_refresh = _alert_expiry; // will need refresh when alert is dismissed
Expand Down Expand Up @@ -845,7 +868,7 @@ void UITask::loop() {
if (_display != NULL) {
_display->startFrame();
_display->setTextSize(2);
_display->setColor(DisplayDriver::RED);
_display->setColor(UIColor::warning_txt);
_display->drawTextCentered(_display->width() / 2, 20, "Low Battery.");
_display->drawTextCentered(_display->width() / 2, 40, "Shutting Down!");
_display->endFrame();
Expand Down
27 changes: 13 additions & 14 deletions examples/companion_radio/ui-orig/UITask.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -167,7 +167,7 @@ void UITask::renderBatteryIndicator(uint16_t batteryMilliVolts) {
int iconHeight = 12;
int iconX = _display->width() - iconWidth - 5; // Position the icon near the top-right corner
int iconY = 0;
_display->setColor(DisplayDriver::GREEN);
_display->setColor(UIColor::primary_txt);

// battery outline
_display->drawRect(iconX, iconY, iconWidth, iconHeight);
Expand All @@ -188,7 +188,7 @@ void UITask::renderCurrScreen() {
_display->setTextSize(1.4);
uint16_t textWidth = _display->getTextWidth(_alert);
_display->setCursor((_display->width() - textWidth) / 2, 22);
_display->setColor(DisplayDriver::GREEN);
_display->setColor(UIColor::warning_txt);
_display->print(_alert);
_alert[0] = 0;
_need_refresh = true;
Expand All @@ -197,30 +197,29 @@ void UITask::renderCurrScreen() {
// render message preview
_display->setCursor(0, 0);
_display->setTextSize(1);
_display->setColor(DisplayDriver::GREEN);
_display->setColor(UIColor::primary_txt);
_display->print(_node_prefs->node_name);

_display->setCursor(0, 12);
_display->setColor(DisplayDriver::YELLOW);
_display->setColor(UIColor::secondary_txt);
_display->print(_origin);
_display->setCursor(0, 24);
_display->setColor(DisplayDriver::LIGHT);
_display->print(_msg);

_display->setCursor(_display->width() - 28, 9);
_display->setTextSize(2);
_display->setColor(DisplayDriver::ORANGE);
_display->setColor(UIColor::primary_txt);
sprintf(tmp, "%d", _msgcount);
_display->print(tmp);
_display->setColor(DisplayDriver::YELLOW); // last color will be kept on T114
_display->setColor(UIColor::secondary_txt); // last color will be kept on T114
} else if ((millis() - ui_started_at) < BOOT_SCREEN_MILLIS) { // boot screen
// meshcore logo
_display->setColor(DisplayDriver::BLUE);
_display->setColor(UIColor::corp_blue);
int logoWidth = 128;
_display->drawXbm((_display->width() - logoWidth) / 2, 3, meshcore_logo, logoWidth, 13);

// version info
_display->setColor(DisplayDriver::LIGHT);
_display->setColor(UIColor::primary_txt);
_display->setTextSize(1);
uint16_t textWidth = _display->getTextWidth(_version_info);
_display->setCursor((_display->width() - textWidth) / 2, 22);
Expand All @@ -229,15 +228,15 @@ void UITask::renderCurrScreen() {
// node name
_display->setCursor(0, 0);
_display->setTextSize(1);
_display->setColor(DisplayDriver::GREEN);
_display->setColor(UIColor::primary_txt);
_display->print(_node_prefs->node_name);

// battery voltage
renderBatteryIndicator(_board->getBattMilliVolts());

// freq / sf
_display->setCursor(0, 20);
_display->setColor(DisplayDriver::YELLOW);
_display->setColor(UIColor::secondary_txt);
sprintf(tmp, "FREQ: %06.3f SF%d", _node_prefs->freq, _node_prefs->sf);
_display->print(tmp);

Expand All @@ -248,14 +247,14 @@ void UITask::renderCurrScreen() {

// BT pin
if (!_connected && the_mesh.getBLEPin() != 0) {
_display->setColor(DisplayDriver::RED);
_display->setColor(UIColor::warning_txt);
_display->setTextSize(2);
_display->setCursor(0, 43);
sprintf(tmp, "Pin:%d", the_mesh.getBLEPin());
_display->print(tmp);
_display->setColor(DisplayDriver::GREEN);
_display->setColor(UIColor::primary_txt);
} else {
_display->setColor(DisplayDriver::LIGHT);
_display->setColor(UIColor::primary_txt);
}
}
_need_refresh = false;
Expand Down
2 changes: 1 addition & 1 deletion examples/companion_radio/ui-tiny/ScrollingStatusBar.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ class ScrollingStatusBar {
if (_status[0] == 0) return;

display.setTextSize(1);
display.setColor(DisplayDriver::GREEN);
display.setColor(UIColor::primary_txt);

// if (_needs_redraw) {
// _text_width = display.getTextWidth(_status);
Expand Down
Loading
Loading