some ui tweaks
This commit is contained in:
parent
e967121746
commit
601e56c56f
1 changed files with 237 additions and 160 deletions
397
thermostat.yml
397
thermostat.yml
|
|
@ -100,13 +100,16 @@ button:
|
|||
time:
|
||||
- platform: homeassistant
|
||||
id: hass_time
|
||||
- platform: sntp
|
||||
timezone: America/Chicago
|
||||
id: sntp_time
|
||||
on_time:
|
||||
- seconds: /5 # Update every second
|
||||
then:
|
||||
- lvgl.label.update:
|
||||
id: time_label
|
||||
text: !lambda |-
|
||||
auto time = id(hass_time).now();
|
||||
auto time = id(sntp_time).now();
|
||||
return time.strftime("%a %b %e, %I:%M %p");
|
||||
- minutes: /2 # Update every second
|
||||
then:
|
||||
|
|
@ -269,24 +272,27 @@ mapping:
|
|||
from: string
|
||||
to: string
|
||||
entries:
|
||||
Clear: ""
|
||||
clear-day: ""
|
||||
light-rain: ""
|
||||
medium-rain: ""
|
||||
heavy-rain: ""
|
||||
"Mostly Cloudy": ""
|
||||
"Breezy": ""
|
||||
"Sunny": ""
|
||||
rain: ""
|
||||
cloudy: ""
|
||||
windy: ""
|
||||
partly-cloudy-night: ""
|
||||
partly-cloudy-day: ""
|
||||
clear-night: ""
|
||||
|
||||
text_sensor:
|
||||
- platform: homeassistant
|
||||
id: weather
|
||||
entity_id: sensor.pirateweather_summary
|
||||
on_value:
|
||||
then:
|
||||
- lvgl.label.update:
|
||||
id: out_weather_label
|
||||
text: !lambda |-
|
||||
return id(weather_mapping)[x];
|
||||
entity_id: sensor.pirateweather_icon
|
||||
# on_value:
|
||||
# then:
|
||||
# - lvgl.label.update:
|
||||
# id: out_weather_label
|
||||
# text: !lambda |-
|
||||
# return id(weather_mapping)[x];
|
||||
- platform: homeassistant
|
||||
id: weather_summary
|
||||
entity_id: sensor.pirateweather_minutely_summary
|
||||
|
|
@ -295,7 +301,9 @@ text_sensor:
|
|||
- lvgl.label.update:
|
||||
id: out_weather_sum_label
|
||||
text: !lambda |-
|
||||
return x;
|
||||
auto summary = id(weather).get_state();
|
||||
auto icon = id(weather_mapping)[summary];
|
||||
return icon + " " + x;
|
||||
- platform: homeassistant
|
||||
id: weather_temp
|
||||
entity_id: sensor.pirateweather_temperature
|
||||
|
|
@ -328,6 +336,27 @@ text_sensor:
|
|||
# text: !lambda |-
|
||||
# auto temp = " " + x + "°";
|
||||
# return temp;
|
||||
- platform: homeassistant
|
||||
id: high_temp
|
||||
entity_id: number.today_s_high
|
||||
on_value:
|
||||
then:
|
||||
- lvgl.label.update:
|
||||
id: high_out_label
|
||||
text: !lambda |-
|
||||
auto temp = " " + x + "°";
|
||||
return temp;
|
||||
- platform: homeassistant
|
||||
id: low_temp
|
||||
entity_id: number.tonight_s_low
|
||||
on_value:
|
||||
then:
|
||||
- lvgl.label.update:
|
||||
id: low_out_label
|
||||
text: !lambda |-
|
||||
auto temp = " " + x + "°";
|
||||
return temp;
|
||||
|
||||
# - platform: template
|
||||
# id: weather_temp
|
||||
# entity_id: weather.pirateweather
|
||||
|
|
@ -450,8 +479,8 @@ climate:
|
|||
min_fanning_off_time: 60s
|
||||
min_fanning_run_time: 60s
|
||||
min_idle_time: 60s
|
||||
cool_deadband: 0.1 °F
|
||||
cool_overrun: 0.9 °F
|
||||
cool_deadband: 0.9 °F
|
||||
cool_overrun: 0.0 °F
|
||||
heat_deadband: 0.1 °F
|
||||
heat_overrun: 0.9 °F
|
||||
visual:
|
||||
|
|
@ -511,12 +540,12 @@ climate:
|
|||
default_target_temperature_high: 85 °F
|
||||
on_state:
|
||||
then:
|
||||
- lvgl.indicator.update:
|
||||
id: hvac_temp_ticks
|
||||
start_value: !lambda |-
|
||||
return x.target_temperature_high * 10.0;
|
||||
end_value: !lambda |-
|
||||
return x.target_temperature_low * 10.0;
|
||||
# - lvgl.indicator.update:
|
||||
# id: hvac_temp_ticks
|
||||
# start_value: !lambda |-
|
||||
# return x.target_temperature_high * 10.0;
|
||||
# end_value: !lambda |-
|
||||
# return x.target_temperature_low * 10.0;
|
||||
- if:
|
||||
condition:
|
||||
lambda: "return id(climape).mode == CLIMATE_MODE_HEAT;"
|
||||
|
|
@ -723,7 +752,10 @@ font:
|
|||
"", # nf:stormy
|
||||
"", # nf:cloudy
|
||||
"", # nf:night
|
||||
"", # nf:breezy
|
||||
"", # nf:cloudynight
|
||||
"", # nf:therm-chev-up
|
||||
"", # nf:therm-chev-down
|
||||
]
|
||||
- file:
|
||||
type: gfonts
|
||||
|
|
@ -748,7 +780,10 @@ font:
|
|||
"", # nf:stormy
|
||||
"", # nf:cloudy
|
||||
"", # nf:night
|
||||
"", # nf:breezy
|
||||
"", # nf:cloudynight
|
||||
"", # nf:therm-chev-up
|
||||
"", # nf:therm-chev-down
|
||||
]
|
||||
- file:
|
||||
type: gfonts
|
||||
|
|
@ -756,6 +791,28 @@ font:
|
|||
weight: 400
|
||||
id: h4
|
||||
size: 20
|
||||
extras:
|
||||
- file: "fonts/vm.ttf"
|
||||
glyphs: [
|
||||
"", # nf:wifi
|
||||
"", # nf:up
|
||||
"", # nf:down
|
||||
"", # nf:off
|
||||
"", # nf:humidity
|
||||
"", # nf:temp
|
||||
"", # nf:dew
|
||||
"", # nf:clear
|
||||
"", # nf:rain
|
||||
"", # nf:snow
|
||||
"", # nf:partlycloudy
|
||||
"", # nf:stormy
|
||||
"", # nf:cloudy
|
||||
"", # nf:night
|
||||
"", # nf:breezy
|
||||
"", # nf:cloudynight
|
||||
"", # nf:therm-chev-up
|
||||
"", # nf:therm-chev-down
|
||||
]
|
||||
- file:
|
||||
type: gfonts
|
||||
family: Quicksand
|
||||
|
|
@ -922,11 +979,18 @@ lvgl:
|
|||
height: 480
|
||||
width: 800
|
||||
scrollable: false
|
||||
pad_all: 0
|
||||
margin_left: 0
|
||||
margin_top: 0
|
||||
margin_bottom: 0
|
||||
margin_right: 0
|
||||
widgets:
|
||||
- obj:
|
||||
bg_color: ${color_bg}
|
||||
width: 100%
|
||||
border_width: 0
|
||||
pad_top: 0
|
||||
margin_top: 0
|
||||
widgets:
|
||||
- label:
|
||||
id: time_label
|
||||
|
|
@ -946,11 +1010,121 @@ lvgl:
|
|||
width: 100%
|
||||
border_width: 0
|
||||
widgets:
|
||||
# Arc Outer Ring only for visual effect
|
||||
- arc:
|
||||
id: arc_ring_outer
|
||||
height: 370
|
||||
width: 370
|
||||
y: -20
|
||||
align: CENTER
|
||||
arc_color: ${color_light_blue}
|
||||
arc_opa: COVER
|
||||
arc_width: 5
|
||||
knob:
|
||||
bg_color: ${color_white}
|
||||
# Meter ticks and needle
|
||||
- meter:
|
||||
id: meter_ticks
|
||||
hidden: false
|
||||
height: 360
|
||||
width: 360
|
||||
y: -20
|
||||
align: CENTER
|
||||
bg_opa: TRANSP
|
||||
border_width: 0
|
||||
scales:
|
||||
range_from: 80 # 16°C
|
||||
range_to: 340 # 34°C
|
||||
# Set temperature ticks background
|
||||
ticks:
|
||||
count: 60
|
||||
length: 18
|
||||
width: 2
|
||||
color: ${color_white}
|
||||
indicators:
|
||||
- line:
|
||||
id: current_temp_needle
|
||||
color: ${color_red}
|
||||
width: 8
|
||||
length: 35
|
||||
value: 340 # 34°C Should be the same as the current temperature label
|
||||
# Set temperature ticks
|
||||
# - tick_style:
|
||||
# id: hvac_temp_ticks
|
||||
# start_value: 80
|
||||
# end_value: 340 # 24°C Should be the same as the set temperature label
|
||||
# color_start: ${color_green}
|
||||
# color_end: ${color_green}
|
||||
# width: 2
|
||||
# Curremt temperature needle
|
||||
# Meter inner Ring only for visual effect
|
||||
- obj:
|
||||
id: meter_ring_inner
|
||||
height: 300
|
||||
width: 300
|
||||
y: -20
|
||||
radius: 150
|
||||
align: CENTER
|
||||
border_width: 12
|
||||
border_color: ${color_bg}
|
||||
bg_color: ${color_bg_alt}
|
||||
# Set temperature knob, should change with the set temperature ticks
|
||||
- arc:
|
||||
id: hvac_temp_knob
|
||||
hidden: false
|
||||
align: CENTER
|
||||
arc_opa: TRANSP
|
||||
adjustable: true
|
||||
value: 240 # 24°C (24x10) Should be the same as the set temperature needle
|
||||
min_value: 80
|
||||
max_value: 340
|
||||
width: 335
|
||||
height: 335
|
||||
y: -20
|
||||
arc_width: 16
|
||||
change_rate: 550
|
||||
indicator:
|
||||
arc_opa: TRANSP
|
||||
arc_width: 16
|
||||
knob:
|
||||
bg_color: ${color_dark_blue}
|
||||
border_width: 4
|
||||
border_color: ${color_white}
|
||||
on_change:
|
||||
then:
|
||||
- if:
|
||||
condition:
|
||||
lambda: "return id(climape).mode == CLIMATE_MODE_COOL;"
|
||||
then:
|
||||
- climate.control:
|
||||
id: climape
|
||||
target_temperature_high: !lambda |-
|
||||
return x / 10;
|
||||
- if:
|
||||
condition:
|
||||
lambda: "return id(climape).mode == CLIMATE_MODE_FAN_ONLY;"
|
||||
then:
|
||||
- climate.control:
|
||||
id: climape
|
||||
target_temperature_high: !lambda |-
|
||||
return x / 10;
|
||||
- if:
|
||||
condition:
|
||||
lambda: "return id(climape).mode == CLIMATE_MODE_HEAT;"
|
||||
then:
|
||||
- climate.control:
|
||||
id: climape
|
||||
target_temperature_low: !lambda |-
|
||||
return x / 10;
|
||||
|
||||
- obj:
|
||||
align: BOTTOM_MID
|
||||
width: 100%
|
||||
bg_color: 0x282A36
|
||||
border_width: 0
|
||||
bg_opa: 0%
|
||||
pad_top: 20
|
||||
pad_bottom: 0
|
||||
layout:
|
||||
type: flex
|
||||
pad_row: 4
|
||||
|
|
@ -1100,117 +1274,11 @@ lvgl:
|
|||
x: -5
|
||||
text_color: 0xE2E4E5
|
||||
|
||||
# Arc Outer Ring only for visual effect
|
||||
- arc:
|
||||
id: arc_ring_outer
|
||||
height: 370
|
||||
width: 370
|
||||
y: -20
|
||||
align: CENTER
|
||||
arc_color: ${color_light_blue}
|
||||
arc_opa: COVER
|
||||
arc_width: 5
|
||||
knob:
|
||||
bg_color: ${color_white}
|
||||
# Meter ticks and needle
|
||||
- meter:
|
||||
id: meter_ticks
|
||||
hidden: false
|
||||
height: 360
|
||||
width: 360
|
||||
y: -20
|
||||
align: CENTER
|
||||
bg_opa: TRANSP
|
||||
border_width: 0
|
||||
scales:
|
||||
range_from: 80 # 16°C
|
||||
range_to: 340 # 34°C
|
||||
# Set temperature ticks background
|
||||
ticks:
|
||||
count: 60
|
||||
length: 18
|
||||
width: 2
|
||||
color: ${color_white}
|
||||
indicators:
|
||||
# Set temperature ticks
|
||||
- tick_style:
|
||||
id: hvac_temp_ticks
|
||||
start_value: 80
|
||||
end_value: 340 # 24°C Should be the same as the set temperature label
|
||||
color_start: ${color_green}
|
||||
color_end: ${color_green}
|
||||
width: 2
|
||||
# Curremt temperature needle
|
||||
- line:
|
||||
id: current_temp_needle
|
||||
color: ${color_red}
|
||||
width: 8
|
||||
r_mod: 35
|
||||
value: 340 # 34°C Should be the same as the current temperature label
|
||||
# Meter inner Ring only for visual effect
|
||||
- obj:
|
||||
id: meter_ring_inner
|
||||
height: 300
|
||||
width: 300
|
||||
y: -20
|
||||
radius: 150
|
||||
align: CENTER
|
||||
border_width: 12
|
||||
border_color: ${color_bg}
|
||||
bg_color: ${color_bg_alt}
|
||||
# Set temperature knob, should change with the set temperature ticks
|
||||
- arc:
|
||||
id: hvac_temp_knob
|
||||
hidden: false
|
||||
align: CENTER
|
||||
arc_opa: TRANSP
|
||||
adjustable: true
|
||||
value: 240 # 24°C (24x10) Should be the same as the set temperature needle
|
||||
min_value: 80
|
||||
max_value: 340
|
||||
width: 335
|
||||
height: 335
|
||||
y: -20
|
||||
arc_width: 16
|
||||
change_rate: 550
|
||||
indicator:
|
||||
arc_opa: TRANSP
|
||||
arc_width: 16
|
||||
knob:
|
||||
bg_color: ${color_dark_blue}
|
||||
border_width: 4
|
||||
border_color: ${color_white}
|
||||
on_change:
|
||||
then:
|
||||
- if:
|
||||
condition:
|
||||
lambda: "return id(climape).mode == CLIMATE_MODE_COOL;"
|
||||
then:
|
||||
- climate.control:
|
||||
id: climape
|
||||
target_temperature_high: !lambda |-
|
||||
return x / 10;
|
||||
- if:
|
||||
condition:
|
||||
lambda: "return id(climape).mode == CLIMATE_MODE_FAN_ONLY;"
|
||||
then:
|
||||
- climate.control:
|
||||
id: climape
|
||||
target_temperature_high: !lambda |-
|
||||
return x / 10;
|
||||
- if:
|
||||
condition:
|
||||
lambda: "return id(climape).mode == CLIMATE_MODE_HEAT;"
|
||||
then:
|
||||
- climate.control:
|
||||
id: climape
|
||||
target_temperature_low: !lambda |-
|
||||
return x / 10;
|
||||
- obj:
|
||||
height: 50%
|
||||
y: 100
|
||||
height: 60%
|
||||
y: 80
|
||||
width: 150
|
||||
x: 580
|
||||
x: 600
|
||||
bg_opa: 0
|
||||
border_width: 0
|
||||
layout:
|
||||
|
|
@ -1308,55 +1376,64 @@ lvgl:
|
|||
text_color: 0xE2E4E5
|
||||
|
||||
- obj:
|
||||
height: 70%
|
||||
y: 80
|
||||
height: 100%
|
||||
y: 0
|
||||
width: 170
|
||||
x: 0
|
||||
bg_opa: 0
|
||||
border_width: 0
|
||||
scrollable: false
|
||||
pad_top: 30
|
||||
layout:
|
||||
type: flex
|
||||
pad_row: 20
|
||||
pad_row: 15
|
||||
pad_column: 2
|
||||
flex_flow: COLUMN
|
||||
flex_align_main: START
|
||||
flex_align_cross: START
|
||||
flex_align_track: CENTER
|
||||
widgets:
|
||||
- label:
|
||||
id: humidity_label
|
||||
text_font: h3
|
||||
text: " : 50%"
|
||||
text_color: ${color_white}
|
||||
align: LEFT_MID
|
||||
- obj:
|
||||
bg_color: ${color_white}
|
||||
height: 2
|
||||
width: 100%
|
||||
pad_top: 50
|
||||
- label:
|
||||
id: out_weather_label
|
||||
text_font: h3
|
||||
text: ""
|
||||
text_color: ${color_white}
|
||||
pad_top: 20
|
||||
align: LEFT_MID
|
||||
long_mode: WRAP
|
||||
- label:
|
||||
id: out_weather_sum_label
|
||||
text_font: h4
|
||||
text: ""
|
||||
width: 150
|
||||
text_color: ${color_white}
|
||||
align: LEFT_MID
|
||||
long_mode: WRAP
|
||||
- label:
|
||||
id: out_temp_label
|
||||
text_font: h2
|
||||
text: ""
|
||||
text_color: ${color_white}
|
||||
align: LEFT_MID
|
||||
- label:
|
||||
id: high_out_label
|
||||
text_font: h3
|
||||
text: " : 50°"
|
||||
text_color: ${color_white}
|
||||
align: LEFT_MID
|
||||
- label:
|
||||
id: low_out_label
|
||||
text_font: h3
|
||||
text: " : 50°"
|
||||
text_color: ${color_white}
|
||||
align: LEFT_MID
|
||||
- label:
|
||||
id: humidity_label
|
||||
text_font: h3
|
||||
text: " : 50%"
|
||||
text_color: ${color_white}
|
||||
align: LEFT_MID
|
||||
# - label:
|
||||
# id: out_weather_label
|
||||
# text_font: h3
|
||||
# text: ""
|
||||
# text_color: ${color_white}
|
||||
# pad_top: 20
|
||||
# align: LEFT_MID
|
||||
# long_mode: WRAP
|
||||
- label:
|
||||
id: out_weather_sum_label
|
||||
text_font: h4
|
||||
text: ""
|
||||
width: 150
|
||||
pad_top: 20
|
||||
text_color: ${color_white}
|
||||
align: LEFT_MID
|
||||
long_mode: WRAP
|
||||
# - label:
|
||||
# id: out_hum_label
|
||||
# text_font: h3
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue