Fermer

septembre 12, 2018

Interface utilisateur Telerik pour ASP.NET MVC et ASP.NET Core


Nous examinons plus en détail les nouveaux composants, fonctionnalités, thèmes et autres éléments de l'interface utilisateur pour ASP.NET MVC et Telerik UI pour ASP.NET Core dans R3 2018.

Vous avez probablement déjà vu le résumé fourni. dans l'article Telerik R3 2018, mais je voulais examiner plus en détail les nouveautés de Interface utilisateur Telerik pour ASP.NET MVC et Interface utilisateur Telerik pour Composants ASP.NET Core avec cette nouvelle version passionnante!

Nouveaux composants MVC et Core

Couvrons quelques-unes des mises à jour les plus courantes sur les interfaces Telerik pour ASP.NET MVC et Telerik UI pour ASP.NET Core, comme il y en a pas mal.

Rappelons-nous les nouveaux composants que nous ajoutons. Je suis heureux de dire qu'avec R3 2018, nous avons livré l'élément de commentaires le plus voté: une liste déroulante avec une structure de table pour chaque élément.

Présentation du MultiColumnComboBox

Comme son nom l'indique, avec le R3 2018 release Nous avons maintenant officiellement un composant ComboBox qui fournit une grille permettant d'afficher des valeurs de données supplémentaires pour chaque élément.

 001-MultiColumnComboBox "title =" 001-MultiColumnComboBox "style =" float: left; "/> [19659009] La puissance de ce composant provient des fonctionnalités issues d'un ComboBox, notamment:</p data-recalc-dims=

  • Filtrage sur serveur
  • Virtualisation
  • Regroupement
  • Modèles
  • Navigation sur le clavier
  • MultiColumnComboBox en cascade

ceux d'entre vous qui sont familiers avec notre ComboBox standard, ce sont toutes des fonctionnalités déjà disponibles dans ce composant.Grâce au référencement de ComboBox lors de l'implémentation de ce composant, nous avons déjà ajouté une longue liste de fonctionnalités importantes. s vraiment prêt à être ajouté à toute application Web MVC ou Core.

Visualisation des données – Ajout de la jauge d'arc

Bien que nos composants d'entrée de données et d'interface utilisateur complexe soient populaires, ainsi que. Les jauges ne font certainement pas exception et nous avons reçu pas mal de demandes concernant le type de jauges que nous pouvons offrir. Pour satisfaire votre appétit pour plus de visuels, nous avons ajouté un composant tout nouveau, l'ArcGauge . Ce widget vous offre un moyen simple et élégant d'afficher une valeur ou un pourcentage d'une valeur sans autre gonflement supplémentaire.

 002-ArcGauge "title =" 002-ArcGauge "/></p data-recalc-dims=

Mises à jour des composants existants

Mises à jour complètes du TreeList

Le composant TreeList est le composant parfait lorsque vous disposez de données qui ont toujours le même ensemble de champs, également appelés données homogènes. Souvent, les utilisateurs veulent afficher cela dans un ensemble de grilles hiérarchiques. L’élément de données possède un ensemble de colonnes qui s’affiche: bien sûr, partager une structure avec une grille signifie que de nombreuses fonctionnalités peuvent également être ajoutées à TreeList.

En-têtes de plusieurs colonnes

 003-treelist-multi-column-headers "title =" 003-treelist-multi-column-headers "style = "float: left;" /></p data-recalc-dims=

Souvent, nous voulons montrer que Les en-têtes d'une grille font partie d'une catégorie ou d'un groupe particulier, c'est-à-dire que les en-têtes à plusieurs colonnes entrent en jeu! Cela vous donne la possibilité de définir une colonne pouvant s'étendre sur plusieurs sous-colonnes.

Pagination côté client

 005-édition par lots de treelist "title =" 005-édition par lots de treelist "style =" float: left; "/></p data-recalc-dims=

Cette fonctionnalité est destinée à aider avec les grands ensembles de données dans le TreeList. Il est actuellement spécifiquement pour le côté client, ce qui signifie que toutes les données ont été chargées sur le client, mais cela

Édition par lots / InCell

 Édition par lots de treelist 005 "title =" Édition par lots de treillis 005 "style =" float: left; "/></p data-recalc-dims=

Comme le nom l'indique dans la cellule (ou «batch» comme on l'appelle également), les utilisateurs finaux peuvent éditer des cellules individuelles plutôt que de placer une ligne entière en mode édition. Les mises à jour, les ajouts ou les éléments supprimés peuvent ensuite être synchronisés sur une seule demande renvoyée sur le serveur.

Navigation du clavier

Le nom l'indique, mais nous avons officiellement ajouté la prise en charge complète de la navigation au clavier. Composant TreeList.

Mises à jour des composants de grille et améliorations de l'interface utilisateur conversationnelle

