643 lines
23 KiB
YAML
643 lines
23 KiB
YAML
lvgl:
|
|
id: lvgl_comp
|
|
displays:
|
|
- lcd_display
|
|
touchscreens:
|
|
- touch_gt911
|
|
pages:
|
|
- id: page_home
|
|
widgets:
|
|
- obj:
|
|
width: 100%
|
|
height: 100%
|
|
pad_all: 0
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
widgets:
|
|
- label:
|
|
align: top_left
|
|
x: 70
|
|
y: 20
|
|
text: "-- --" # static placeholder clock — live time is a fast-follow, no time: component this pass
|
|
text_font: montserrat_16
|
|
- obj:
|
|
id: mode_toggle
|
|
align: top_mid
|
|
y: 12
|
|
width: 400px
|
|
height: 44px
|
|
radius: 22
|
|
bg_color: 0x333333
|
|
border_width: 0
|
|
outline_width: 0
|
|
pad_all: 4
|
|
scrollable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: row
|
|
flex_align_cross: center
|
|
flex_align_track: center
|
|
flex_align_main: space_evenly
|
|
widgets:
|
|
- button:
|
|
id: toggle_temp_btn
|
|
width: 120px
|
|
height: 36px
|
|
radius: 18
|
|
bg_color: 0xFFFFFF
|
|
on_click:
|
|
- lvgl.widget.show: temp_view
|
|
- lvgl.widget.hide: status_view
|
|
- lvgl.widget.update:
|
|
id: toggle_temp_btn
|
|
bg_color: 0xFFFFFF
|
|
- lvgl.widget.update:
|
|
id: toggle_status_btn
|
|
bg_opa: transp
|
|
widgets:
|
|
- label:
|
|
text: "Temp"
|
|
text_color: 0x000000
|
|
text_font: montserrat_16
|
|
- button:
|
|
id: toggle_status_btn
|
|
width: 120px
|
|
height: 36px
|
|
radius: 18
|
|
bg_opa: transp
|
|
on_click:
|
|
- lvgl.widget.show: status_view
|
|
- lvgl.widget.hide: temp_view
|
|
- lvgl.widget.update:
|
|
id: toggle_status_btn
|
|
bg_color: 0xFFFFFF
|
|
- lvgl.widget.update:
|
|
id: toggle_temp_btn
|
|
bg_opa: transp
|
|
widgets:
|
|
- label:
|
|
text: "Status"
|
|
text_font: montserrat_16
|
|
- button:
|
|
width: 120px
|
|
height: 36px
|
|
radius: 18
|
|
bg_opa: transp
|
|
widgets:
|
|
- label:
|
|
text: "My Home"
|
|
text_font: montserrat_16
|
|
- label:
|
|
align: top_right
|
|
x: -16
|
|
y: 20
|
|
text: "Firecrest"
|
|
text_font: montserrat_16
|
|
- obj:
|
|
id: quick_actions_rail
|
|
align: top_left
|
|
x: 16
|
|
y: 90px
|
|
width: 190px
|
|
height: size_content
|
|
pad_all: 8
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
bg_opa: transp
|
|
clickable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: stretch
|
|
flex_align_track: start
|
|
flex_align_main: start
|
|
widgets:
|
|
- button:
|
|
height: 60px
|
|
margin_bottom: 12
|
|
on_click:
|
|
climate.control:
|
|
id: main_thermostat
|
|
preset: home
|
|
widgets:
|
|
- label:
|
|
align: center
|
|
text: "Home"
|
|
text_font: montserrat_20
|
|
- button:
|
|
height: 60px
|
|
margin_bottom: 12
|
|
on_click:
|
|
climate.control:
|
|
id: main_thermostat
|
|
preset: away
|
|
widgets:
|
|
- label:
|
|
align: center
|
|
text: "Away"
|
|
text_font: montserrat_20
|
|
- button:
|
|
height: 60px
|
|
on_click:
|
|
switch.toggle: relay_fan
|
|
widgets:
|
|
- label:
|
|
align: center
|
|
text: "Fan"
|
|
text_font: montserrat_20
|
|
- obj:
|
|
id: weather_rail
|
|
align: top_right
|
|
x: -16
|
|
y: 70px
|
|
width: 240px
|
|
height: size_content
|
|
pad_all: 16
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
bg_opa: transp
|
|
clickable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: center
|
|
flex_align_track: start
|
|
flex_align_main: start
|
|
widgets:
|
|
- label:
|
|
id: status_condition_label
|
|
text: "--"
|
|
text_font: montserrat_32
|
|
- label:
|
|
id: status_temp_label
|
|
text: "Outside: -- °F"
|
|
text_font: montserrat_24
|
|
- label:
|
|
id: status_humidity_label
|
|
text: "Humidity: -- %"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_high_label
|
|
text: "High: -- °F"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_low_label
|
|
text: "Low: -- °F"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_precip_label
|
|
text: "Precipitation: -- %"
|
|
text_font: montserrat_20
|
|
- obj:
|
|
id: temp_view
|
|
width: 100%
|
|
height: 100%
|
|
pad_all: 0
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
bg_opa: transp
|
|
clickable: false
|
|
widgets:
|
|
- arc:
|
|
id: dial_bg_arc
|
|
align: center
|
|
y: -20
|
|
width: 400px
|
|
height: 400px
|
|
start_angle: 315
|
|
end_angle: 225
|
|
min_value: 0
|
|
max_value: 1
|
|
value: 0
|
|
adjustable: false
|
|
arc_color: 0x444444
|
|
arc_width: 10
|
|
indicator:
|
|
arc_opa: transp
|
|
knob:
|
|
arc_opa: transp
|
|
- arc:
|
|
id: heat_arc
|
|
align: center
|
|
y: -20
|
|
width: 400px
|
|
height: 400px
|
|
start_angle: 315
|
|
end_angle: 225
|
|
min_value: 60
|
|
max_value: 90
|
|
value: 70
|
|
adjustable: true
|
|
adv_hittest: true
|
|
arc_opa: transp
|
|
indicator:
|
|
arc_color: 0xFF3B30
|
|
arc_width: 10
|
|
knob:
|
|
bg_color: 0xFF3B30
|
|
on_value:
|
|
then:
|
|
- climate.control:
|
|
id: main_thermostat
|
|
target_temperature_low: !lambda "return (x - 32.0f) * 5.0f / 9.0f;"
|
|
- lvgl.label.update:
|
|
id: heat_to_value_label
|
|
text:
|
|
format: "%.0f"
|
|
args: ["x"]
|
|
- arc:
|
|
id: cool_arc
|
|
align: center
|
|
y: -20
|
|
width: 360px # MUST stay smaller than heat_arc's 400px — see Global Constraints
|
|
height: 360px
|
|
start_angle: 315
|
|
end_angle: 225
|
|
mode: REVERSE
|
|
min_value: 60
|
|
max_value: 90
|
|
value: 75
|
|
adjustable: true
|
|
adv_hittest: true
|
|
arc_opa: transp
|
|
indicator:
|
|
arc_color: 0x0A84FF
|
|
arc_width: 10
|
|
knob:
|
|
bg_color: 0x0A84FF
|
|
on_value:
|
|
then:
|
|
- climate.control:
|
|
id: main_thermostat
|
|
target_temperature_high: !lambda "return (x - 32.0f) * 5.0f / 9.0f;"
|
|
- lvgl.label.update:
|
|
id: cool_to_value_label
|
|
text:
|
|
format: "%.0f"
|
|
args: ["x"]
|
|
- obj:
|
|
align: center
|
|
y: -40
|
|
width: 200px
|
|
height: size_content
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: center
|
|
flex_align_track: center
|
|
flex_align_main: center
|
|
widgets:
|
|
- label:
|
|
id: home_mode_label
|
|
text: "Mode: --"
|
|
text_font: montserrat_20
|
|
on_click:
|
|
lvgl.widget.show: mode_select_overlay
|
|
- label:
|
|
id: home_temp_label
|
|
text: "-- °F"
|
|
text_font: montserrat_48
|
|
- button:
|
|
align: bottom_mid
|
|
x: -110
|
|
y: -24
|
|
width: 90px
|
|
height: 60px
|
|
radius: 30
|
|
widgets:
|
|
- label:
|
|
id: heat_to_value_label
|
|
align: center
|
|
text: "70"
|
|
text_font: montserrat_20
|
|
- button:
|
|
align: bottom_mid
|
|
x: 110
|
|
y: -24
|
|
width: 90px
|
|
height: 60px
|
|
radius: 30
|
|
widgets:
|
|
- label:
|
|
id: cool_to_value_label
|
|
align: center
|
|
text: "75"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: outside_temp_label
|
|
align: bottom_right
|
|
x: -24
|
|
y: -24
|
|
text: "-- °"
|
|
text_font: montserrat_20
|
|
- obj:
|
|
id: status_view
|
|
hidden: true
|
|
width: 100%
|
|
height: 100%
|
|
pad_all: 16
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
bg_opa: transp
|
|
clickable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: center
|
|
flex_align_track: center
|
|
flex_align_main: space_evenly
|
|
widgets:
|
|
- label:
|
|
text: "System Status"
|
|
text_font: montserrat_32
|
|
- label:
|
|
id: status_relay_fan_label
|
|
text: "Fan: --"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_relay_cool1_label
|
|
text: "Cool Stage 1: --"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_relay_cool2_label
|
|
text: "Cool Stage 2: --"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_relay_heat1_label
|
|
text: "Heat Stage 1: --"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_relay_heat2_label
|
|
text: "Heat Stage 2: --"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_uptime_label
|
|
text: "Uptime: -- min"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: status_ip_label
|
|
text: "IP: --"
|
|
text_font: montserrat_20
|
|
- id: page_sensors
|
|
widgets:
|
|
- obj:
|
|
width: 100%
|
|
height: 510px
|
|
pad_all: 16
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: center
|
|
flex_align_track: center
|
|
flex_align_main: space_evenly
|
|
widgets:
|
|
- label:
|
|
id: sensors_temp_label
|
|
text: "Temperature: -- °F"
|
|
text_font: montserrat_28
|
|
- label:
|
|
id: sensors_humidity_label
|
|
text: "Humidity: -- %"
|
|
text_font: montserrat_28
|
|
- label:
|
|
id: sensors_pressure_label
|
|
text: "Pressure: -- hPa"
|
|
text_font: montserrat_28
|
|
- id: page_settings
|
|
widgets:
|
|
- obj:
|
|
width: 100%
|
|
height: 510px
|
|
pad_all: 16
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: center
|
|
flex_align_track: start
|
|
flex_align_main: start
|
|
widgets:
|
|
- label:
|
|
id: settings_ip_label
|
|
text: "IP: --"
|
|
text_font: montserrat_20
|
|
- label:
|
|
id: settings_uptime_label
|
|
text: "Uptime: -- min"
|
|
text_font: montserrat_20
|
|
- label:
|
|
text: "Manual relay override (bypasses thermostat):"
|
|
text_font: montserrat_16
|
|
- obj:
|
|
width: 100%
|
|
height: size_content
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: row_wrap
|
|
flex_align_cross: start
|
|
flex_align_track: start
|
|
flex_align_main: start
|
|
widgets:
|
|
- checkbox:
|
|
text: "Fan"
|
|
on_click:
|
|
switch.toggle: relay_fan
|
|
- checkbox:
|
|
text: "Cool 1"
|
|
on_click:
|
|
switch.toggle: relay_cool1
|
|
- checkbox:
|
|
text: "Cool 2"
|
|
on_click:
|
|
switch.toggle: relay_cool2
|
|
- checkbox:
|
|
text: "Heat 1"
|
|
on_click:
|
|
switch.toggle: relay_heat1
|
|
- checkbox:
|
|
text: "Heat 2"
|
|
on_click:
|
|
switch.toggle: relay_heat2
|
|
- id: page_schedule
|
|
widgets:
|
|
- obj:
|
|
width: 100%
|
|
height: 510px
|
|
pad_all: 16
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: center
|
|
flex_align_track: center
|
|
flex_align_main: space_evenly
|
|
widgets:
|
|
- label:
|
|
text: "Preset"
|
|
text_font: montserrat_28
|
|
- obj:
|
|
width: 100%
|
|
height: size_content
|
|
border_width: 0
|
|
outline_width: 0
|
|
scrollable: false
|
|
layout:
|
|
type: flex
|
|
flex_flow: row
|
|
flex_align_cross: center
|
|
flex_align_track: center
|
|
flex_align_main: space_evenly
|
|
widgets:
|
|
- button:
|
|
width: 300px
|
|
height: 100px
|
|
on_click:
|
|
climate.control:
|
|
id: main_thermostat
|
|
preset: home
|
|
widgets:
|
|
- label:
|
|
text: "Home"
|
|
text_font: montserrat_28
|
|
- button:
|
|
width: 300px
|
|
height: 100px
|
|
on_click:
|
|
climate.control:
|
|
id: main_thermostat
|
|
preset: away
|
|
widgets:
|
|
- label:
|
|
text: "Away"
|
|
text_font: montserrat_28
|
|
- label:
|
|
text: "Time-based scheduling runs in Home Assistant, not on this device."
|
|
text_font: montserrat_16
|
|
top_layer:
|
|
widgets:
|
|
- button:
|
|
id: hamburger_btn
|
|
align: top_left
|
|
x: 16
|
|
y: 16
|
|
width: 60px
|
|
height: 60px
|
|
radius: 8
|
|
on_click:
|
|
lvgl.widget.show: nav_menu_overlay
|
|
widgets:
|
|
- label:
|
|
text: "="
|
|
text_font: montserrat_28
|
|
- obj:
|
|
id: nav_menu_overlay
|
|
hidden: true
|
|
align: top_left
|
|
x: 16
|
|
y: 90px
|
|
width: 280px
|
|
height: size_content
|
|
pad_all: 8
|
|
radius: 8
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: stretch
|
|
flex_align_track: start
|
|
flex_align_main: start
|
|
widgets:
|
|
- button:
|
|
on_click:
|
|
- lvgl.page.show: page_home
|
|
- lvgl.widget.hide: nav_menu_overlay
|
|
widgets:
|
|
- label:
|
|
text: "Home"
|
|
text_font: montserrat_20
|
|
- button:
|
|
on_click:
|
|
- lvgl.page.show: page_sensors
|
|
- lvgl.widget.hide: nav_menu_overlay
|
|
widgets:
|
|
- label:
|
|
text: "Sensors"
|
|
text_font: montserrat_20
|
|
- button:
|
|
on_click:
|
|
- lvgl.page.show: page_settings
|
|
- lvgl.widget.hide: nav_menu_overlay
|
|
widgets:
|
|
- label:
|
|
text: "Settings"
|
|
text_font: montserrat_20
|
|
- button:
|
|
on_click:
|
|
- lvgl.page.show: page_schedule
|
|
- lvgl.widget.hide: nav_menu_overlay
|
|
widgets:
|
|
- label:
|
|
text: "Schedule"
|
|
text_font: montserrat_20
|
|
- obj:
|
|
id: mode_select_overlay
|
|
hidden: true
|
|
align: center
|
|
width: 280px
|
|
height: size_content
|
|
pad_all: 8
|
|
radius: 8
|
|
layout:
|
|
type: flex
|
|
flex_flow: column
|
|
flex_align_cross: stretch
|
|
flex_align_track: start
|
|
flex_align_main: start
|
|
widgets:
|
|
- button:
|
|
on_click:
|
|
- climate.control:
|
|
id: main_thermostat
|
|
mode: HEAT
|
|
- lvgl.widget.hide: mode_select_overlay
|
|
widgets:
|
|
- label:
|
|
text: "Heat"
|
|
text_font: montserrat_20
|
|
- button:
|
|
on_click:
|
|
- climate.control:
|
|
id: main_thermostat
|
|
mode: COOL
|
|
- lvgl.widget.hide: mode_select_overlay
|
|
widgets:
|
|
- label:
|
|
text: "Cool"
|
|
text_font: montserrat_20
|
|
- button:
|
|
on_click:
|
|
- climate.control:
|
|
id: main_thermostat
|
|
mode: "OFF"
|
|
- lvgl.widget.hide: mode_select_overlay
|
|
widgets:
|
|
- label:
|
|
text: "Off"
|
|
text_font: montserrat_20
|