Hauteur de tuile sur widget en v3

Tags: #<Tag:0x00007fe3201bb6c8>

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:
Screenshot_20200325-220847_Chrome
Et, pire encore, si je met 2 virtuels avec ce design widget, le 2eme chevauche le 1er on n’y voit plus rien…
Screenshot_20200325-220819_Chrome
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.