Fermer

septembre 20, 2023

Élevez les applications .NET MAUI avec une grille puissante

Élevez les applications .NET MAUI avec une grille puissante


Un DataGrid riche en fonctionnalités peut réduire le temps de développement des applications .NET MAUI et améliorer l’expérience utilisateur.

.NET MAUI est l’évolution du développement multiplateforme .NET : une seule base de code partagée peut alimenter des applications sur des formats mobiles ou de bureau. Bien que .NET MAUI fournisse un cadre de base solide et des outils stables, le développement d’applications réelles exige souvent beaucoup des développeurs : une certaine autonomie de l’interface utilisateur est la bienvenue.

La plupart des applications modernes doivent afficher une liste d’éléments : les données tabulaires nécessitent une visualisation appropriée de l’interface utilisateur et les utilisateurs ont besoin de nombreuses fonctionnalités pour travailler avec les données. Une grille de données est souvent le composant d’interface utilisateur de choix, mais une grille peut faire ou défaire une application.

Le DataGrid Telerik

Progrès Interface utilisateur Telerik pour .NET MAUI est une bibliothèque complète de composants d’interface utilisateur, destinée à rendre les développeurs .NET MAUI plus productifs : un ensemble de composants d’interface utilisateur performants et raffinés pour les applications mobiles et de bureau multiplateformes. Le composant d’interface utilisateur le plus populaire de Telerik UI pour .NET MAUI est sans doute l’omniprésent Grille de données: une grille de données riche et soigneusement conçue, prête à éclairer les applications avec toutes leurs fonctionnalités.

Avec Telerik UI pour .NET MAUI, les développeurs disposent pour la première fois d’une interface utilisateur Telerik DataGrid qui fonctionne de manière transparente sur les facteurs de forme mobiles et de bureau – et ce n’est pas une déclaration légère à faire. Le même composant d’interface utilisateur s’adresse à différentes expériences utilisateur en fonction de la plate-forme cible : le toucher d’abord sur iOS/Android et la souris et le clavier d’abord sur Windows/macOS.

Le Telerik DataGrid est riche en fonctionnalités et effectue un rendu au pixel près sur toutes les plates-formes, afin que les développeurs puissent rapidement éclairer des expériences de données riches dans les applications .NET MAUI. Même si les développeurs peuvent lire de bonnes Documentation ou bricoler nous-mêmes, essayons de convaincre tous les sceptiques avec une liste de fonctionnalités importantes du Telerik .NET MAUI DataGrid – un aperçu de ce que le DataGrid apporte immédiatement. Préparez-vous à voir les résultats d’une ingénierie solide.

telerik ui pour .net maui sur macOS, Windows, iOS et Android

Types de colonnes

Les colonnes de Telerik DataGrid représentent la complexité et la variété des types de données dans les données sous-jacentes. Il est compréhensible que les développeurs fassent preuve d’une grande flexibilité dans les colonnes.

Les colonnes DataGrid peuvent être ajoutées de trois manières (automatique, manuelle ou mixte) et les types de colonnes sélectionnés ont un impact important lorsque le DataGrid passe en mode édition. Dans le but de mieux correspondre à la collection de données liées, Telerik DataGrid propose une variété de types de colonnes intégrés : texte, numérique, booléen, date, heure, ComboBox et modèle personnalisé. Tous les types de colonnes héritent de la classe DataGridColumn, qui offre une vaste API permettant aux développeurs de personnaliser entièrement l’apparence et les fonctionnalités de chaque colonne DataGrid.

colonne de date, couleur du texte sélectionné, mode édition

Réorganisation des colonnes

Les utilisateurs finaux de DataGrid doivent se sentir autonomes et pouvoir visualiser les données comme ils le souhaitent. Une façon d’y parvenir consiste à offrir aux colonnes d’un DataGrid une fonctionnalité de réorganisation : les utilisateurs doivent pouvoir déplacer les colonnes et voir les éléments qui comptent pour eux dans un ordre donné. Le Telerik DataGrid expose une fonctionnalité de réorganisation simple, permettant à l’utilisateur de glisser-déposer des colonnes pour modifier leur ordre. Grâce à une API simple, la réorganisation des colonnes de Telerik Grid fonctionne de manière transparente avec les gestes tactiles sur mobile et les mouvements de souris sur le bureau.

colonne en cours de réorganisation par glisser-déposer

Colonnes gelées

