Adaptation app à l’écran

  • Adaptation app à l’écran

    Posté par Florian Gajdos sur 15 janvier 2024 à 14h26

    Bonjour à tous,

    Je souhaite utiliser un controle type text rich editor dans un app sur mobile.

    Pour que le contrôle s’affiche correctement (autrement “il sort de l’écran”) je suis obligé de modifier les paramêtres d’affichage comme ceci :

    <figure class=”image”></figure>

    Mais l’affichage ne se fait pas correctement l’app (encadré rouge) ne prends qu’une partie de l’écran. Mais le contrôle text rich editor lui s’affiche correctement.

    <figure class=”image”></figure>

    J’ai essayé de modifier la hauteur et largeur de l’app mais çe ne change rien.

    Auriez-vous une piste/idée ?

    Merci.

    Patrice a répondu Il y a 2 mois, 2 semaines 4 Membres · 7 Réponses
  • 7 Réponses
  • Alexandre

    Membre
    15 janvier 2024 à 15h03

    Ce n’est pas a l’application de s’adapter à ton contrôle, mais bien a ton contrôle de s’adapter à ton écran.

    Donc tu peux lui donner des positions X et Y, et des dimensions Width et Height, qui peuvent être calculés.

    Tu peux te baser sur la taille actuelle de ton application ( App.Width ) ou encore sur le container parent si tu en utilises (Parent.Width)

    • Florian Gajdos

      Membre
      15 janvier 2024 à 15h35

      Merci d’avoir pris le temps de me répondre.

      En te lisant ça m’a donné l’idée de mettre le text rich editor dans un conteneur ca me permet de contourner mon problème !

      Bonne fin de journée

      • Florian Gajdos

        Membre
        16 janvier 2024 à 8h59

        Finalement ça ne fonctionne pas comme je l’espérais.

        Donc quand je désactive la mise à l’échelle de l’application comment faire pour que l’application prenne l’ensemble de la taille de l’écran. Ci-dessous en mode lecture voici comment apparait l’écran :

        Merci par avance

        • R3dKap

          Membre
          16 janvier 2024 à 9h32

          Gajdos, le principe de base pour créer une application qui s’adapte à la taille de l’écran consiste à placer sur ton écran un premier conteneur dont la taille va s’adapter à celle de l’écran en définissant ses propriétés Width et Height de la manière suivante (j’ai appelé ce premier conteneur layScreen_HOME) :

          layScreen_HOME.Width = Parent.Width
          layScreen_HOME.Height = Parent.Height

          Je te recommande d’utiliser dans toute ton application les conteneurs à agencement automatique Conteneur horizontal et Conteneur vertical.

          Si t’as besoin d’aide sur l’utilisation de ces conteneurs, n’hésite pas… 😉

          • Florian Gajdos

            Membre
            16 janvier 2024 à 10h55

            Merci R3dKap, avec le conteneur j’arrive à afficher correctement le rich text editor.

            Quelle est la différence entre un conteneur et un conteneur horizontal/vertical ? Pour faire mon test j’ai utilisé le conteneur “simple” mais il y a peut-être des avantages à utiliser l’autre type.

            Bonne journée

            • R3dKap

              Membre
              16 janvier 2024 à 12h01

              @Gajdos, il y a énormément d’avantages à utiliser les conteneurs horizontaux et verticaux par rapport aux conteneurs simples :

              • ils agencent et positionnent automatiquement les contrôles qu’ils contiennent, les uns par rapport aux autres, sans qu’il soit besoin de saisir une quelconque formule : dans un conteneur vertical les contrôles s’empilent automatiquement les uns au-dessus des autres et si un contrôle change de hauteur tous les autres situés dessous sont décalés d’autant vers le bas ; idem pour les conteneurs horizontaux mais dans l’autre sens
              • la construction d’un écran qui est généralement composé de plusieurs zones imbriquées est très facile et très rapide à mettre en place grâce à l’imbrication des conteneurs horizontaux et verticaux

              Voici un exemple d’arborescence de conteneurs pour une application sur laquelle je suis en train de travailler actuellement :

              L’objectif c’est découper et sous-découper toutes les petites portions de ton écran à l’aide de ces conteneurs.

              Quand au conteneur simple/classique (on en voit un sur ma capture qui s’appelle ctrTabContent_DEMDOC), on ne l’utilise que pour superposer des contrôles les uns par rapport aux autres car dans les conteneurs horizontaux et verticaux il est impossible de superposer des éléments. Cela est utile lorsque tu veux par exemple afficher une popup ou une notification par-dessus une zone de ton écran ; ou lorsque tu veux mettre un icône “+” vide par-dessus une image pour avoir l’icone “main” lorsqu’on le survole et montrer que l’image est cliquable.

              Tu remarqueras qu’en terme de nomenclature, je privilégie le préfixe lay pour les conteneurs horizontaux et verticaux (car en anglais ils s’appellent les Layout Containers) et ctr pour les conteneur classiques (car en anglais ils s’appellent les Containers).

              Pour une nomenclature propre je te recommande ce post que j’avais fait il y a quelques temps : https://ppfc.fr/groupes/ressources/forum/topic/power-apps-regles-de-nommage-des-controles/?no_frame=1

  • Patrice

    Membre
    26 janvier 2024 à 9h19

    Rien que pour cette astuce :

    lorsque tu veux mettre un icône “+” vide par-dessus une image pour avoir l’icone “main” lorsqu’on le survole et montrer que l’image est cliquable.

    R3dkap, merci ! 👏

Connectez-vous pour répondre.