Hauteur de tuile sur widget en v3

Bonjour,
j’ai créé un widget, que j’applique sur un slider virtuel (pour une commande multi-états) et l’affichage - basique - est plutôt convenable en dashboard et vue desktop, mais je n’arrive pas du tout à l’avoir en mode web mobile. C’est à dire que la hauteur de la tuile diminue et masque complètement les 3 / 4 des boutons. voici une image pour illustrer le problème:


Et, pire encore, si je met 2 virtuels avec ce design widget, le 2eme chevauche le 1er on n’y voit plus rien…

j’ai pu identifier que c’est la hauteur de la tuile qui est fixée et trop petite mais je n’arrive pas à voir pourquoi qui où comment cette hauteur est définie ?

je up avec des infos en plus:
dans ma vue « test » il y a une hauteur fixée à 94px
image
ça ne vient pas du widget / virtuel car c’est le div contenant ( le eqLogicZone, mon virtuel est dans le eqLogic-widget )
comme il ajoute du contenu dynamique après coup, il y a possibilité de faire recalculer cette hauteur du div parent après l’affichage peut être ?

j’ai pour l’instant trouvé une solution, c’est d’ajuster en jquery la hauteur de l’élément parent :

$( ".classSwitch6Ways#uid#" ).parents( ".eqLogicZone" ).height( $( ".classSwitch6Ways#uid#" ).parents( ".eqLogic-widget" ).height());

Mais ça ne marche que si j’ai que mon seul widget dans la vue.
Si il y a plusieurs tuiles, il me faut recalculer la hauteur de chaque tuile sur la colonne concernée…
J’ai recherché des solutions à base d’event ‹ beforepagecreate › et compagnie mais on dirait que ces events ne sont jamais déclenché dans jeedom ?

https://api.jquerymobile.com/pagecontainer/#event-beforeload

mon test qui ne fait rien du tout :


$( ".classSwitch6Ways#uid#" ).pagecontainer({
  beforeload: function( event, ui ) {
  // Let the framework know we're going to handle the load.
  event.preventDefault();
 
  // ... load the document then insert it into the DOM ...
    console.log('execute pagecontainerbeforeload for element classSwitch6Ways#uid#');
   
  // at some point, either in this callback, or through
  // some other async means, call resolve, passing in
  // the following args, plus a jQuery collection object
  // containing the DOM element for the page.
  data.deferred.resolve( data.absUrl, data.options, page );
  },
  
  pagecreate: function(event){
    console.log('execute pagecreate for element classSwitch6Ways#uid#');
 },
  
  pageinit: function(event){
    console.log('execute pageinit for element classSwitch6Ways#uid#');
 }

});

@Jeedom-Team c’est possible d’ajouter une fonction dans le beforeload du jquery mobile ?

J’ai résolu mon problème en invoquant le plugin packery dans mon widget:

   $('.eqLogicZone').packery();

Evidemment quand il y a plusieurs widgets dans une vue, ça rend bizarre parce que les objets sont construit, puis déplacé dans une valse de drag&drop automatique c’est assez étrange. Mais ça tombe bien au final :slight_smile:

Ce sujet a été automatiquement fermé après 24 heures suivant le dernier commentaire. Aucune réponse n’est permise dorénavant.