Fermer

novembre 22, 2021

Filtrez vos données avec style à l'aide de RadFilterView


Avez-vous déjà souhaité que votre application dispose des options de filtrage des sites commerciaux les plus populaires ? C'est désormais possible, avec le tout nouveau contrôle RadFilterView . Il est fourni avec la dernière version R3 2021 de Telerik UI for WinForms.

RadFilterView est un contrôle qui pour filtrer facilement les données, à l'aide de l'interface utilisateur intuitive. Il est conçu pour fonctionner avec nos contrôles les plus populaires tels que RadGridView, RadListView, RadTreeView, etc. Vous pouvez simplement définir la propriété AssociatedControl de RadFilterView et, lorsque l'utilisateur modifie certains filtres, le contrôle associé sera instantanément filtré.

this.radFilterView1.AssociatedControl = this.radGridView1;[19659007]filter-view - Avec des cases à cocher de filtrage pour le prénom, l'utilisateur clique sur Chris puis sur Janet. Les résultats filtrent d'abord pour Chris uniquement, puis pour les deux noms." title="filter-view"/>

Si vous ne souhaitez pas déclencher le filtrage du contrôle associé à chaque fois que l'utilisateur effectue une seule modification, vous pouvez modifier la propriété FilteringMode.

cela[19659004].radFilterView1.FilteringMode = FilteringMode.Programmatically;

Le contrôle peut également fonctionner de manière autonome (sans contrôle associé). Dans ce mode, la propriété DataSource doit être définie pour alimenter le contrôle en données.

Lorsque l'utilisateur modifie une valeur dans une catégorie, l'événement FilterChanged du contrôle est déclenché. Dans le gestionnaire d'événements, vous pouvez utiliser la collection de FilterDescriptors, qui est utilisée pour filtrer la plupart de nos contrôles de données, ou la propriété RadFilterView.Expression, qui renvoie une chaîne de type requête SQL :

"[FirstName] IN (' Bruce','Chris') AND [SSN] >= 2882255 AND [Married] = True"

Catégories

Comment ça marche ? Lorsque la source de données est définie, le contrôle de vue de filtre crée une catégorie pour chaque colonne des données correspondantes. Parcourt ensuite chaque enregistrement et stocke les valeurs. En fonction du type de données de la colonne, le contrôle crée des types distincts de catégories :

  • Texte (string) data : La catégorie crée une liste d'éléments de case à cocher avec toutes les valeurs uniques. Vous pouvez basculer entre les choix simples et multiples.

    text-category - Parmi les six filtres de cases à cocher pour les noms de famille, trois sont sélectionnés

  • Données numériques : Cette catégorie affiche les entrées numériques (RadSpinEditorElements) et limite la modification les valeurs comprises entre les valeurs minimales et maximales trouvées dans la source de données. Il y a aussi un RadTrackbarElement (curseur) ajouté sous les éditeurs de spin pour un contrôle encore meilleur des valeurs. C'est un ancêtre de la catégorie de texte et affiche deux cases à cocher avec des valeurs vraies et fausses. ). Et tout comme les entrées numériques, les utilisateurs sont limités à modifier les dates dans la plage entre les valeurs minimales et maximales dans la source de données.

    datetime-category - Date de naissance avec plage From/To avec dates

  • Indicateurs : Le but des indicateurs de filtre est de permettre aux utilisateurs d'identifier facilement les catégories avec des valeurs modifiées (par exemple, la catégorie de texte avec certaines cases cochées ou la catégorie numérique avec une valeur minimale modifiée). Ceci est extrêmement utile lorsque l'utilisateur a réduit certaines catégories et ne voit que le texte de l'en-tête. L'indicateur permet également d'effacer le filtre de la catégorie actuelle ou tous les filtres du contrôle.

    indicateur - effacer le filtre, effacer tous les filtres

Travailler avec les catégories

Les catégories offrent une variété d'options où vous pouvez remplacez toute la catégorie par une catégorie personnalisée, personnalisez la catégorie ou modifiez simplement les valeurs.

Regardons maintenant une vue filtrée liée aux données de texte. Voici à quoi ressemble la catégorie de texte créée par défaut :

category-demo-initial - l'en-tête de catégorie lit 'product_name'

Comme vous pouvez le voir, le texte de l'en-tête de catégorie n'est pas convivial car il est le même que le nom de la colonne source. Le nom d'affichage de la catégorie peut être modifié dans les événements CategoryCreating ou CategoryCreated.

private void RadFilterView1_CategoryCreated(object sender, FilterViewCategoryCreatedEventArgs e)[1945199013][196905990] ]

    if (e.Category.PropertyName == "product_name")

    {

        e.Category.DisplayName = "Nom du produit" ;[19659002]    }

}

category-demo-header-text - l'en-tête de catégorie se lit "Nom du produit"

Une autre chose que l'on peut voir est que les valeurs sont dans le même ordre qu'elles apparaissent dans la source de données. Lorsque nous avons un grand nombre de valeurs de texte, il serait beaucoup plus facile pour les utilisateurs de naviguer dans les données triées par ordre alphabétique. Le bon endroit pour réorganiser les valeurs est l'événement CategoryCreating. Ici, vous pouvez même remplacer toute la catégorie. Voici un exemple de code expliquant comment trier les valeurs.

private void RadFilterView1_CategoryCreating(object sender, FilterViewCategoryCreatingEventArgs e)

[194490]][19459011

    List<object> values ​​= e.Values.ToList();

values.Sort();

    e.Values ​​= valeurs;

}[19659011]category-demo-ordered-values" title="category-demo-ordered-values"/></p data-recalc-dims=

Bien mieux ! Pour le rendre encore plus lisible, nous pouvons mettre en majuscule la première lettre de chaque produit. peut être fait dans l'événement ItemCreated de la catégorie text et modifier le texte de l'élément (en utilisant la méthode ToTitleCase de la culture TextInfo). Le bon endroit pour attacher à cet événement est à nouveau dans la veille CategoryCreating nt.

private void RadFilterView1_CategoryCreating(object sender, FilterViewCategoryCreatingEventArgs e)

][{{    List<object> values ​​= e.Values.ToList();

    values.Sort();

    e.Values ​​= valeurs ;

 

    FilterViewTextCategoryElement e.Category as FilterViewTextCategoryElement;

    category.ItemCreated += this[19659004;Category19[459008] ]

}

 

privé void Category_ItemCreated(object expéditeur, FitlerViewTextCa tegoryItemCreatedEventArgs e)

{

    TextInfo info = CultureInfo.CurrentCulture.TextInfo;" title="filter-view"/>

" title="filter-view"/>

    string newText = info.ToTitleCase(e.Item.Text);

    e.Item.Text = newText ;

}

Et le résultat final 😋 :

category-demo-capitalized-values" title="category-demo-capitalized-values "/></p data-recalc-dims=

Vous pouvez trouver plus d'informations sur le contrôle RadFilterView dans notre documentation en ligne.

Partagez vos commentaires

N'hésitez pas à nous laisser un commentaire ci-dessous pour partager vos réflexions. Nous aimerions savoir comment tout cela fonctionne pour vous. 😊 Vous pouvez visiter notre Interface utilisateur pour le portail de commentaires Winforms et nous faire savoir si vous avez des suggestions pour des fonctionnalités/contrôles particuliers.

Si vous n'avez pas essayé l'interface utilisateur Telerik pour WinForms, vous devriez Consultez notre essai gratuit ou, mieux encore, parcourez toutes nos suites d'interface utilisateur dans le Bundle DevCraft !




Source link