Toutes les données présentées dans un DataGrid ne sont pas identiques pour les utilisateurs : certaines sont bien plus importantes à ne pas perdre de vue. Telerik DataGrid offre une fonctionnalité astucieuse de colonnes gelées qui permet aux utilisateurs de geler et de toujours voir ce qui est le plus important pour eux. Une seule colonne ou un ensemble de colonnes peut être gelée : elles restent épinglées à gauche avec un séparateur qui peut être personnalisé, tandis que l’utilisateur peut naviguer/faire défiler toutes les données/colonnes sur la droite.

la colonne gelée reste visible pendant que le contenu à droite défile

Regroupement

Souvent, la meilleure façon de donner un sens à de grandes quantités de données est de regrouper les éléments : rassembler des entités communes permet d’ajouter de la perspective au reste des données. Telerik DataGrid est livré avec une fonctionnalité de regroupement intégrée robuste avec une UX claire, pilotée soit manuellement via l’interface utilisateur de regroupement, soit par programme via des descripteurs de groupe Propriété/Délégué.

L’interface utilisateur de regroupement DataGrid est activée par conception sur le bureau et désactivée sur mobile : elle permet à l’utilisateur de regrouper les données DataGrid en faisant glisser et en déposant les en-têtes de colonne en haut. Avec le regroupement programmatique, le contrôle des API d’expansion/réduction et de style, Telerik DataGrid élimine les maux de tête des développeurs : le regroupement est prêt à l’emploi.

L'utilisateur choisit l'ordre de regroupement en faisant glisser les en-têtes de colonnes dans le contrôle Regrouper par

Filtration

Une grande quantité de données peut devenir écrasante : filtrer les besoins exacts est souvent le seul chemin vers la raison. L’interface utilisateur de Telerik pour .NET MAUI DataGrid offre une prise en charge avancée des opérations de filtrage, soit via l’interface utilisateur de filtrage, soit par programme. L’interface utilisateur de filtrage fonctionne pour chaque colonne DataGrid et propose des choix liés aux données pour accéder à des occurrences spécifiques dans les données, ainsi que différentes manières de rechercher des correspondances. Les descripteurs de filtre, en revanche, offrent la même granularité de filtrage par programmation.

L'utilisateur clique sur le bouton de filtre et sélectionne les éléments à filtrer

Tri

L’ordre des données est essentiel : les utilisateurs doivent pouvoir voir les données dans une grille dans l’ordre des éléments importants. L’interface utilisateur Telerik pour .NET MAUI DataGrid fournit une fonctionnalité de tri intégrée robuste, qui permet aux utilisateurs d’ordonner l’affichage des données présentées. Cela peut être contrôlé via l’interface utilisateur ou par programme. L’ordre de tri peut être contrôlé par une/plusieurs colonnes ou des clés personnalisées par ordre croissant ou décroissant.

trier une colonne par ordre alphabétique

Détails de la ligne

Les DataGrids visualisent souvent des données complexes : des relations et des hiérarchies peuvent être impliquées en fonction d’une ligne sélectionnée de données DataGrid. Pour essayer d’aider, l’interface utilisateur Telerik pour .NET MAUI DataGrid est capable de présenter des informations supplémentaires via la fonctionnalité Row Details. RowDetails est un modèle de données défini au niveau DataGrid ou ligne, utilisé pour afficher des données supplémentaires sans affecter les dimensions de la ligne et des cellules qu’elle contient. Avec le modèle RowDetails, chaque ligne sélectionnée/non sélectionnée du DataGrid peut afficher des informations supplémentaires. Il s’agit essentiellement d’un conteneur permettant de visualiser des informations contextuelles stylisées de manière appropriée.

les détails de la ligne affichent une belle présentation des informations pour la ligne sélectionnée

Agrégats

La synthèse des données est importante pour donner un sens à de grandes quantités d’informations. Heureusement, Telerik .NET MAUI DataGrid expose des API d’agrégats flexibles avec des actions d’agrégation communes sur des collections de données liées : cela peut être effectué sur des propriétés de données ou des délégués personnalisés. Les valeurs agrégées peuvent être affichées dans les en-têtes/pieds de page et fonctionner également avec des données groupées.

Entre les descripteurs d’agrégat de propriété/délégué, les développeurs peuvent permettre aux utilisateurs de visualiser une variété de fonctions d’agrégat sur les données, telles que les totaux, le minimum, le maximum, la moyenne, l’écart type, la variance, etc.

Le bas d'un tableau de données affiche les agrégats comprenant le nombre total, l'article le moins cher, l'article le plus cher, le coût moyen et le montant total.

Édition

