Gérer les changements d'orientation

Découvrez comment utiliser le composant Condition pour détecter les changements d'orientation de l'écran et afficher automatiquement une pop-up bloquant l'utilisation de l'application en mode paysage.

Lorsque l'utilisateur passe son appareil en mode paysage, une pop-up s'affiche pour lui indiquer que l'application est optimisée pour une utilisation en mode portrait uniquement. Cette fonctionnalité est particulièrement utile pour garantir une expérience utilisateur cohérente sur mobile et tablette.

Étape 1 : ajouter une pop-up

1. Dans votre projet PandaSuite, ajoutez un composant Pop-up.
2. Personnalisez son contenu en y insérant un message clair, par exemple :"Cette application fonctionne uniquement en mode portrait."
3. Ajustez le design pour qu'il couvre toute la zone visible et empêche l'interaction avec le contenu sous-jacent.

Étape 2 : ajouter le composant Condition

1. Ajoutez un composant Condition 
2. Renommez ce composant (exemple :"Condition Orientation") pour faciliter son identification.

Étape 3 : configurer le composant Condition

Créez une nouvelle condition basée sur les dimensions de l'écran : 

1. Dans les propriétés du composant Condition, cliquez sur Ajouter une condition
2. Définissez la condition de détection de l'orientation : Largeur > Hauteur (ceci détecte le passage au mode paysage)
   
   ○ Données : choisissez les données du projet et sélectionnez la  Largeur de l'écran actuel.
   ○ Fonction : choisissez Supérieur à 
   ○ Valeur : choisissez les données du projet et sélectionnez la Hauteur de l'écran actuel.

1. Activez l'Evaluation automatique pour que la condition soit vérifiée en continu.

Étape 4 : ajouter les actions à la Condition

Ajoutez une action au composant Condition pour ouvrir la pop-up lorsque la condition est remplie :

• Action : Interagir sur un composant > Pop-up > Ouvrir la po-pup

Ajoutez une action à l'inverse de la condition pour fermer la pop-up :

• Action : Interagir sur un composant > Pop-up > Fermer la pop-up

Étape 5 : tester la configuration

1. Enregistrez votre projet.
2. Testez en changeant l'orientation de votre appareil ou en modifiant la taille de la fenêtre dans le simulateur.
3. Vérifiez que la pop- up s'affiche bien en mode paysage et disparaît en mode portrait.

Félicitations ! Vous avez maintenant mis en place une détection automatique de l'orientation avec le composant Condition. Vous pouvez également explorer d'autres cas d'usage en combinant ce composant avec d'autres actions pour améliorer l'expérience utilisateur.

N'hésitez pas à tester et à adapter cette fonctionnalité en fonction de vos besoins spécifiques dans vos projets PandaSuite !