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
|
mosi_pin: GPIO13
|
||||||
miso_pin: GPIO12
|
miso_pin: GPIO12
|
||||||
|
|
||||||
# ILI9341 Display (2.4" 240x320)
|
# ILI9488 Display (3.5" 320x480, portrait)
|
||||||
display:
|
display:
|
||||||
- platform: ili9xxx
|
- platform: ili9xxx
|
||||||
model: ILI9341
|
model: ILI9488
|
||||||
spi_id: tft_spi
|
spi_id: tft_spi
|
||||||
cs_pin: GPIO15
|
cs_pin: GPIO15
|
||||||
dc_pin: GPIO2
|
dc_pin: GPIO2
|
||||||
@@ -75,8 +75,8 @@ display:
|
|||||||
color_order: bgr
|
color_order: bgr
|
||||||
data_rate: 40MHz
|
data_rate: 40MHz
|
||||||
dimensions:
|
dimensions:
|
||||||
width: 240
|
width: 320
|
||||||
height: 320
|
height: 480
|
||||||
id: my_display
|
id: my_display
|
||||||
auto_clear_enabled: false
|
auto_clear_enabled: false
|
||||||
update_interval: 2s
|
update_interval: 2s
|
||||||
@@ -97,45 +97,45 @@ display:
|
|||||||
bool all_done = id(penelope_medicated).state && id(tess_medicated).state;
|
bool all_done = id(penelope_medicated).state && id(tess_medicated).state;
|
||||||
auto border_color = all_done ? green : red;
|
auto border_color = all_done ? green : red;
|
||||||
|
|
||||||
// Draw border (8 pixels thick)
|
// Draw border (10 pixels thick)
|
||||||
int border = 8;
|
int border = 10;
|
||||||
it.filled_rectangle(0, 0, 240, border, border_color); // Top
|
it.filled_rectangle(0, 0, 320, border, border_color); // Top
|
||||||
it.filled_rectangle(0, 320 - border, 240, border, border_color); // Bottom
|
it.filled_rectangle(0, 480 - border, 320, border, border_color); // Bottom
|
||||||
it.filled_rectangle(0, 0, border, 320, border_color); // Left
|
it.filled_rectangle(0, 0, border, 480, border_color); // Left
|
||||||
it.filled_rectangle(240 - border, 0, border, 320, border_color); // Right
|
it.filled_rectangle(320 - border, 0, border, 480, border_color); // Right
|
||||||
|
|
||||||
// Title
|
// 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)
|
// Penelope button (top button)
|
||||||
int btn_x = 30;
|
int btn_x = 40;
|
||||||
int btn_y = 60;
|
int btn_y = 90;
|
||||||
int btn_w = 180;
|
int btn_w = 240;
|
||||||
int btn_h = 80;
|
int btn_h = 120;
|
||||||
|
|
||||||
auto penelope_color = id(penelope_medicated).state ? green : red;
|
auto penelope_color = id(penelope_medicated).state ? green : red;
|
||||||
it.filled_rectangle(btn_x, btn_y, btn_w, btn_h, penelope_color);
|
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.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");
|
it.printf(btn_x + btn_w/2, btn_y + btn_h/2, id(button_font), white, TextAlign::CENTER, "Penelope");
|
||||||
if (id(penelope_medicated).state) {
|
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)
|
// Tess button (middle button)
|
||||||
btn_y = 155;
|
btn_y = 230;
|
||||||
auto tess_color = id(tess_medicated).state ? green : red;
|
auto tess_color = id(tess_medicated).state ? green : red;
|
||||||
it.filled_rectangle(btn_x, btn_y, btn_w, btn_h, tess_color);
|
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.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");
|
it.printf(btn_x + btn_w/2, btn_y + btn_h/2, id(button_font), white, TextAlign::CENTER, "Tess");
|
||||||
if (id(tess_medicated).state) {
|
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)
|
// Reset button (bottom, smaller)
|
||||||
int reset_x = 70;
|
int reset_x = 110;
|
||||||
int reset_y = 260;
|
int reset_y = 395;
|
||||||
int reset_w = 100;
|
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.filled_rectangle(reset_x, reset_y, reset_w, reset_h, dark_grey);
|
||||||
it.rectangle(reset_x, reset_y, reset_w, reset_h, black);
|
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");
|
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
|
touchscreen_id: my_touchscreen
|
||||||
name: "Penelope Button"
|
name: "Penelope Button"
|
||||||
id: penelope_button
|
id: penelope_button
|
||||||
x_min: 30
|
x_min: 40
|
||||||
x_max: 210
|
x_max: 280
|
||||||
y_min: 60
|
y_min: 90
|
||||||
y_max: 140
|
y_max: 210
|
||||||
on_press:
|
on_press:
|
||||||
then:
|
then:
|
||||||
- switch.toggle: penelope_medicated
|
- switch.toggle: penelope_medicated
|
||||||
@@ -172,10 +172,10 @@ binary_sensor:
|
|||||||
touchscreen_id: my_touchscreen
|
touchscreen_id: my_touchscreen
|
||||||
name: "Tess Button"
|
name: "Tess Button"
|
||||||
id: tess_button
|
id: tess_button
|
||||||
x_min: 30
|
x_min: 40
|
||||||
x_max: 210
|
x_max: 280
|
||||||
y_min: 155
|
y_min: 230
|
||||||
y_max: 235
|
y_max: 350
|
||||||
on_press:
|
on_press:
|
||||||
then:
|
then:
|
||||||
- switch.toggle: tess_medicated
|
- switch.toggle: tess_medicated
|
||||||
@@ -184,10 +184,10 @@ binary_sensor:
|
|||||||
touchscreen_id: my_touchscreen
|
touchscreen_id: my_touchscreen
|
||||||
name: "Reset Button"
|
name: "Reset Button"
|
||||||
id: reset_button
|
id: reset_button
|
||||||
x_min: 70
|
x_min: 110
|
||||||
x_max: 170
|
x_max: 210
|
||||||
y_min: 260
|
y_min: 395
|
||||||
y_max: 300
|
y_max: 450
|
||||||
on_press:
|
on_press:
|
||||||
then:
|
then:
|
||||||
- switch.turn_off: penelope_medicated
|
- switch.turn_off: penelope_medicated
|
||||||
|
|||||||
Reference in New Issue
Block a user