Salut @dJuL
En testant ma nouvelle tablette Galaxy A7 avec JPi, je me rends compte que sa resolution est légèrement plus petite que ma Huawei.
Je suis donc obliger de glisser le doigt en haut ou en bas pour deplacer le design afin de voir les parties hors ecran.
Me vient alors l’idée de faire un design unique mais différent de celui de @benj29.
L’idée serait donc de pouvoir slider entre differentes section d’un meme design.
Pour une largeur d’ecran de 1920 pixels, si je fais 6 pages mon design devra donc faire 11520 pixels.
Penses tu que c’est jouable ?
Par contre comment gérer le changement de page d’un glissement de doigt et tomber pile sur la 2eme page ? Est ce des commandes JS/CSS a mettre dans le design ?
J’utilise un design panoramique depuis des années sans soucis.
J’ai juste du mettre à jour le js lors de certaines maj de Jeedom.
Pour la taille de l’écran de l’ordi lors de la conception pas de soucis car il y a plusieurs façons de régler ça :
1- diviser par 4 ou plus la résolution et réduire la taille des widget (cela ne changera rien à la qualité finale)
ou, si on garde la pleine résolution
2- réduire le zoom dans le navigateur
ou, toujours si on garde la pleine résolution
3- Si on utilise des boutons pour naviguer dans les pages, comme je le fais, aucun soucis, car il suffit de cliquer sur le bouton du menu qui scroll automatiquement la page (même en mode édition) pour afficher la page voulue et la modifier.
L’idée est de désactiver le scroll manuel (les slides avec les doigts ne font donc rien)
la page de chargement de Jeedom est affichée furtivement pour le style à chaque changement de page.
Il faut changer 600 dans le code par la largeur d’une page du design (le mien fait 10* 600px pou 10 pages)
pour naviguer entre les pages on appelle juste la fonction js navTo.
Exemple pour aller page2: navTo(2);
Edit: il faut également ce code css pour que ça fonctionne :
je me rends compte que sa resolution est légèrement plus petite que ma Huawei.
si c’est du html tu peux faire en sorte d’afficher ta page sur multiple résolution : un zoom qui peut déformé si le ratio largeur/ longueur diffère
un design multi écran
Après pour moi le plus simple c’est clic qui affiche un virtuel, tableau (scrolable ou pas)
exemple salon (chauffages. lumières, prises,…)
ton acceuil regorge d’info et pour une action c’est un clic
ou encore des fenêtres (modal) qui affiche un design (iframe)
tu as une page a multiple tiroir qui consomme des ressources que si tu ouvres l’iframe et vu que ton acceuil et derrière le retour est immediat.
mode synthèse est pas mal sans mettre les mains dans le code
Non car le scroll avec les doigts fait que la page scrolle légèrement quand on touche l’écran, hors on veut basculer sur une page complète et non scroller de quelques pixels, ou sur une demie page…
Au final le résultat est comme si on chargeait une nouvelle page, on ne se rend pas compte qu’au final il s’agit juste d’un scroll.
Génial !! mais du coup t’as juste une page HTML custom, ou alors tu passes quand même par les designs jeedom ? Car je suis curieux de voir comment tu intègres tes virtuels.
Effectivement, je parlais des virtuels si tu avais utilisé en tant que HTML. Donc tu fais tout sur une mono page, mais tu ajoutes le JS pour avoir le slide quand tu select le menu ?
Excellente idée en tout cas, tu aurais le code JS ? (suis noob en front), à moins que ça soit un que j’ai vu passé au dessus ?
Oui exactement.
J’ai une tablette un peu vielle et le chargement des pages (changement de design) était trop long, là le design met 40s à se charger la 1ère fois, mais ensuite plus aucun lag pour changer de page. Je le refresh juste 1 ou 2 fois / jour quand il y a personne dans la pièce.
Oui il est au dessus (js et css à intégrer dans n’importe quel bloc html du design)
