387fb07067
* Update picture-elements.markdown * Update glance.markdown * Update iframe.markdown * Update picture-entity.markdown * Update picture-glance.markdown * Update plant-status.markdown * Update lovelace_navigation.html * Update lovelace_navigation.html * Update picture.markdown * Create views.markdown * Add files via upload * Update views.markdown
2.6 KiB
layout, title, description, date, sidebar, comments, sharing, footer
| layout | title | description | date | sidebar | comments | sharing | footer |
|---|---|---|---|---|---|---|---|
| page | Views | The Lovelace UI is a powerful and configurable interface for Home Assistant. | 2018-07-01 10:28 +00:00 | true | false | true | true |
These are exactly as before, tab views with icons or text that help you manage large dashboards with many entities. The views have now deep links like /lovelace/0. You can also assign your own custom ids.
- Using custom id in view, for nicer navigation paths in URLs
- Using icons instead of text
- Using a card to fill a complete view, just like panels
- Using themes in views
| Name | Type | Default | Description |
|---|---|---|---|
| title | string | Optional | Text title of the view |
| id | string | number | The id to use in URL path of this view |
| icon | string | Optional | The material design icon for the view, uses this instead of title |
| panel | boolean | false | Marks view as a panel reusing the first card in list |
Screenshot of views.
{% linkable_title Icons %}
You can use icons instead of text for your view tabs. The title in the example will be used as tooltip.
Example
views:
- icon: mdi:settings
title: Debugging
{% linkable_title Panel view %}
This type of view uses the first card in the cards array to expand it to ocuppy the complete view space, similar to panels. One very good practical use will be for floor plan type of cards.
Example
views:
- icon: mdi:settings
id: debug
title: Floorplan
panel: true
cards:
- type: picture-elements
image: /local/floorplans/main.jpg
elements:
- type: state-icon
tap_action: toggle
entity: light.ceiling_lights
style:
top: 47%
left: 42%
{% linkable_title Themes %}
You can also set a theme per view.
Theme is currently only partially usable (font color works)
views:
- icon: mdi:heart
id: debug
title: Home
theme: dark-mode
{% linkable_title Custom id %}
You can now assign a custom id to a view, for nicer navigation paths in URLs. This id allows you to deep-link navigation to this view from cards that allow navigation_path.
Example
View:
views:
- icon: mdi:settings
id: debugging
Picture card:
- type: picture
image: /local/debug.jpg
navigation_path: /lovelace/debugging