Contrôles intégrés
Voici quelques-uns des contrôles Avalonia les plus couramment utilisés, organisés par catégorie :
Contrôles de mise en page
| Contrôle | Description |
|---|---|
| Border | Décore un seul enfant avec une bordure et un arrière-plan. |
| Canvas | Affiche les contrôles enfants à des positions spécifiées. |
| DockPanel | Arrange les contrôles enfants le long des bords spécifiés (haut, bas, gauche, droite) avec un remplissant tout l'espace restant. |
| Expander | A une zone d'en-tête (toujours visible) et une section de contenu réductible (un seul enfant). |
| Grid | Arrange les contrôles enfants dans les cellules d'une grille, positionnés par ligne et colonne. Les cellules peuvent s'étendre sur des lignes et des colonnes. |
| GridSplitter | Peut être ajouté à une grille pour permettre à l'utilisateur de redimensionner les lignes ou les colonnes à l'exécution. |
| Panel | Empile les contrôles enfants les uns sur les autres. |
| RelativePanel | Permet plusieurs contrôles enfants. La position et l'alignement des contrôles enfants peuvent être spécifiés par rapport au panneau lui-même, ou par rapport à d'autres contrôles enfants. La taille des contrôles enfants peut être spécifiée ou calculée à partir des relations et des alignements. |
| ScrollViewer | Ajoute des barres de défilement et un comportement de défilement si l'enfant (unique) est plus grand que l'espace disponible. |
| SplitView | Ajoute un panneau réductible au bord de sa zone de contenu (enfant unique). |
| StackPanel | Permet plusieurs contrôles enfants, disposés en séquence, horizontalement ou verticalement. |
| TabControl | Le contrôle d'onglets vous permet de subdiviser une vue en éléments d'onglet. |
| UniformGrid | Permet plusieurs contrôles enfants, disposés dans une grille avec des cellules de taille de colonne et de ligne uniforme. |
| WrapPannel | Dispose les contrôles enfants en séquence de gauche à droite, tant qu'ils tiennent dans la largeur. Commence une nouvelle ligne lorsqu'il n'y a plus d'espace. |
Boutons
| Contrôle | Description |
|---|---|
| Button | Le contrôle de bouton de base - peut afficher du texte, une icône ou les deux. A un comportement standard de 'clic'. |
| RepeatButton | Un bouton qui déclenche son événement de clic de manière répétée lorsqu'il est pressé et maintenu. |
| RadioButton | Un bouton qui a un état sélectionné. Il peut être placé dans un groupe afin que la sélection d'un bouton désélectionne tous les autres dans le groupe. |
| ToggleButton | Un bouton qui a un état sélectionné et un état non sélectionné. Les clics successifs 'alterner' cet état. Une pseudo-classe 'checked' permet d'attribuer différents styles aux états sélectionné et non sélectionné. |
| ButtonSpinner | Un contrôle avec deux boutons de rotation et une zone de contenu. |
| SplitButton | Cela fonctionne comme un bouton avec des parties primaire et secondaire qui peuvent être pressées indépendamment. La partie primaire se comporte comme un bouton standard, et la partie secondaire ouvre un menu déroulant avec des actions supplémentaires. |
| ToggleSplitButton | Cela fonctionne comme un bouton avec des parties primaire et secondaire qui peuvent être pressées indépendamment. La partie primaire se comporte comme un bouton à bascule, et la partie secondaire ouvre un menu déroulant avec des actions supplémentaires. |
Contrôles de données répétitives
Ces contrôles affichent des données répétitives, soit sous forme tabulaire, soit sous forme de liste :
| Contrôle | Description |
|---|---|
| DataGrid | Affiche des données dans une grille personnalisable. |
| ItemsControl | Affiche une collection d'éléments à partir d'une source de données liée. |
| ItemsRepeater | Affiche des données répétées à partir d'une source de données liée. Il a à la fois un modèle de mise en page et un modèle de données. |
| ListBox | Un contrôle avec des éléments qui peuvent être sélectionnés. |
| ComboBox | Un contrôle avec une liste déroulante contenant des éléments qui peuvent être sélectionnés. |
Affichage et édition de texte
| Contrôle | Description |
|---|---|
| AutoCompleteBox | Un contrôle qui affiche une zone de texte pour la saisie de l'utilisateur et une liste déroulante contenant des correspondances possibles en fonction de ce qui a été tapé. |
| TextBlock | Un contrôle qui affiche un bloc de texte. En lecture seule. |
| TextBox | Utilisé pour afficher ou éditer du texte sans restrictions de formatage. |
| SelectableTextBlock | Utilisé pour afficher ou éditer du texte sans restrictions de formatage. Permet de sélectionner et de copier. |
| MaskedTextBox | Utilisé pour afficher du texte dans le format contenu dans un masque ; ou utilisé pour éditer du texte en utilisant le masque de format pour empêcher une saisie utilisateur invalide. |
Sélection de valeur
| Contrôle | Type | Description |
|---|---|---|
| CheckBox | Booléen | Valeur vraie présentée sous forme de coche. L'interaction par clic bascule la valeur. Possède une option pour afficher une valeur 'inconnue'. |
| Slider | Double | Valeur relative par rapport à une valeur maximale et minimale présentée comme la position le long de la longueur de la piste du bouton du curseur. L'interaction de glisser sur le bouton du curseur peut modifier la valeur entre les valeurs maximales et minimales. Les interactions au clavier et par clic peuvent également ajuster la valeur. |
| Calendar | DateTime | Le calendrier est un contrôle permettant aux utilisateurs de sélectionner des dates ou des plages de dates. |
| CalendarDatePicker | DateTime | Une extension du contrôle de calendrier qui inclut une zone de texte et un bouton. |
| ColorPicker | Couleur / HsvColor | Le sélecteur de couleur prend en charge la sélection et l'édition des couleurs par l'utilisateur à l'aide d'un spectre, d'une palette et de curseurs de composants. Il prend également en charge un composant alpha optionnel, des modèles de couleur RVB ou HSV et des valeurs de couleur hexadécimales. |
| DatePicker | DateTime | Le sélecteur de date dispose de trois contrôles 'spinner' permettant à l'utilisateur de choisir une valeur de date. |
| TimePicker | TimeSpan | Le sélecteur de temps dispose de trois contrôles 'spinner' permettant à l'utilisateur de choisir une heure parmi les heures, les minutes et les secondes. |
Affichage des images
| Contrôle | Description |
|---|---|
| Image | Affiche une image bitmap ou vectorielle. |
| PathIcon | Dessine une image vectorielle en utilisant le Foreground actuel. |
Menus et Popups
| Contrôle | Description |
|---|---|
| Menu | Affiche un menu d'application. |
| Flyouts | Attache un popup ou un menu contextuel à un contrôle. |
| ToolTip | Affiche une info-bulle lorsqu'un contrôle est survolé. |