[Article] Une interface mobile pour votre domotique Home Assistant

Un nouvel article est disponible sur le blog communautaire.

Afficher une centaine d’informations, commandes, images et graphiques sur un écran mobile de l’ordre de six pouces est un véritable défi. Surtout si l’on veut que l’expérience d’utilisation reste bonne pour toute la famille. Cet article vous propose de réaliser une interface conviviale pour mobile avec Home Assistant.

Bonne lecture !!!

13 « J'aime »

salut, je vient de lire t’on article pour l’interface mobile, que je trouve bien .
parcontre, il y a beaucoup de chose que je comprend pas. deja tu donne des code yaml, tu les met ou? et tu parle de theme aussi, es qu’il faut qu’il soit active aussi?

Salut,

Il faut que tu crées une vue, ensuite, tu ajoutes une Card de type Grille et après tu édites le code de cette carte.
titof2375

Merci @McFly pour sa réponse. @titof2375, je rajouterai des précisions pour tenir compte de ton retour.

1 « J'aime »

Comme prévu, j’ai modifié l’article sur le portail HACF et rajouté des explications pour le rendre plus accessible. Pourrais tu me dire si c’est plus clair maintenant @titof2375 ?

Si des personnes ont des retours ou suggestions, des suggestions d’implémentation mobile, je suis preneur !!

Bonjour et merci pour ce tuto, j’ai des problèmes avec les liens. D’après le forum anglais il faut mettre “ navigation_path: /lovelace-meteo” mais “navigation_path: /lovelace/meteo” ne fonctionne pas non plus. Mon dasbboard se nomme portable et dedans j’ai un dasboard meteo.
Quelle est la syntaxe correct ?
Merci

Voici ce qui fonctionne chez moi : navigation_path: /dashboard-portable/meteo

Oui tu as raison.
Si mobile est le nom du tableau de bord et meteo le nom de la vue, l’URL est dashboard-mobile/meteo
Mon exemple ne marchait que pour le tableau de bord par défaut.
J’ai modifié dans l’article et expliqué (dont comment créer un nouveau dashboard). Merci pour le retour.

salut a tous, je suis bloqué a partir de la
Utiliser des cartes conditionnelles
je comprend pas pour le ( On va créer un input_text qui contient le nom de la caméra à afficher (plage, garage, piscine).) tu le fait ou ???

Hello,
L’input_text permettra de stocker quel bouton a été cliqué pour une réutilisation dans les conditions d’affichage des cartes conditionnelles.
Pour le créer, aller dans paramètres - appareils et services - entrées.

Salut je viens juste de voire t’on message, il ne m’a pas étais notifié, pas très grave en tout cas. en faite ca donne simplement un image?

Merci pour l’article c’est vraiment Top.

1 « J'aime »

Cela permet d’afficher telle ou telle carte en fonction de quel bouton est appuyé. Des cartes avec une image dans l’exemple, mais ce peut être une caméra ou n’importe quelle autre carte.

salut @Argonaute pourez tu faire un tuto pour cette partie la .


car j’ai bien fait input_text_camera et fait ca .

il y a un truc que j’ai pas du faire correctement car chez moi ca fonctionne pas et j’ai cette erreur la.
tuto2
que je trouve normal car j’ai pas de script pour selectioné la camera .

Oh, je ne comprends pas ce qui s’est passé : c’est un ancien code qui n’aurait pas du être la. toutes mes excuses.
J’ai modifié dans l’article mais n’ai pu tester étant en déplacement. Peux tu me dire si c’est ok ?

alors toujour pas si tu veut tu peut regarde chez moi
autre chose

Et enfin, on va créer trois cartes (une par caméra) avec un affichage conditionnel en fonction du contenu de l’input_text, et donc du bouton appuyé.

tu le fait ou exactement?

J’ai recorrigé, dis moi si mieux.

Il faut créer des cartes conditionnelles dans le dashboard.
J’ai donné l’exemple du pilotage de 3 cartes conditionnel picture qui s’affichent ou pas suivant la valeur contenu dans l’input_text (et mis le code d’une carte).
Essaie de faire marcher, puis de comprendre comment ça marche, et adapte a ton besoin. Je répondrai volontiers a tes questions si quelque chose t’échappe.

Pour créer une carte, mets le dashboard en modif., fais « ajoute carte », va a la fin des cartes proposées dans Manuel, et copie-colle le yaml de la carte.

Code des 3 cartes :


type: conditional
conditions:
  - entity: input_text.selection_camera
    state: Plage
card:
  type: picture
  image: >-
    https://www.dreamingofmaldives.com/blog-des-maldives/wp-content/uploads/plage-de-reve-maldives.jpg
  hold_action:
    action: none
type: conditional
conditions:
  - entity: input_text.selection_camera
    state: Garage
card:
  type: picture
  image: >-
    https://cimg0.ibsrv.net/gimg/rennlist.com-vbulletin/1920x1080/20151002_155930_4aac632baa04cf726c4cfb6a736ce8373f1fe06b_c0b6632818674ec29309bd2713b85790980ae18e.jpg
  tap_action:
    action: none
  hold_action:
    action: none

type: conditional
conditions:
  - entity: input_text.selection_camera
    state: Piscine
card:
  type: picture
  image: >-
    https://s1.qwant.com/thumbr/0x380/2/8/71e2aa362d27b9cc45600645ade218b777d85c8d439ddd952f775403689989/e7b54fcf753278dedb43d69eff10baeb.jpg?u=https%3A%2F%2Fi.pinimg.com%2Foriginals%2Fe7%2Fb5%2F4f%2Fe7b54fcf753278dedb43d69eff10baeb.jpg&q=0&b=1&p=0&a=0
  tap_action:
    action: none
  hold_action:
    action: none

Salut alors, pour les conditionnelles c’était bon, après correction sur les boutons regarde ces qui ce passe, flûte je peut mettre de vidéo lol, et tu sur discord ?
il y a que la couleur des bouton que j’ai pas

salut @Argonaute peut on diminue les casses


comme sur les trais en vert?

Non. Pour cela, il faudrait utiliser des custom button card, qui permettent beaucoup de personnalisations.