hass-pandora-cas
hass-pandora-cas copied to clipboard
Карточки без кнопок управления
Кстати, могу поделиться своей поделкой карточек без кнопок управления, кому интересно:
Originally posted by @diemon24 in https://github.com/alryaz/hass-pandora-cas/issues/14#issuecomment-1331179209
Выделил в отдельный запрос, предлагаю добавить прямо в этот репозиторий эти карточки, можно даже реквестом от автора карточек, ну или я могу с этим помочь, мне главное сами карточки тогда увидеть )
@diemon24 очень хочется увидеть карточки ☺
Где взять такие карточки?
Где взять такие карточки?
Так это кастомные карточки. Сам сделал.
Где взять такие карточки?
Используется:
- custom:button-card
- picture-elements
type: picture-elements elements:
- type: state-icon entity: sensor.your_ID_balance style: top: 90% left: 10%
- type: state-label entity: sensor.your_ID_balance state_color: true style: top: 90% left: 22% color: white
- type: state-label entity: sensor.your_ID_battery_voltage state_color: true style: top: 80% left: 20% color: white
- type: state-icon entity: sensor.your_ID_battery_voltage style: top: 80% left: 10%
- type: state-icon entity: sensor.your_ID_mileage style: top: 90% left: 42%
- type: state-label entity: sensor.your_ID_mileage state_color: true style: top: 90% left: 58% color: white
- type: state-label entity: sensor.your_ID_engine_temperature state_color: true style: top: 80% left: 88% color: white
- type: state-icon entity: sensor.your_ID_engine_temperature style: top: 80% left: 77%
- type: state-label entity: sensor.your_ID_fuel state_color: true style: top: 80% left: 52% color: white
- type: state-icon entity: sensor.your_ID_fuel style: top: 80% left: 42%
- type: state-label entity: sensor.your_ID_interior_temperature state_color: true style: top: 90% left: 88% color: white
- type: state-icon entity: sensor.your_ID_interior_temperature style: top: 90% left: 77%
- type: state-label entity: sensor.your_ID_speed state_color: true style: top: 7% left: 51% color: white
- type: state-icon entity: sensor.your_ID_speed style: top: 7% left: 41%
- type: state-icon entity: binary_sensor.your_ID_parking style: top: 17% left: 10%
- type: state-label entity: binary_sensor.your_ID_parking state_color: true style: top: 17% left: 23% color: white
- type: state-icon entity: binary_sensor.your_ID_ignition style: top: 7% left: 10%
- type: state-label entity: binary_sensor.your_ID_ignition state_color: true style: top: 7% left: 23% color: white
- type: state-icon entity: device_tracker.your_ID_pandora style: top: 7% left: 77%
- type: state-label entity: device_tracker.your_ID_pandora state_color: true style: top: 7% left: 88% color: white
- type: state-icon entity: sensor.your_ID_gsm_level style: top: 17% left: 76%
- type: state-label entity: sensor.your_ID_gsm_level state_color: true style: top: 17% left: 85% color: white
- type: state-label entity: switch.your_ID_engine state_color: true style: top: 17% left: 55% color: white
- type: custom:button-card
state:
- value: 'on' color: orange styles: card: - background-color: rgba(0, 0, 0, 0) icon: - animation: - rotating 1s linear infinite spin: true tap_action: action: toggle entity: switch.your_ID_engine style: top: 17% left: 41% width: 10% name: ' ' icon: mdi:fan size: 50%
- type: custom:button-card
entity: lock.[your_ID_central_lock
state:
- value: unlocked color: red icon: mdi:shield-lock-open-outline
- value: locked
color: green
icon: mdi:shield-lock-outline
styles:
card:
- background-color: rgba(0, 0, 0, 0) style: top: 55% left: 44% width: 23% name: ' ' size: 50% image: >- https://[ссылка на фото]
Ищите PNG фото ваших авто в инете. У меня есть только две одинаковые.
Вот так выглядят текущие карточки:
@diemon24 очень хочется увидеть карточки ☺
Выложил. Сорри, что так долго. Пропустил сообщение, видимо...
@diemon24 а можно, пжлста, через кнопку код выложить?) Я попытался к нормальному виду привести, но что-то не работает
type: picture-elements
image: /local/1.png
elements:
- type: state-icon
entity: sensor.YOU_ID_balance
style: null
top: 90%
left: 10%
- type: state-label
entity: sensor.YOU_ID_balance
state_color: true
style: null
top: 90%
left: 22%
color: white
- type: state-label
entity: sensor.YOU_ID_battery_voltage
state_color: true
style: null
top: 80%
left: 20%
color: white
- type: state-icon
entity: sensor.YOU_ID_battery_voltage
style: null
top: 80%
left: 10%
- type: state-icon
entity: sensor.YOU_ID_mileage
style: null
top: 90%
left: 42%
- type: state-label
entity: sensor.YOU_ID_mileage
state_color: true
style: null
top: 90%
left: 58%
color: white
- type: state-label
entity: sensor.YOU_ID_engine_temperature
state_color: true
style: null
top: 80%
left: 88%
color: white
- type: state-icon
entity: sensor.YOU_ID_engine_temperature
style: null
top: 80%
left: 77%
- type: state-label
entity: sensor.YOU_ID_fuel
state_color: true
style: null
top: 80%
left: 52%
color: white
- type: state-icon
entity: sensor.YOU_ID_fuel
style: null
top: 80%
left: 42%
- type: state-label
entity: sensor.YOU_ID_interior_temperature
state_color: true
style: null
top: 90%
left: 88%
color: white
- type: state-icon
entity: sensor.YOU_ID_interior_temperature
style: null
top: 90%
left: 77%
- type: state-label
entity: sensor.YOU_ID_speed
state_color: true
style: null
top: 7%
left: 51%
color: white
- type: state-icon
entity: sensor.YOU_ID_speed
style: null
top: 7%
left: 41%
- type: state-icon
entity: binary_sensor.YOU_ID_parking
style: null
top: 17%
left: 10%
- type: state-label
entity: binary_sensor.YOU_ID_parking
state_color: true
style: null
top: 17%
left: 23%
color: white
- type: state-icon
entity: binary_sensor.YOU_ID_ignition
style: null
top: 7%
left: 10%
- type: state-label
entity: binary_sensor.YOU_ID_ignition
state_color: true
style: null
top: 7%
left: 23%
color: white
- type: state-icon
entity: device_tracker.YOU_ID_pandora
style: null
top: 7%
left: 77%
- type: state-label
entity: device_tracker.YOU_ID_pandora
state_color: true
style: null
top: 7%
left: 88%
color: white
- type: state-icon
entity: sensor.YOU_ID_gsm_level
style: null
top: 17%
left: 76%
- type: state-label
entity: sensor.YOU_ID_gsm_level
state_color: true
style: null
top: 17%
left: 85%
color: white
- type: state-label
entity: switch.YOU_ID_engine
state_color: true
style: null
top: 17%
left: 55%
color: white
- type: custom:button-card
state:
value: 'on'
color: orange
styles:
card:
- background-color: rgba(0, 0, 0, 0)
icon:
- animation: null
- rotating 1s linear infinite
spin: true
tap_action: null
action: toggle
entity: switch.YOU_ID_engine
style: null
top: 17%
left: 41%
width: 10%
name: ' '
icon: mdi:fan
size: 50%
- type: custom:button-card
entity: lock.YOU_ID_central_lock
state:
- value: unlocked
color: red
icon: mdi:shield-lock-open-outline
- value: locked
color: green
icon: mdi:shield-lock-outline
styles: null
card:
background-color: rgba(0, 0, 0, 0)
style: null
top: 55%
left: 44%
width: 23%
name: ' '
size: 50%
@diemon24 а можно, пжлста, через кнопку код выложить?) Я попытался к нормальному виду привести, но что-то не работает
type: picture-elements image: /local/1.png elements: - type: state-icon entity: sensor.YOU_ID_balance style: null top: 90% left: 10% - type: state-label entity: sensor.YOU_ID_balance state_color: true style: null top: 90% left: 22% color: white - type: state-label entity: sensor.YOU_ID_battery_voltage state_color: true style: null top: 80% left: 20% color: white - type: state-icon entity: sensor.YOU_ID_battery_voltage style: null top: 80% left: 10% - type: state-icon entity: sensor.YOU_ID_mileage style: null top: 90% left: 42% - type: state-label entity: sensor.YOU_ID_mileage state_color: true style: null top: 90% left: 58% color: white - type: state-label entity: sensor.YOU_ID_engine_temperature state_color: true style: null top: 80% left: 88% color: white - type: state-icon entity: sensor.YOU_ID_engine_temperature style: null top: 80% left: 77% - type: state-label entity: sensor.YOU_ID_fuel state_color: true style: null top: 80% left: 52% color: white - type: state-icon entity: sensor.YOU_ID_fuel style: null top: 80% left: 42% - type: state-label entity: sensor.YOU_ID_interior_temperature state_color: true style: null top: 90% left: 88% color: white - type: state-icon entity: sensor.YOU_ID_interior_temperature style: null top: 90% left: 77% - type: state-label entity: sensor.YOU_ID_speed state_color: true style: null top: 7% left: 51% color: white - type: state-icon entity: sensor.YOU_ID_speed style: null top: 7% left: 41% - type: state-icon entity: binary_sensor.YOU_ID_parking style: null top: 17% left: 10% - type: state-label entity: binary_sensor.YOU_ID_parking state_color: true style: null top: 17% left: 23% color: white - type: state-icon entity: binary_sensor.YOU_ID_ignition style: null top: 7% left: 10% - type: state-label entity: binary_sensor.YOU_ID_ignition state_color: true style: null top: 7% left: 23% color: white - type: state-icon entity: device_tracker.YOU_ID_pandora style: null top: 7% left: 77% - type: state-label entity: device_tracker.YOU_ID_pandora state_color: true style: null top: 7% left: 88% color: white - type: state-icon entity: sensor.YOU_ID_gsm_level style: null top: 17% left: 76% - type: state-label entity: sensor.YOU_ID_gsm_level state_color: true style: null top: 17% left: 85% color: white - type: state-label entity: switch.YOU_ID_engine state_color: true style: null top: 17% left: 55% color: white - type: custom:button-card state: value: 'on' color: orange styles: card: - background-color: rgba(0, 0, 0, 0) icon: - animation: null - rotating 1s linear infinite spin: true tap_action: null action: toggle entity: switch.YOU_ID_engine style: null top: 17% left: 41% width: 10% name: ' ' icon: mdi:fan size: 50% - type: custom:button-card entity: lock.YOU_ID_central_lock state: - value: unlocked color: red icon: mdi:shield-lock-open-outline - value: locked color: green icon: mdi:shield-lock-outline styles: null card: background-color: rgba(0, 0, 0, 0) style: null top: 55% left: 44% width: 23% name: ' ' size: 50%
type: picture-elements
image: /local/1.png
elements:
- type: state-icon
entity: sensor.YOU_ID_balance
style: null
top: 90%
left: 10%
- type: state-label
entity: sensor.YOU_ID_balance
state_color: true
style: null
top: 90%
left: 22%
color: white
- type: state-label
entity: sensor.YOU_ID_battery_voltage
state_color: true
style: null
top: 80%
left: 20%
color: white
- type: state-icon
entity: sensor.YOU_ID_battery_voltage
style: null
top: 80%
left: 10%
- type: state-icon
entity: sensor.YOU_ID_mileage
style: null
top: 90%
left: 42%
- type: state-label
entity: sensor.YOU_ID_mileage
state_color: true
style: null
top: 90%
left: 58%
color: white
- type: state-label
entity: sensor.YOU_ID_engine_temperature
state_color: true
style: null
top: 80%
left: 88%
color: white
- type: state-icon
entity: sensor.YOU_ID_engine_temperature
style: null
top: 80%
left: 77%
- type: state-label
entity: sensor.YOU_ID_fuel
state_color: true
style: null
top: 80%
left: 52%
color: white
- type: state-icon
entity: sensor.YOU_ID_fuel
style: null
top: 80%
left: 42%
- type: state-label
entity: sensor.YOU_ID_interior_temperature
state_color: true
style: null
top: 90%
left: 88%
color: white
- type: state-icon
entity: sensor.YOU_ID_interior_temperature
style: null
top: 90%
left: 77%
- type: state-label
entity: sensor.YOU_ID_speed
state_color: true
style: null
top: 7%
left: 51%
color: white
- type: state-icon
entity: sensor.YOU_ID_speed
style: null
top: 7%
left: 41%
- type: state-icon
entity: binary_sensor.YOU_ID_parking
style: null
top: 17%
left: 10%
- type: state-label
entity: binary_sensor.YOU_ID_parking
state_color: true
style: null
top: 17%
left: 23%
color: white
- type: state-icon
entity: binary_sensor.YOU_ID_ignition
style: null
top: 7%
left: 10%
- type: state-label
entity: binary_sensor.YOU_ID_ignition
state_color: true
style: null
top: 7%
left: 23%
color: white
- type: state-icon
entity: device_tracker.YOU_ID_pandora
style: null
top: 7%
left: 77%
- type: state-label
entity: device_tracker.YOU_ID_pandora
state_color: true
style: null
top: 7%
left: 88%
color: white
- type: state-icon
entity: sensor.YOU_ID_gsm_level
style: null
top: 17%
left: 76%
- type: state-label
entity: sensor.YOU_ID_gsm_level
state_color: true
style: null
top: 17%
left: 85%
color: white
- type: state-label
entity: switch.YOU_ID_engine
state_color: true
style: null
top: 17%
left: 55%
color: white
- type: custom:button-card
state:
value: 'on'
color: orange
styles:
card:
- background-color: rgba(0, 0, 0, 0)
icon:
- animation: null
- rotating 1s linear infinite
spin: true
tap_action: null
action: toggle
entity: switch.YOU_ID_engine
style: null
top: 17%
left: 41%
width: 10%
name: ' '
icon: mdi:fan
size: 50%
- type: custom:button-card
entity: lock.YOU_ID_central_lock
state:
- value: unlocked
color: red
icon: mdi:shield-lock-open-outline
- value: locked
color: green
icon: mdi:shield-lock-outline
styles: null
card:
background-color: rgba(0, 0, 0, 0)
style: null
top: 55%
left: 44%
width: 23%
name: ' '
size: 50%
@diemon24 а это вы мой кривой код продублировали xD
Методом научного тыка получилось следующее:
type: picture-elements
image: local/pictures/vehicle/your-car-image.png
elements:
- type: state-icon
entity: sensor.YOUR_ID_balance
style:
top: 90%
left: 10%
- type: state-label
entity: sensor.YOUR_ID_balance
state_color: true
style:
top: 90%
left: 22%
- type: state-label
entity: sensor.YOUR_ID_battery_voltage
state_color: true
style:
top: 80%
left: 20%
- type: state-icon
entity: sensor.YOUR_ID_battery_voltage
style:
top: 80%
left: 10%
- type: state-icon
entity: sensor.YOUR_ID_mileage
style:
top: 90%
left: 42%
- type: state-label
entity: sensor.YOUR_ID_mileage
state_color: true
style:
top: 90%
left: 58%
- type: state-label
entity: sensor.YOUR_ID_engine_temperature
state_color: true
style:
top: 80%
left: 88%
- type: state-icon
entity: sensor.YOUR_ID_engine_temperature
style:
top: 80%
left: 77%
- type: state-label
entity: sensor.YOUR_ID_fuel
state_color: true
style:
top: 80%
left: 52%
- type: state-icon
entity: sensor.YOUR_ID_fuel
style:
top: 80%
left: 42%
- type: state-label
entity: sensor.YOUR_ID_interior_temperature
state_color: true
style:
top: 90%
left: 88%
- type: state-icon
entity: sensor.YOUR_ID_interior_temperature
style:
top: 90%
left: 77%
- type: state-label
entity: sensor.YOUR_ID_speed
state_color: true
style:
top: 7%
left: 51%
- type: state-icon
entity: sensor.YOUR_ID_speed
style:
top: 7%
left: 41%
- type: state-icon
entity: binary_sensor.YOUR_ID_parking
style:
top: 17%
left: 10%
- type: state-label
entity: binary_sensor.YOUR_ID_parking
state_color: true
style:
top: 17%
left: 23%
- type: state-icon
entity: binary_sensor.YOUR_ID_ignition
style:
top: 7%
left: 10%
- type: state-label
entity: binary_sensor.YOUR_ID_ignition
state_color: true
style:
top: 7%
left: 23%
- type: state-icon
entity: device_tracker.YOUR_ID_pandora
style:
top: 7%
left: 77%
- type: state-label
entity: device_tracker.YOUR_ID_pandora
state_color: true
style:
top: 7%
left: 88%
- type: state-icon
entity: sensor.YOUR_ID_gsm_level
style:
top: 17%
left: 76%
- type: state-label
entity: sensor.YOUR_ID_gsm_level
state_color: true
style:
top: 17%
left: 85%
- type: state-label
entity: switch.YOUR_ID_engine
state_color: true
style:
top: 17%
left: 55%
- type: custom:button-card
state:
- value: 'on'
color: orange
styles:
card:
- background-color: rgba(0, 0, 0, 0)
icon:
- animation:
- rotating 1s linear infinite
spin: true
tap_action:
action: toggle
entity: switch.YOUR_ID_engine
name: ' '
icon: mdi:fan
size: 50%
style:
top: 17%
left: 41%
width: 10%
- type: custom:button-card
entity: lock.YOUR_ID_central_lock
state:
- value: locking
styles:
card:
- background-color: rgba(0, 0, 0, 0)
- border: none
- value: unlocking
styles:
card:
- background-color: rgba(0, 0, 0, 0)
- border: none
- value: unlocked
color: red
icon: mdi:shield-lock-open-outline
styles:
card:
- background-color: rgba(0, 0, 0, 0)
- border: none
- value: locked
color: green
icon: mdi:shield-lock-outline
styles:
card:
- background-color: rgba(0, 0, 0, 0)
- border: none
name: ' '
size: 50%
style:
top: 50%
left: 44%
width: 23%
Картинки лежат у меня по этому пути: www/pictures/vehicle/your-car-image.png
, но можно и в base64 закодировать
Методом научного тыка получилось следующее:
какое разрешение картинки у вас? или соотношение сторон
Методом научного тыка получилось следующее:
какое разрешение картинки у вас? или соотношение сторон
Сама картинка 1360x903