[Widget]Comment faire un beau visuel pour les smartphones

Bonjour à tous,

Voilà quelque mois que je suis sur Jeedom et jene maitrise pas encore tout. J’utilise l’application Jeedom pour les smartphones, mais je e toruve pas top. J’aimerais faire un beau visuel, un peu comme cela


sans nessairement que ca soit si proche.

J’aimerais savoir si vous pouviez m’orienter.

J’ai compris que je devais passer par les design mais je pense que vais devoir toucher un peu du HTML? J’ai installer le plugin HTML.

Je pense aussi qu’avant je dois maitriser les widgets que je pourrai ensuite intégrer dans un design, n’est-ce pas?

Voila donc mon problème.
Mon premier exercise, sous Outil->Widget, j’ai créé mon premier widget pour modifier les icon des état de mes mon radiateur (fils pilote). OK.
Mais j’ai aussi installé le plugin Widgets et là, j’ai pas mal de problèmes.

Sous Plugins->Programmation->Widgets, j’ai créé mon premier Widget

Premièrement, j’ai choisi « Mode création Facile » et j’ai choisi l’icon du radiateur pour regrouper la tempérture du salon, l’état du fils pilote et les actions du fils pilotes

Mais après que puis-je faire?
J’ai cliqué sur « Widget numérique », mais ensuite imposible de revenir sur le choix de mes icones.
Sur cette vue, j’ai re-choisir l’icone de mon radiateur et du code HTML c’est affiché. Dessous ce dernier, je peux valider, mais quand je valide, rien y fait. (Meme quand je donne un nom)

Ensuite, je suis revenu en arriere pour Ajouter un widget.


ce qui affichera la température du salon (info). Mais j’aimerais aussi contrôler mon fils pilote (action).
Quand je fais ajouter, j’ai une ligne rouge, en haut, comme s’il affichait un message d’erreur sans texte.

mais je peux cliquer sur « Appliquer sur des commandes », je le fais et je choisi le capteur de température de mon salon. Je valide, je ferme et je sauve. Mais je n’ai rien que ma ligne rouge, comme la précédente image.

Si maintenant, je choisi une action à la place d’une info, je peux sauver sans ligne rouge.

Au passage, je vois ce message

http://razwave1.local/3rdparty/jquery.tooltipster/js/tooltipster.bundle.min.js?md5=843b8a8618e600e4071e0e15ed40404a 1 Error: You called Tooltipster’s « destroy » method on an uninitialized element

Ensuite, je choisi une commande et voici ce qui s’affiche

Par contre, je viens de constater qu’après l’avoir sauver et que je reclique sur « Appliquer sur mes commande » j’ai ceci, sans choix

Si non, à par ca tout va bien :slight_smile:

C’est un peu bizard tout cela :slight_smile: Ca fait pas mal de problème. Est-ce que le plugin Widgets dépend d’un autre? Comment expliqueriez-vous cela?

Merci pour vos lumières

Je ne suis pas un expert aussi mais quelle version de Jeedom as-tu installé ? il me semble que c’est la V4 (au vu des captures d’écran). Dans cette version il ne faut plus utiliser le plugin Widget, il n’est plus compatible, il y a directement un outil Widget d’intégré dans cette version.
Cdlt, Olivier.

Hello, oui c’est bien ça, j’ai la version 4.
J’avais aussi vu sous outils->Widgets.
Je viens de désinstaller le plugins Widgets.

Mais maintenant j’ai une autre question. J’ai déjà créé un Widget pour l’état de mon fils pilote.
Est-ce que je peux rajouté un affichage pour un autre module, soit la température de la pièce (info)? J’avais essayer sans succès

Le widget est le composant graphique de base pour afficher un état/commande. Pour afficher plusieurs états avec différents visuels il faut composer une tuile, sauf que dans Jeedom il n’y a pas le même outil Tuile que celui de Widget; c’est réalisé par les plugins.
Pour ton problème, installes le plugin Virtuel, la tu pourras créer une tuile avec plusieurs Widget de n’importe quelle commande.

Si je me trompe, on me corrigera j’espère :slight_smile:

1 « J'aime »

Salut,

un widget de type info peut se mettre sur toutes commandes infos
un widget action idem.

certains équipements ont des tuiles ayant des widgets ‹ figés › souvent issus de plugin
les modules zwaves et autres ont des infos et des widgets par défault modifiable ou pas cela dépends

si tu veux une tuile qui regroupe par exemple toutes les températures de tes pièces, il faut effectivement créer un virtuel, qui visible sera une tuile sur ton dashboard et pour chaque commande info tu pourras appliquer un widget

Ici 3 thermostats jeedom dont les infos son regroupées dans un virtuel pour une sorte de dashboard

voila j’espère que c’est plus clair pour toi

Tu peux aussi t’inspirer de la doc des widgets de JAELG
https://github.com/JEALG/JEEDOM-Widget_JAG-doc/blob/master/fr_FR/index.md

1 « J'aime »

les liens que l’on y trouve donne une erreur 404 sur git…

J’ai aussi créé des Virtuel pour avoir dans la meme tuile divers cmmandes. Par exemple, dans une tuiles j’ai les mesure de mon MultiSensor6 (Température/Humidité/Luminosité) et les commandes de mon fils pilotes.

J’ai ensuite créé un design dans lequel j’ai inclus le design.
Depuis mon App Jeedom de mon iPhone, j’ai ceci


Franchement, c’est pas top. Il n’affiche que la moitié et je dois déplacé avec mon doigt.

Il ne peut pas etre web responsive, adapter la taille du texte, etc? On peut pas faire mieux? Mieux personnaliser?

Non, pas web responsive, mais tu peux créer plusieurs Design adapter à la résolution de ton écran de mobile.

tu peux créer plusieurs Design adapter à la résolution de ton écran de mobile

Oui mais il y a beaucoup de tailles différentes en fonction de la marque du modèle, tablette, smartphone. Les différences ne sont pas énorme, mais c’est mieux de travailler en % qu’en px.

D’accord, mais on n’a toujours pas de contrôle sur le contenu?
Par exemple dans l’image que j’ai attaché, plus haut, est-ce que je peux diminuer la taille des jauges? du texte, des icônes?
N’est-ce pas du CSS.
Jeedom, c’est très bien, mais j’ai l’impression que l’adaptation du visuel (affichage sur une smartphone ou tablette) est très limité, non?

Le mode Design est adapté à une résolution fixe, qui convient très bien à une tablette, donc à un poste de pilotage de ta domotique bien définit.
Après je pense que tu devrais utiliser une Vue avec un ou des plugins Virtuel, cela donne un peu plus un mode responsive (les tuiles s’empilent à droite puis en dessous automatiquement suivant la largeur de l’écran).