diff --git a/source/_lovelace/picture-elements.markdown b/source/_lovelace/picture-elements.markdown index 8dd83c9c005..54b60b92285 100644 --- a/source/_lovelace/picture-elements.markdown +++ b/source/_lovelace/picture-elements.markdown @@ -2,7 +2,7 @@ layout: page title: "Picture Elements Card" sidebar_label: Picture Elements -description: "Picture elements card is one of the most versatile type of cards" +description: "Picture elements card is one of the most versatile types of cards" date: 2018-07-01 10:28 +00:00 sidebar: true comments: false @@ -10,9 +10,9 @@ sharing: true footer: true --- -Picture elements card is one of the most versatile type of cards. +Picture elements card is one of the most versatile types of cards. -The cards allows you to position icons or text and even services! On an image based on coordinates. Imagine floor plan, imagine [picture-glance](/lovelace/picture-glance/) with no restrictions! +The cards allow you to position icons or text and even services! On an image based on coordinates. Imagine floor plan, imagine [picture-glance](/lovelace/picture-glance/) with no restrictions!
@@ -74,6 +74,11 @@ tap_action:
description: more-info, toggle, navigate, call-service
type: string
default: more-info
+hold_action:
+ required: false
+ description: Action to perform when clicked-and-held (e.g., `more-info`, `toggle`, `navigate`, `call-service`).
+ type: string
+ default: none
navigation_path:
required: false
description: Url path to navigate to (e.g., `/lovelace/1`)
@@ -86,6 +91,11 @@ service_data:
required: false
description: The service data to use.
type: object
+hold_time:
+ required: false
+ description: Time in ms for click-and-hold to register.
+ type: integer
+ default: 500
style:
required: true
description: Position and style the element using CSS.
@@ -117,6 +127,11 @@ tap_action:
description: more-info, toggle, navigate, call-service
type: string
default: more-info
+hold_action:
+ required: false
+ description: Action to perform when clicked-and-held (e.g., `more-info`, `toggle`, `navigate`, `call-service`).
+ type: string
+ default: none
navigation_path:
required: false
description: Url path to navigate to (e.g., `/lovelace/1`)
@@ -129,6 +144,11 @@ service_data:
required: false
description: The service data to use.
type: object
+hold_time:
+ required: false
+ description: Time in ms for click-and-hold to register.
+ type: integer
+ default: 500
style:
required: true
description: Position and style the element using CSS.
@@ -186,6 +206,11 @@ tap_action:
description: more-info, toggle, navigate, call-service
type: string
default: more-info
+hold_action:
+ required: false
+ description: Action to perform when clicked-and-held (e.g., `more-info`, `toggle`, `navigate`, `call-service`).
+ type: string
+ default: none
navigation_path:
required: false
description: Url path to navigate to (e.g., `/lovelace/1`)
@@ -198,6 +223,11 @@ service_data:
required: false
description: The service data to use.
type: object
+hold_time:
+ required: false
+ description: Time in ms for click-and-hold to register.
+ type: integer
+ default: 500
style:
required: true
description: Position and style the element using CSS.
@@ -221,6 +251,11 @@ tap_action:
description: none, more-info, toggle, navigate, call-service
type: string
default: more-info
+hold_action:
+ required: false
+ description: Action to perform when clicked-and-held (e.g., `more-info`, `toggle`, `navigate`, `call-service`).
+ type: string
+ default: none
navigation_path:
required: false
description: Url path to navigate to (e.g., `/lovelace/1`)
@@ -233,6 +268,11 @@ service_data:
required: false
description: The service data to use.
type: object
+hold_time:
+ required: false
+ description: Time in ms for click-and-hold to register.
+ type: integer
+ default: 500
image:
required: false
description: The image to display.
@@ -311,6 +351,20 @@ state_filter:
"off": brightness(50%) hue-rotate(45deg)
```
+## {% linkable_title How to use click-and-hold %}
+
+If the option `hold_action` is specified, that action will be performed when the entity is clicked and held for a certain time (default 0.5 seconds).
+Please note that the `tap_action` and `hold_action` share variables for `navigation_path`, `service` and `service_data`. It is therefore not possible to, e.g., call two different services when clicked and when held.
+
+```yaml
+tap_action: toggle
+hold_action: call-service
+service: light.turn_on
+service_data:
+ entity_id: light.bed_light
+ brightness_pct: 100
+```
+
## {% linkable_title Example %}
```yaml