English
Français

Blog of Denis VOITURON

for a better .NET world

FluentUI.Blazor v4.7.2

Posted on 2024-05-03

Vue d’ensemble

Nous venons de publier une nouvelle version 4.7.2 de Microsoft.FluentUI.AspNetCore.Components. Cette version corrige certains bugs détectés ces derniers jours, mais ajoute également quelques nouvelles fonctionnalités.

DataGrid

  1. Intégration du paramètre ShowHover pour souligner automatiquement la ligne survolée.

  2. Implémentation de l’option MultiSelect par l’ajout d’une colonne supplémentaire nommée SelectColumn.

Il y a deux façons de gérer une SelectColumn.

Ces exemples utilisent une classe contenant :

DataGridSelectMode Mode = DataGridSelectMode.Multiple;
IEnumerable<Person> SelectedItems = People.Where(p => p.Selected);

record Person(int PersonId, string Name, DateOnly BirthDate) 
{
    public bool Selected { get; set; }
};

SelectColumn

InputLabel: Orientation

Comme indiqué dans le Fluent Design, une étiquette doit être placée au-dessus du composant d’entrée auquel elle appartient. Il est également indiqué : “En option, vous pouvez aligner les étiquettes à gauche si l’espace est limité et si les champs sont d’un type et d’une largeur cohérents. Soyez prudent lorsque vous alignez les étiquettes à gauche, car cela peut nuire à la lisibilité.”

Cette option peut bien sûr être utilisée dans une barre d’outils, par exemple. Pour faciliter le placement de l’étiquette devant l’entrée plutôt qu’au-dessus, un paramètre Orientation est ajouté au composant. En réglant sa valeur sur Orientation.Horizontal (la valeur par défaut est Orientation.Vertical), le label est aligné devant le composant.

<FluentInputLabel ForId="s1" Orientation="Orientation.Horizontal">Select something</FluentInputLabel>
<FluentSelect Id="s1" Class="below outline" @bind-Value="@comboboxValue" TOption="string">
    <FluentOption id="option-15">Option 1</FluentOption>
    <FluentOption id="option-16">Second option</FluentOption>
    <FluentOption id="option-17">Option 3</FluentOption>
</FluentSelect>

InputLabel-Horizontal

Corrections diverses

Le reste des corrections et des changements pour cette version est (à nouveau) une liste assez longue. Nous vous renvoyons à la page What’s new sur le site de la documentation pour une vue d’ensemble complète (y compris les liens vers les problèmes et les demandes de modifications sur GitHub).

Web sites

Feedback

Si vous trouvez quelque chose qui sort de l’ordinaire, faites-le nous savoir dans le repo sur GitHub, ou Twitter / X.

Langues

EnglishEnglish
FrenchFrançais

Suivez-moi

Articles récents