La grille est le composant le plus utilisé dans toutes nos bibliothèques, en particulier dans l'interface utilisateur Telerik pour ASP.NET MVC et Telerik UI pour ASP.NET Core. voulez vous assurer que je mentionne les fonctionnalités que nous avons ajoutées ici aussi.

Résumés de groupes maintenant disponibles dans l'en-tête de groupe

 006-grid-group-header-summaries "title =" "style =" float: left; "/></p data-recalc-dims=

Bien que les données des résumés de groupes soient disponibles dans l'en-tête d'un groupe (l'élément sur lequel vous cliquez pour développer ou réduire vos groupes), il n'est pas automatiquement aligné avec des colonnes comme dans le pied de page Avec R3 2018, nous avons ajouté le même style de résumés à l’en-tête de vos groupes que vous avez appréciés dans le pied de page d’un groupe. Aucun modèle personnalisé ni CSS requis, juste une option de configuration définie sur une définition de colonne.

Mises à jour des comportements réactifs

 007-grid-responsive-comportements "title =" 007-grid-responsive-comportements "style =" float : left; "data-method =" ResizeFitToAreaArguments "data-customsizemethodproperties =" {"MaxWidth": "", "MaxHeight": "425", "ScaleUp": false, "Qualité": "Élevé"} "/> [19659041] Alors que nous continuons à examiner comment nous pouvons améliorer notre support pour les applications Web progressives, nous voulions ajouter des fonctionnalités supplémentaires à la grille, en particulier une fonctionnalité que nous avons appréciée dans notre grille angulaire: <code data-recalc-dims= media propriété disponible pour chaque colonne.Il utilise l'API matchMedia string API afin de définir quelles colonnes sont affichées ou masquées en fonction de la fenêtre d'affichage. Mettre à jour la largeur de la colonne par programmation

Jusqu'à présent, une fois la largeur de la colonne définie, un nouveau rendu de la grille était nécessaire. date toute largeur d'une colonne. Grâce au nouvel appel API que nous avons ajouté avec R3 2018, vous pouvez maintenant définir la largeur de toute colonne de la grille par programmation et la mettre à jour en conséquence.

Mises à jour de l'interface utilisateur conversationnelle

 008-conversational-ui title = "008-conversation-ui-toolbar" style = "float: left;" data-method = "ResizeFitToAreaArguments" data-customsizemethodproperties = "{" MaxWidth ":" "," MaxHeight ":" 450 "," ScaleUp " : false, "Quality": "High"} "/><p data-line= Le composant Conversation UI a été introduit dans la dernière version et nous avons reçu de très bons retours jusqu'à présent! Un élément que nous avons vu demandé et qui est souvent la fonctionnalité de la barre d’outils est utilisée dans certaines de nos bibliothèques d’interface utilisateur, ce qui permet aux utilisateurs d’interagir avec votre chat, notamment en ajoutant des images et des enregistrements vocaux. modèle pour, de sorte que vous pouvez personnaliser encore plus pour répondre à vos besoins

MVC & Core

Je suis ravi de dire que l'attente est enfin terminée: le nouveau thème matériel basé sur Sass a été lancé pour Telerik UI pour ASP.NET MVC et Telerik UI pour ASP.NET Core!

 011- jquery-material "title =" 011-jquery-material "style =" float: left; "/></p data-recalc-dims=

Support officiel pour Core 2.1

Ceci est spécifique à ASP.NET Core, mais Telerik UI pour ASP.NET Core prend officiellement en charge ASP.NET Core 2.1 Cela signifie que nous disposons non seulement de tous les Tag Helpers, mais que nous prenons également en charge les plus récents et les plus performants du framework. Un élément important de cette prise en charge est que nous intégrons désormais SignalR pour ASP.NET Core.

Nous voulons avoir de vos nouvelles!

Bon nombre de ces fonctionnalités n'ont peut-être pas été ajoutées fait que nous entendons de nos développeurs. Donc, si vous sentez que nous avons manqué de nouveaux composants ou des fonctionnalités, faites entendre votre voix! Ajoutez un commentaire dans la section commentaire ci-dessous ou envoyez vos commentaires à notre portail de commentaires .

Vous voulez voir les mises à jour en action?

Dernière chose, je vous le promets. Cet article de blog a peut-être été très compliqué et si vous préférez que les choses soient couvertes en direct, j'ai de bonnes nouvelles! Dans le cadre de la publication du R3 2018, nous avons le webinaire LIVE Telerik qui aura lieu le 2 octobre à 11 h HE! Joignez-vous aux développeurs Ed Chabeneau et Sam Basu pour un webinaire en direct où nous passerons en revue les changements introduits avec la R3 2018. Les places sont limitées, alors assurez-vous de réserver la vôtre dès que possible!

Save My Seat


Les commentaires sont désactivés en mode aperçu.




Source link