Chapitre 5. Les Composants d'Interface Utilisateur
Table des matières
- 5.1. Généralités
- 5.2. Interfaces et Abstractions
- 5.3. Common Component Features
- 5.4.
Label - 5.5.
Link - 5.6.
TextField - 5.7.
TextArea - 5.8.
PasswordField - 5.9.
RichTextArea - 5.10. Date and Time Input with
DateField - 5.11.
Button - 5.12.
CheckBox - 5.13. Selecting Items
- 5.13.1. Binding Selection Components to Data
- 5.13.2. Basic
SelectComponent - 5.13.3.
ListSelect - 5.13.4. Native Selection Component
NativeSelect - 5.13.5. Radio Button and Check Box Groups with
OptionGroup - 5.13.6. Twin Column Selection with
TwinColSelect - 5.13.7. Allowing Adding New Items
- 5.13.8. Multiple Selection Mode
- 5.13.9. Other Common Features
- 5.14.
Table - 5.15.
Tree - 5.16.
MenuBar - 5.17.
Embedded - 5.18.
Upload - 5.19.
Form - 5.20.
ProgressIndicator - 5.21.
Slider - 5.22.
LoginForm - 5.23. Component Composition with
CustomComponent
Ce chapitre contient des généralités et une description détaillée de l'ensemble des composants de Vaadin n'étant pas des composants de disposition.
Vaadin fournit un vaste ensemble de composants d'interface utilisateur et vous permet de définir des composants personnalisés. La Figure 5.1, « Diagramme d'héritage des composants d'UI » illustre la hiérarchie d'héritage des interfaces et classes de composants d'interface utilisateur. Les Interfaces sont affichés en gris, les classes abstraites en orange et les classes en bleu. Une version annotée du diagramme est présentée dans la Vaadin Cheat Sheet.
L'interface Component est au sommet de la hiérarchie des interfaces. . En ce qui concerne les classes c'est la classe AbstractComponent class qui est au sommet. Elles est dérivées par deux autres classes abstraites: AbstractField qui est héritée par les composants champs de saisie et par AbstractComponentContainer qui est heritée par divers composants de type containers ou layout. Les composants qui ne sont pas liés à un modèle de données tels que les labels et les links héritent de la classe AbstractComponent directement.
La disposition des différents composants d'une fenêtre est gérée bien logiquement par les composants de type layout, tout comme avec les toolkits UI Java pour les applications de bureau. De plus à l'aide du composant CustomLayout vous pouvez définir un layout personalisé comme un gabarit XHTML qui inclut alors les emplacements des composants incluts. En regardant le digramme d'héritage on peut voir que les composants de type layout hérite de AbstractComponentContainer et de l'interface Layout. Les composants de layout sont décrit en détail au Chapitre 6, Gestion de la mise en page.
Si on le regarde selon une perspective de hiérarchie d'objets on a un objet Window qui contient une hiérarchie de composants de disposition (layout) qui eux même contiennent d'autres composants de disposition et diverse composants visibles.
Vous pouvez explorer l'ensemble des composants d'interface utilisateur de la librairie Vaadin en utilisant l'application Sampler de la démo Vaadin Demo. Sampler affiche une description, la documentation JavaDoc et des exemples de code pour chacun des composants.
En plus des composant intégrés, de nombreuses composants sont disponibles sous la forme d'add-ons, soit à partir du dépôt (Vaadin directory) ou à partir de sources tierces. Il existe des composants gratuits et d'autres non. L'installation des add-ons est décrite au Chapitre 15, Using Vaadin Add-ons.
Anti-séches et carte de référence
Figure 5.1, « Diagramme d'héritage des composants d'UI » is included in the Vaadin Cheat Sheet that illustrates the basic relationship hierarchy of the user interface components and data binding classes and interfaces. You can download it at http://dev.vaadin.com/browser/doc/trunk/cheatsheet/vaadin-cheatsheet-duplex.pdf.
Le diagramme est également inclus dans la Refcard DZone de 6 pages que vous pouvez trouver à https://vaadin.com/refcard.