Passer au contenu principal

Toolbar

Ouvrir dans ChatGPT
Ombre dwc-toolbar 24.12
Java API

Les barres d'outils offrent aux utilisateurs un accès rapide aux actions essentielles et aux éléments de navigation. Le composant webforJ Toolbar est un conteneur horizontal qui peut contenir un ensemble de boutons d'action, d'icônes ou d'autres composants. Il est bien adapté pour gérer les contrôles de page et abriter des fonctions clés comme une barre de recherche ou un bouton de notification.

Organiser le contenu de la barre d'outils​

Le Toolbar organise les composants essentiels dans une disposition facilement accessible et cohérente. Par défaut, il prend toute la largeur de son élément parent et offre quatre zones de placement, ou slots, pour organiser les composants :

  • Début : Contient généralement un AppDrawerToggle ou un bouton d’accueil.
  • Titre : Utilisé pour les noms d'application ou les logos.
  • Contenu : Pour les actions à forte attention comme la recherche ou la navigation.
  • Fin : Actions moins fréquentes, telles que le profil utilisateur ou l'aide.

Chaque slot dispose d'une méthode pour ajouter des composants : addToStart(), addToTitle(), addToContent(), et addToEnd().

La démonstration suivante montre comment ajouter une Toolbar à un AppLayout et utiliser efficacement tous les slots pris en charge. Pour en savoir plus sur la mise en œuvre des barres d'outils dans un AppLayout, consultez Barres d'outils collantes et Disposition de navigation mobile.

Afficher le code

Mode compact​

Utilisez setCompact(true) pour réduire le rembourrage autour d'une Toolbar. Cela est utile lorsque vous devez faire tenir plus de contenu à l'écran, en particulier dans les applications avec des barres d'outils empilées ou un espace limité. La barre d'outils se comporte toujours de la même manière—seule la hauteur est réduite. Ce mode est couramment utilisé dans les en-têtes, les barres latérales ou les mises en page où l'espace est restreint.

Toolbar toolbar = new Toolbar();
toolbar.setCompact(true);
Afficher le code

ProgressBar dans les barres d'outils​

Un ProgressBar sert d'indicateur visuel pour les processus en cours, comme le chargement de données, le téléchargement de fichiers ou l'achèvement d'étapes dans un flux. Lorsqu'il est placé à l'intérieur d'une Toolbar, le ProgressBar s'aligne soigneusement le long du bord inférieur, le rendant peu intrusif tout en communiquant clairement les progrès aux utilisateurs.

Vous pouvez le combiner avec d'autres composants dans la barre d'outils comme des boutons ou des étiquettes sans perturber la mise en page.

Afficher le code

Stylisation​

Thèmes​

Les composants Toolbar incluent sept thèmes intégrés pour une personnalisation visuelle rapide :

Afficher le code

Loading...