Comprendre et Utiliser les Layouts dans une Application
Apprenez à organiser vos composants d'interface utilisateur en utilisant des layouts horizontaux, verticaux, et en grille.
Introduction
Les bases de Flex
Les composants d'interfaces
Création de 'pages' et animation
Changer l'apparence des composants (Skinning)
Interaction avec des données
Classes AS
Adobe AIR
De Flex 3 à Flex 4
Aller plus loin
Extrait gratuit
Détails de la leçon
Description de la leçon
Lorsque vous créez l'interface utilisateur de votre application, il est essentiel de bien organiser vos composants. Cela se fait à l'aide de layouts. Par défaut, le layout est basique ou absolu, ce qui nécessite de définir des coordonnées x et y pour chaque composant.
Dans cet exemple, nous avons deux composants : une combo box (liste déroulante) et une liste simple. Si leurs coordonnées x et y ne sont pas définies, ils se superposent en haut à gauche de l'interface. Pour corriger cela, on peut définir manuellement leurs coordonnées ou utiliser un layout différent.
Il existe quatre types de layouts : basique (ou absolu), horizontal, vertical et tile (grille). En optant pour un layout vertical, par exemple, les coordonnées x et y ne sont plus utilisées. Les composants s'agencent automatiquement.
Ce contenu démontre également comment changer dynamiquement le layout en utilisant une combo box pour sélectionner le type de layout souhaité, avec des exemples de layouts horizontaux, verticaux et en grille.
Objectifs de cette leçon
Les objectifs de cette vidéo sont de :
- Comprendre les différents types de layouts disponibles
- Savoir configurer un layout de manière statique et dynamique
- Apprendre à manipuler les propriétés des layouts en fonction des besoins de l'application
Prérequis pour cette leçon
Pour suivre cette vidéo, il est recommandé d'avoir des connaissances de base en développement d'interfaces utilisateur et une compréhension des concepts de coordonnées x et y.
Métiers concernés
Les concepts abordés dans cette vidéo sont particulièrement utiles pour les développeurs front-end, les UI/UX designers, et les ingénieurs en logiciels spécialisés dans la conception d'interfaces utilisateur.
Alternatives et ressources
Les alternatives possibles incluent l'utilisation de CSS Grid ou Flexbox pour des mises en page réactives en développement web, ou des solutions similaires fournies par des frameworks PHP, JavaScript comme React ou Vue.js.
Questions & Réponses