Dans une mise en page dynamique, les conteneurs sont utilisés pour diviser et organiser les widgets en sections auxquelles vous pouvez appliquer des options de mise en page. Par défaut, tout le contenu d'une application composite dynamique s'affiche en fonction de la taille d'écran disponible. Lorsque le contenu d'un conteneur est plus grand que l'espace disponible requis pour afficher le contenu, des barres de défilement s'affichent sur le conteneur. Cela préserve la mise en page du conteneur que vous définissez lorsque l'espace disponible à l'écran change. La taille de conteneur requise peut également changer en fonction du type de widget que vous souhaitez afficher dans le conteneur. Par exemple, vous pouvez regrouper des boutons avec des étiquettes de texte statiques dans un conteneur dont la largeur et la hauteur minimales permettent d'afficher les boutons. Dans cet exemple, le conteneur n'est pas censé s'agrandir, car il comporte des éléments d'interface utilisateur statiques.

Lorsque vous ajoutez des conteneurs imbriqués et que vous utilisez des applications composites contenues pour créer des mises en page plus complexes, l'espace disponible pour chaque conteneur est réduit. Cela peut affecter des widgets tels que des grilles et des listes qui sont utilisées pour afficher dynamiquement les données, en fonction des données récupérées auprès des services de données ou des saisies utilisateur. Lorsqu'un ou plusieurs widgets s'étendent au-delà de l'espace disponible dans le conteneur, une partie du conteneur est masquée et des barres de défilement s'affichent. Dans certains cas, cela peut affecter l'expérience utilisateur et vous pouvez souhaiter afficher le contenu complet d'un conteneur sans afficher de barre de défilement.

Vous pouvez utiliser les options Défilement du conteneur dans le panneau Mise en page pour configurer le comportement d'un conteneur lorsque son contenu est conséquent pour tenir dans l'espace disponible. Ces options sont disponibles pour tous les conteneurs d'une mise en page comportant au moins deux conteneurs intégrés. Lorsqu'une mise en page d'application composite comporte au moins deux conteneurs intégrés avec des barres de défilement, vous pouvez afficher la barre de défilement sur le conteneur parent et permettre ainsi d'étendre les conteneurs intégrés selon les besoins. Cette action masque toutes les barres de défilement dans les conteneurs intégrés et affiche leur contenu complet. Selon le nombre de niveaux de conteneur dans votre mise en page, vous pouvez choisir d'afficher une barre de défilement sur le conteneur de niveau supérieur ou sur un conteneur intégré comportant plusieurs conteneurs intégrés. Vous pouvez ainsi créer des applications composites dynamiques qui le sont davantage lorsque vous utilisez des widgets ou des applications composites contenues dont la taille n'est pas prévisible.

Par défaut, les conteneurs d'une application composite affichent des barres de défilement horizontales et verticales lorsque leur contenu dépasse l'espace disponible. La position de la barre de défilement est déterminée par le contenu de chaque conteneur dans la mise en page. Toutefois, l'activation des barres de défilement pour chaque conteneur peut entraîner l'affichage de plusieurs barres de défilement dans des mises en page complexes, ce qui peut nuire à l'utilisabilité. Vous pouvez désormais configurer le défilement horizontal et vertical pour contrôler l'emplacement des barres de défilement dans une mise en page.

Vous ne pouvez désactiver le défilement pour un conteneur que lorsqu'il contient l'un des éléments suivants :

Pour désactiver le défilement vertical :

Pour désactiver le défilement horizontal :

Pour configurer les options de défilement d'un conteneur, procédez comme suit :

Lorsqu'un conteneur intégré s'étend au-delà de l'espace disponible, les barres de défilement s'affichent sur le conteneur sélectionné. Les conteneurs intégrés dont le contenu nécessite plus d'espace s'étendent et affichent leur contenu complet dans les conditions suivantes :

Lorsque vous désactivez le défilement intégré d'un conteneur, la même option est automatiquement appliquée à tous les conteneurs du même niveau. Pour activer le défilement intégré sur l'un de ces conteneurs, vous devez sélectionner le conteneur, puis définir une taille fixe ou une plage de tailles dans le panneau Mise en page.

Prenons l'exemple de mise en page suivant dans lequel une application composite est divisée en plusieurs conteneurs :

La figure suivante illustre la structure de mise en page du conteneur principal dans le panneau Explorateur.

Le conteneur médian est nommé container-7. Chacun de ses conteneurs intégrés possède un widget Etiquette et un widget Champ de texte qui affiche les données d'un service de données. Par défaut, lorsque le contenu s'étend au-delà de l'espace disponible dans un conteneur spécifique, une barre de défilement s'affiche. La figure suivante représente l'application composite avec le conteneur médian divisé en trois conteneurs. Chaque conteneur possède des widgets dynamiques plus grands que l'espace disponible ainsi qu'une barre de défilement.

Pour visualiser le contenu de chaque conteneur, vous devez faire défiler chaque conteneur séparément. Vous pouvez utiliser les options de défilement de conteneur dans le panneau Mise en page pour contrôler la façon dont les conteneurs intégrés sont dimensionnés. La figure suivante illustre l'application composite avec l'option Faire défiler le conteneur actuel sélectionnée pour container-7. Les éléments dans le conteneur sont alignés en haut.

Les conteneurs intégrés sont étendus dans la mise en page pour s'adapter à leur contenu et une barre de défilement unique s'affiche sur le conteneur parent. Vous pouvez faire défiler le conteneur parent pour visualiser le contenu des trois conteneurs intégrés.