Fermer

juillet 3, 2019

L'interface utilisateur de Telerik pour Blazor 1.3.0 est arrivée!6 minutes de lecture

blazort_870x220


La version 1.3.0 de l'interface utilisateur de Telerik pour Blazor est déjà là! Il contient le nouveau composant TreeView, des options de filtrage mises à jour pour la grille, ainsi que des améliorations à d’autres composants tels que DropDownList et DatePicker.

Nous sommes très heureux d’ouvrir le mois de juillet comme il se doit: avec une toute nouvelle version de Interface utilisateur Telerik pour Blazor ! Avec la version 1.3.0 la plus récente, nous fournissons un nouveau composant ainsi que des mises à jour à travers les widgets d'interface utilisateur existants, tous basés sur les commentaires fournis par nos utilisateurs. Tout cela fait partie de notre cycle de publication continue (voir ici au cas où vous auriez manqué la version 1.2.0 ) avec des versions plus rapides pour vous fournir des mises à jour constantes. Blink et vous risquez de manquer une version.

Sans traîner la section d’intro plus loin, passons directement aux nouveaux morceaux!

Nouveaux composants

TreeView arrive pour Blazor!

 Exemple de l'interface utilisateur Telerik pour Blazor TreeView présentant un mélange de noeuds développés et réduits avec des icônes et du texte

Nous sommes très heureux de pouvoir dire que l'interface utilisateur Telerik pour Blazor TreeView est arrivée! Bien que ce soit la première version, nous avons beaucoup de fonctionnalités à mettre en évidence et le composant est déjà bien placé.

Modèles

Besoin de fournir plus d'éléments dans un élément que nous n'offrons des options de configuration? Ou voulez-vous simplement une autre mise en page pour vos nœuds TreeView? La fonctionnalité de modèle TreeView vous permet de fournir des modèles personnalisés dans chaque nœud de TreeView. Vous avez même la possibilité de définir ceci niveau par niveau, comme nous le soulignons dans notre démonstration de modèle TreeView .

Données hiérarchiques ou non hiérarchiques

Qu'est-ce qu'un TreeView sans ses données? Une grande partie de ce sur quoi nous nous sommes concentrés avec cette version initiale de TreeView est de vous assurer que vous pouvez lier correctement les données au composant. Ainsi, le Telerik Blazor TreeView peut être lié à des données horizontales et hiérarchiques, ce qui vous donne de nombreuses options pour la liaison au composant. Comme référence rapide, voici la démonstration de données à plat et la démonstration de données hiérarchiques pour vous permettre de comparer les deux approches:

Lazy Loading

À propos des données , hors de la boîte nous soutenons le chargement paresseux des différents niveaux de TreeView. Cela signifie que pour les grands ensembles de données, vous n'avez pas à vous soucier de charger toutes ces données en même temps. Lors du chargement initial de la page, seul le niveau racine sera chargé (sauf si vous avez configuré un nœud pour être développé initialement). Les enfants d'un nœud particulier ne seront pas chargés tant que l'utilisateur n'aura pas agrandi le nœud, ce qui vous offrira une expérience conviviale en termes de performances.

Bindings

En allant avec les données (puisque nous sommes sur une lancée ici), nous devrions également mentionner la flexibilité que nous avons cuite dans les reliures. Comme le montre cette démonstration nous avons des noms de champs par défaut qui seront automatiquement récupérés par le composant TreeView s'ils existent sur votre modèle. Cela comprend Id Texte Articles Le parent ID Icône IconClass ImageUrl et HasChildren . Si vous ne souhaitez pas transformer vos données existantes pour les adapter à ces conventions de dénomination, vous pouvez simplement travailler sans les liaisons TreeView et définir les champs de votre modèle qui correspondent à ces propriétés attendues par TreeView.

La meilleure partie de tout cela? Vous pouvez définir ces liaisons par niveau, vous pouvez donc définir différentes liaisons en fonction de votre position dans la hiérarchie TreeView!

Mises à jour des fonctionnalités

Le filtrage de la grille obtient une liste

La grille de données de Telerik UI for Blazor prend en charge le filtrage depuis un certain temps maintenant. Cependant, le filtrage a été limité à une interaction plus ou moins forte sur un type de filtre prédéfini. Eh bien non plus! Avec la version 1.3.0, l'interface utilisateur de Telerik pour Blazor Grid propose désormais une liste intégrée qui s'affiche lorsque vous cliquez sur l'icône de filtre, vous permettant de sélectionner le type de filtrage que vous souhaitez effectuer sur une colonne particulière.

 Interface utilisateur Telerik pour Blazor Grid avec liste de filtres étendue offrant des options telles que conteneur, commence par et autres à appliquer au filtre actuel d'une colonne

Il y a encore beaucoup à venir pour la grille (et le filtrage) et Bien que nous ayons marqué des requêtes de fonctionnalités comme celle-ci comme étant terminées, nous ne nous arrêtons pas ici! Cela fait partie d'un effort continu visant à faire évoluer la grille et ses fonctionnalités afin de nous assurer que nous puissions répondre à toutes les exigences de vos applications Blazor à partir d'un tableau de données.

Amélioration de DropDowns and Popups

Ce n’est pas quelque chose d’apparent pour tout le monde, travailler avec des popups dans Blazor et l’interface utilisateur Telerik pour Blazor a été délicat. Plus précisément, les menus déroulants et les fenêtres contextuelles ont été rendus à la place de la déclaration, ce qui signifie que leurs éléments contenant / parent les contrôlent un peu. Par exemple, nous n'avons pas été en mesure d'utiliser nos DatePickers ou DropDowns dans les modèles de modification de la grille Telerik car la fenêtre contextuelle / déroulante sera masquée «sous» les cellules environnantes. Cet article de commentaires contient quelques bons exemples de ce à quoi cela ressemblait jusqu'à présent.

Eh bien, après quelques recherches et quelques retours d'informations concernant notre approche, nous pouvons enfin dire que nous avons une excellente solution place pour traiter avec les popups à travers toutes nos composantes. Nous avons correctement détaché ces fenêtres contextuelles du composant, ce qui leur permet de s'afficher librement sans se soucier de l'endroit où elles ont peut-être été ajoutées à la page (pas seulement dans la grille Telerik). Voici quelques scénarios possibles:

  • Utilisation de Telerik Blazor Grid et de tout éditeur personnalisé impliquant une fenêtre contextuelle telle que DropDownList, ComboBox, DatePicker, etc.
  • Tout scénario dans lequel vous avez besoin d'un composant. utilisation d'une fenêtre contextuelle telle que DropDown ou DatePicker dans un élément comportant ensemble: hidden ensemble.
  • Conflits autour de z-index dans votre présentation et les menus déroulants devant apparaître au-dessus d'autres éléments dans votre application.

Tout cela est probablement considéré comme un acquis, en particulier si vous venez d'autres environnements basés sur le Web. Grâce à cette amélioration, cela signifie que nous pouvons continuer à construire ces composants sans vous soucier de problèmes de découpage bizarres ici et là.

Nous voulons vous entendre!

C’est tout pour la version 1.3.0! Nous travaillons déjà beaucoup sur la version 1.4.0, mais entre-temps, nous voulons connaître votre avis sur les fonctionnalités que vous aimeriez voir dans une prochaine version. Si vous avez des commentaires, ou si certains composants ou fonctionnalités vous manquent, est sur notre portail de commentaires public et faites-le savoir!




Source link