Update display configuration for Cat Medication Tracker: change model to ILI9488 and adjust dimensions and button placements
This commit is contained in:
@@ -62,10 +62,10 @@ spi:
|
||||
mosi_pin: GPIO13
|
||||
miso_pin: GPIO12
|
||||
|
||||
# ILI9341 Display (2.4" 240x320)
|
||||
# ILI9488 Display (3.5" 320x480, portrait)
|
||||
display:
|
||||
- platform: ili9xxx
|
||||
model: ILI9341
|
||||
model: ILI9488
|
||||
spi_id: tft_spi
|
||||
cs_pin: GPIO15
|
||||
dc_pin: GPIO2
|
||||
@@ -75,8 +75,8 @@ display:
|
||||
color_order: bgr
|
||||
data_rate: 40MHz
|
||||
dimensions:
|
||||
width: 240
|
||||
height: 320
|
||||
width: 320
|
||||
height: 480
|
||||
id: my_display
|
||||
auto_clear_enabled: false
|
||||
update_interval: 2s
|
||||
@@ -89,53 +89,53 @@ display:
|
||||
auto white = Color(255, 255, 255);
|
||||
auto black = Color(0, 0, 0);
|
||||
auto dark_grey = Color(80, 80, 80);
|
||||
|
||||
|
||||
// Fill background with light grey
|
||||
it.fill(light_grey);
|
||||
|
||||
|
||||
// Border color: green if all cats medicated, red otherwise
|
||||
bool all_done = id(penelope_medicated).state && id(tess_medicated).state;
|
||||
auto border_color = all_done ? green : red;
|
||||
|
||||
// Draw border (8 pixels thick)
|
||||
int border = 8;
|
||||
it.filled_rectangle(0, 0, 240, border, border_color); // Top
|
||||
it.filled_rectangle(0, 320 - border, 240, border, border_color); // Bottom
|
||||
it.filled_rectangle(0, 0, border, 320, border_color); // Left
|
||||
it.filled_rectangle(240 - border, 0, border, 320, border_color); // Right
|
||||
|
||||
|
||||
// Draw border (10 pixels thick)
|
||||
int border = 10;
|
||||
it.filled_rectangle(0, 0, 320, border, border_color); // Top
|
||||
it.filled_rectangle(0, 480 - border, 320, border, border_color); // Bottom
|
||||
it.filled_rectangle(0, 0, border, 480, border_color); // Left
|
||||
it.filled_rectangle(320 - border, 0, border, 480, border_color); // Right
|
||||
|
||||
// Title
|
||||
it.printf(120, 25, id(title_font), black, TextAlign::TOP_CENTER, "Cat Meds");
|
||||
|
||||
it.printf(160, 30, id(title_font), black, TextAlign::TOP_CENTER, "Cat Meds");
|
||||
|
||||
// Penelope button (top button)
|
||||
int btn_x = 30;
|
||||
int btn_y = 60;
|
||||
int btn_w = 180;
|
||||
int btn_h = 80;
|
||||
|
||||
int btn_x = 40;
|
||||
int btn_y = 90;
|
||||
int btn_w = 240;
|
||||
int btn_h = 120;
|
||||
|
||||
auto penelope_color = id(penelope_medicated).state ? green : red;
|
||||
it.filled_rectangle(btn_x, btn_y, btn_w, btn_h, penelope_color);
|
||||
it.rectangle(btn_x, btn_y, btn_w, btn_h, dark_grey);
|
||||
it.printf(btn_x + btn_w/2, btn_y + btn_h/2, id(button_font), white, TextAlign::CENTER, "Penelope");
|
||||
if (id(penelope_medicated).state) {
|
||||
it.printf(btn_x + btn_w/2, btn_y + btn_h - 15, id(status_font), white, TextAlign::CENTER, "DONE");
|
||||
it.printf(btn_x + btn_w/2, btn_y + btn_h - 20, id(status_font), white, TextAlign::CENTER, "DONE");
|
||||
}
|
||||
|
||||
|
||||
// Tess button (middle button)
|
||||
btn_y = 155;
|
||||
btn_y = 230;
|
||||
auto tess_color = id(tess_medicated).state ? green : red;
|
||||
it.filled_rectangle(btn_x, btn_y, btn_w, btn_h, tess_color);
|
||||
it.rectangle(btn_x, btn_y, btn_w, btn_h, dark_grey);
|
||||
it.printf(btn_x + btn_w/2, btn_y + btn_h/2, id(button_font), white, TextAlign::CENTER, "Tess");
|
||||
if (id(tess_medicated).state) {
|
||||
it.printf(btn_x + btn_w/2, btn_y + btn_h - 15, id(status_font), white, TextAlign::CENTER, "DONE");
|
||||
it.printf(btn_x + btn_w/2, btn_y + btn_h - 20, id(status_font), white, TextAlign::CENTER, "DONE");
|
||||
}
|
||||
|
||||
|
||||
// Reset button (bottom, smaller)
|
||||
int reset_x = 70;
|
||||
int reset_y = 260;
|
||||
int reset_x = 110;
|
||||
int reset_y = 395;
|
||||
int reset_w = 100;
|
||||
int reset_h = 40;
|
||||
int reset_h = 55;
|
||||
it.filled_rectangle(reset_x, reset_y, reset_w, reset_h, dark_grey);
|
||||
it.rectangle(reset_x, reset_y, reset_w, reset_h, black);
|
||||
it.printf(reset_x + reset_w/2, reset_y + reset_h/2, id(status_font), white, TextAlign::CENTER, "RESET");
|
||||
@@ -160,10 +160,10 @@ binary_sensor:
|
||||
touchscreen_id: my_touchscreen
|
||||
name: "Penelope Button"
|
||||
id: penelope_button
|
||||
x_min: 30
|
||||
x_max: 210
|
||||
y_min: 60
|
||||
y_max: 140
|
||||
x_min: 40
|
||||
x_max: 280
|
||||
y_min: 90
|
||||
y_max: 210
|
||||
on_press:
|
||||
then:
|
||||
- switch.toggle: penelope_medicated
|
||||
@@ -172,10 +172,10 @@ binary_sensor:
|
||||
touchscreen_id: my_touchscreen
|
||||
name: "Tess Button"
|
||||
id: tess_button
|
||||
x_min: 30
|
||||
x_max: 210
|
||||
y_min: 155
|
||||
y_max: 235
|
||||
x_min: 40
|
||||
x_max: 280
|
||||
y_min: 230
|
||||
y_max: 350
|
||||
on_press:
|
||||
then:
|
||||
- switch.toggle: tess_medicated
|
||||
@@ -184,10 +184,10 @@ binary_sensor:
|
||||
touchscreen_id: my_touchscreen
|
||||
name: "Reset Button"
|
||||
id: reset_button
|
||||
x_min: 70
|
||||
x_max: 170
|
||||
y_min: 260
|
||||
y_max: 300
|
||||
x_min: 110
|
||||
x_max: 210
|
||||
y_min: 395
|
||||
y_max: 450
|
||||
on_press:
|
||||
then:
|
||||
- switch.turn_off: penelope_medicated
|
||||
|
||||
Reference in New Issue
Block a user