French layout pour smartphone et tablettes

[fgh3966]

Bonjour
Je recherche comment adapter les layouts (320 x 480) et (480 x 320) pour tous les smartphones et les tablettes (800 x 1280) et (1280 x 800)
Faut il impérativement placer les widgets dans la zone grise la plus foncée ? voire photo
Je pense qu'on peut utiliser les options show title et full screen et regarder dans le "main" du programme
Pour les ancres on peut indiquer que le widget est au bord mais qu'en est il pour les widgets au centre du layout ?

Je cherche un tuto écrit pas trop compliqué a comprendre.

Merci d'avance.

 

[klaus]

Malheureusement il n'y a pas de méthode 'universelle'.
Et les solutions dépendent du genre de layout, et surtout de ce que tu veux afficher en même temps.
Avoir un layout universel pour toutes les tailles d'écran est illusoire.
Avec un layout donné, simplement agrandir les objets pour les grands écrans n'est à mon avis pas une solution car les objets deviennent trop grands.
Et sur les grands écrans il est plus profitable d'afficher plus d'informations car il y a la place.

J'avais fait il y a quelques années un programme style jukebox pour la lecture de fichiers audio.
La première version était une version pour tablettes avec des layouts conçus pour tablettes.
Après, je voulais la même chose mai pour téléphone.
J'avais écrit une version indépendante pour téléphone avec des layouts conçus pour téléphones.
Puis, j'ai trouvé que maintenir deux programmes indépendants avec 80% voire plus de même code était compliqué et sujet à erreurs.
J'ai finalement refait un programme pour les deux types d'appareils avec des layouts spécifiques à type.
J'ai placé les différents objets sur des Panels et affiché deux Panels en même temps côte à côte en mode paysage sur les tablette pour profiter de la place.
Et, sur les téléphones j'affichais un Panel à la fois en mode paysage avec la gestion de ces Panels qui va avec.
C'est plus compliqué, mais au bout du compte bien plus efficace.

Tu peux aussi utiliser des Layout Variants.
Il semble que tu as déjà deux variantes, une pour portrait (320 x 480) et une pour paysage (480 x 320).
Tu peux créer dans le même fichier layout deux nouvelles variantes pour 1280 x 800 et 800 x 1280.
Et tu peux ou dois encore jongler avec les ancres et le DesignerScript.
Lors de la lecture du layout le système choisit la variante la plus appropriée par rapport à la taille de l'écran.

Voila, même un Suisse donne une réponse de Normand.

As-tu un exemple de layout que tu veux afficher sur différents écrans ?

 

[zed]

Mon expérience est plus ou moins la même. Au début, je faisait un variant que j'essayais d'adapter pour différent types d"écran.
Je n'avais aucune envie de faire plusieurs layout. Je pensais que si je devais faire autant de layout que d'écran, je serais mort avant d'avoir terminé.
J'ai alors bricolé des trucs pour que ça fonctionne. Mais ce n'était jamais juste et le bricolage n'était vraiment pas professionnel.
En finalité, j'ai bien compris l'importance de faire des varaints en fonction du type et de l'orientation de l'appareil.
Le résultat et sans appel. il est mieux de faire ça dans les règles de l'art.

 

[fgh3966]

A priori, actuellement les téléphones changent le rapport hauteur/largeur ce qui ne façilte pas la création des layouts et les rendu des widgets ayant des tailles variables.
Je viens de faire un essai avec des boutons avec un layout : sur un tel samsung de 2016 et un tel Motorola 2024. La différence de rendu est importante
Je ne sais pas si je me suis trompé dans le designer mais la ligne du milieu contituée par les boutons 7, 10, 11, 12, 13 est décalée vers le haut, surtout sur le tel le + récent.
Par contre j'ai fixé les ancres aux bouton des 4 coins + les boutons correspondants aux lignes de boutons en haut et en bas de l'écran/layout et ces 2 lignes de boutons sont bien positionnées en hauteur.
Aussi j'avais visualisé ce lien vidéo de 2013 disons rassurante
Le truc c'est que j'ai plus de 50 widgets a scriper

 

[klaus]

J'adapterais ce spécifique layout dans le DesignerScript comme suit:

'All variants script
AutoScaleRate(0.5)
AutoScaleAll
Largeur = Button1.Width
DistanceX = (100%x - 5 * Largeur) / 4 + Largeur 'espace entre les boutons + une largeur
DistanceY = (100%y - 5 * Largeur) / 4 + Largeur

Button2.Left = DistanceX
Button3.Left = 2 * DistanceX
Button4.Left = 3 * DistanceX

Button12.Left = DistanceX
Button11.Left = 2 * DistanceX
Button10.Left = 3 * DistanceX

Button13.VerticalCenter = 50%y
Button12.VerticalCenter = 50%y
Button11.VerticalCenter = 50%y
Button10.VerticalCenter = 50%y
Button7.VerticalCenter = 50%y

Button6.Top = DistanceY
Button7.Top = 2 * DistanceY
Button8.Top = 3 * DistanceY