À quoi servent les données sans la possibilité de les manipuler ? L’interface utilisateur Telerik pour .NET MAUI DataGrid fournit de puissantes capacités d’édition intégrées, qui permettent aux utilisateurs de modifier facilement les données présentées dans la grille. Les développeurs n’ont pas besoin de créer d’interface utilisateur d’édition : chaque type de colonne DataGrid fournit différents éditeurs, afin que le contenu puisse être modifié de manière pratique en fonction de son type de valeur. Avec la prise en charge des éditeurs personnalisés, des événements du cycle de vie des modifications, des modes de persistance et des API de style, Telerik DataGrid simplifie le travail de modification des données.

Liste des types de colonnes avec type Editeur

Chargement à la demande

Bien que cela ne soit pas recommandé, les développeurs peuvent souvent lier les DataGrids à une très grande collection de données côté client. Les utilisateurs s’attendent toujours à ce que les DataGrids offrent un défilement fluide et soient performants. L’astuce d’ingénierie est la virtualisation ou le chargement à la demande : même si elle est liée à une grande collection, l’interface utilisateur rendue est liée à des ensembles de données plus petits et le DataGrid se lie aux ensembles suivants lorsque l’utilisateur fait défiler/interagit.

L’interface utilisateur Telerik pour .NET MAUI DataGrid intègre la virtualisation : elle prend en charge le chargement à la demande pour effectuer un chargement de données incrémentiel lorsque les éléments doivent être visualisés. Le chargement à la demande de Telerik DataGrid peut s’effectuer selon deux modes : automatique ou manuel, avec une virtualisation effectuée via une collecte de données intelligente ou déclenchée par un événement/une commande.

style - charger le style de ligne à la demande

API de style

Les développeurs qui utilisent DataGrids dans les applications recherchent souvent la cohérence : l’interface utilisateur de la grille doit correspondre à l’esthétique, au style et à l’UX du reste de l’application. Il peut exister des systèmes de conception existants sur lesquels les applications doivent s’aligner et il est important de pouvoir styliser un DataGrid avec une flexibilité totale.

L’interface utilisateur Telerik pour .NET MAUI DataGrid permet aux développeurs de personnaliser complètement son apparence, grâce aux options de configuration de style disponibles. Un style personnalisé peut s’appliquer aux lignes, colonnes, cellules, en-tête et pied de page. Le style DataGrid peut être appliqué pour les lignes alternatives, les lignes/cellules actuelles/sélectionnées, les indicateurs de tri/filtre, le survol de la souris, ainsi que lorsque des conditions de données spéciales définies sont remplies. Les développeurs et les concepteurs peuvent collaborer pour que l’interface utilisateur Telerik pour .NET MAUI DataGrid ressemble exactement à ce qu’elle devrait être : les API de style offrent une personnalisation complète.

options de style de grille de données

Navigation au clavier

.NET MAUI permet aux développeurs d’accéder aux appareils mobiles et aux ordinateurs de bureau à partir d’une seule base de code partagée, mais l’UX doit être différente selon les facteurs de forme. Les utilisateurs de DataGrid sur mobile interagissent par le toucher, tandis que les utilisateurs de bureau sont plus exigeants avec la souris/le clavier. Les développeurs ne devraient pas avoir à effectuer de travail supplémentaire pour rendre les deux possibles.

En plus de la prise en charge tactile/souris, l’interface utilisateur Telerik pour .NET MAUI DataGrid offre désormais une prise en charge robuste du clavier, pour Windows via WinUI ou macOS via MacCatalyst. Avec un mappage intuitif pour les touches du clavier, Telerik DataGrid élève l’UX pour les utilisateurs de bureau ayant des besoins de navigation avancés.

combinaisons de raccourcis clavier répertoriées avec les actions associées

Conclusion

Vous êtes peut-être en train de créer la prochaine application mobile multiplateforme géniale avec .NET MAUI. Vous renforcez peut-être les flux de travail de votre entreprise avec une application de bureau robuste. Si votre application traite beaucoup de données, une grille de données est probablement votre composant d’interface utilisateur de choix.

Vous n’avez pas besoin de passer des années à concevoir toutes les fonctionnalités : l’interface utilisateur Telerik pour .NET MAUI DataGrid vous soutient ! Il est riche en fonctionnalités et performant, et fonctionne de manière transparente sur mobile ou ordinateur de bureau avec une UX appropriée. Allez changer le monde avec votre application !

Essayez l’interface utilisateur Telerik pour .NET MAUI




Source link

septembre 20, 2023