La version R1 2022 de Kendo UI pour Angular est arrivée, apportant cinq nouveaux composants d'interface utilisateur angulaire et 23 nouvelles fonctionnalités dans nos composants angulaires existants !
La version R1 2022 de Kendo UI pour Angular est arrivée et prête à démarrer 2022 en fanfare ! Cette version comprend de nouveaux composants, plusieurs mises à jour de composants existants, la prise en charge d'Angular 13, de nouveaux kits d'interface utilisateur Figma et bien plus encore. Sans plus tarder, passons à l'action !
Prise en charge d'Angular 13
Avec R1 2022, nous avons introduit des composants Figma pour tous les composants de l'interface utilisateur Telerik et Kendo (les graphiques étant la seule exception). Avec cette dernière mise à jour, les concepteurs devraient disposer d'encore plus d'éléments à utiliser dans leurs conceptions. Options de thème "/>
Dans le cadre d'un effort continu visant à rendre l'interface utilisateur de Kendo pour Angular et ses thèmes plus flexibles et à aider nos utilisateurs à inclure plus de conceptions et à répondre aux exigences UX, nous revoyons tous les composants de l'interface utilisateur de Kendo à travers le défaut, Thèmes Bootstrap et Material Plus précisément, nous travaillons à l'introduction d'options communes qui peuvent être définies au niveau des composants et qui peuvent aider à définir les couleurs du thème principal, la taille et la forme des composants individuels, etc.
Avec R1 2022, nous avons mis à jour les ButtonsInputsDateInputs et DropDowns pour offrir les options de rendu de thème suivantes :
- theme90[196] fillMode
- taille[19659015]forme
- arrondie
Une note à faire ici est que ces mises à jour incluront des changements de rupture à l'aspect visuel de l'interface utilisateur de Kendo pour Angular. Pour toute personne personnalisant nos composants ou effectuant des tests de régression visuelle, nous recommandons de prendre un peu plus de temps pour examiner ces modifications.
Des mises à jour visuelles plus importantes comme celles-ci peuvent avoir des implications sous la forme de régressions visuelles qui peuvent apparaître lors de la mise à niveau d'une ancienne version vers R1. 2022. Bien que nous pensions avoir détecté et résolu de nombreux problèmes de régression visuelle lors de la préparation de la R1 2022, il se peut que d'autres problèmes soient découverts après la publication. Nous nous engageons fermement à résoudre ces problèmes le plus rapidement possible et continuerons à publier des mises à jour avec des correctifs pour nos thèmes et composants après la sortie de R1 2022.
Pour fournir plus d'informations sur ces changements et notre plan général autour de l'interface utilisateur de Kendo thèmes, nous avons récemment publié Améliorations à venir pour les thèmes d'interface utilisateur Telerik et Kendo en 2022.
Nouveaux composants angulaires
Nouveau composant : code à barres angulaire
Nouveau composant : code QR angulaire
Avec cette dernière mise à jour, Kendo UI for Angular a ajouté le nouveau composant Filter à la liste sans cesse croissante des composants de l'interface utilisateur pour Angulaire. Le composant Filtre angulaire permet aux utilisateurs de créer des expressions de filtre plus complexes à l'aide d'une interface utilisateur intuitive. Les expressions de filtre peuvent être liées à n'importe quelle collection de données existante dans votre application Angular et peuvent être connectées à des composants d'interface utilisateur liés aux données existants, tels que l'interface utilisateur Kendo pour la grille de données angulaire. Filtrez le composant ici.
Nouveau composant : Angular Popover
Vérifiez o ut les nouvelles couleurs par défaut dans l'interface utilisateur de Kendo pour les graphiques angulaires ici.
Graphique angulaire : panoramique et zoom améliorés
![Kendo UI for Angular Grid - Live Updating Data" title="Kendo UI for Angular Grid - Live Updating Data"/></p>
<p>Bien que cette fonctionnalité ait été possible dans l'interface utilisateur de Kendo pour Angular depuis un certain temps, avec cette mise à jour, nous avons ajouté une documentation spécifique et des ressources utiles sur la façon de lier des données en direct et mises à jour directement à l'interface utilisateur de Kendo pour Angular Data Grid.Comme le montre la démonstration fournie, des cellules individuelles dans la grille de données angulaire peuvent être mis à jour sans restituer l'intégralité du composant, ce qui permet au composant de maintenir des performances extrêmement rapides lorsque les données sont mises à jour sous le capot. Il s'agit d'une fonctionnalité très populaire pour tout composant de grille de données, nous voulions donc nous assurer que les développeurs disposaient d'articles et des informations faciles d'accès pour s'inspirer. Selection" title="Kendo UI for Angular – Gantt Selection"/></p>
<p>Avec R1 2022, le composant Angular Gantt sort officiellement de la phase bêta et entre en RTM. Cela s'accompagne de toute une série de nouvelles fonctionnalités, notamment la possibilité de sélectionner des lignes et des tâches dans le composant Gantt. Kendo UI for Angular – Gantt Editing" title="Kendo UI for Angular – Gantt Editing"/></p>
<p>Une autre fonctionnalité importante et intéressante ajoutée à l'interface utilisateur de Kendo pour Angular Gantt est la possibilité de modifier des éléments dans le Gantt. cette version, les utilisateurs peuvent modifier des éléments via plusieurs interactions différentes.</p>
<p>La première consiste à modifier directement dans la partie TreeList du composant d'interface utilisateur (ce qui est affiché sur le côté gauche) en interagissant avec des cellules individuelles et en mettant à jour leur valeur, également connue sous le nom d'édition dans la cellule.</p>
<p>La deuxième approche consiste à configurer le composant Angular Gantt pour utiliser une fenêtre de dialogue intégrée pour gérer l'édition.Celle-ci peut être ouverte en interagissant avec les tâches sur la droite- côté droit du composant Gantt.[19659005]Découvrez la <a href=](https://i0.wp.com/d585tldpucybw.cloudfront.net/sfimages/default-source/component-pages/angular/datagrid/grid_live-data-sample-770x.gif?w=660&ssl=1)
Gantt angulaire : création de dépendances
Éditeur angulaire : obtenir le texte sélectionné [19659077]Kendo UI for Angular – Get Selected Text" title="Kendo UI for Angular – Get Selected Text"/>
Lancement d'un grand nombre de nouvelles fonctionnalités de l'éditeur à venir dans notre suite de composants d'interface utilisateur angulaire, avec R1 2022, nous avons a ajouté une nouvelle propriété pour aider à extraire le texte actuellement sélectionné dans la zone de contenu de l'éditeur. Ce nouveau champ, selectionTextpeut être utilisé pour extraire le texte sélectionné et l'utiliser pour mettre à jour d'autres composants angulaires ou modifier et stocker ailleurs.
Suivez ce lien pour découvrir le nouveau Angular Editor Get Démo de texte sélectionné.
Éditeur angulaire : Sélectionner tout et outils d'impression
![Interface utilisateur de Kendo pour l'éditeur angulaire - Imprimer" title="Interface utilisateur de Kendo pour l'éditeur angulaire - Imprimer"/></p>
<p>La prochaine fonctionnalité ajoutée à l'interface utilisateur de Kendo pour Angular Editor avec R1 2022 est le nouvel outil Sélectionner tout et Imprimer. </p>
<p> L'outil Sélectionner tout permet aux utilisateurs de sélectionner tout le contenu dans l'éditeur à l'aide d'un bouton dans la barre d'outils. </p>
<p> Quant à l'outil Imprimer, cela permet aux utilisateurs d'envoyer le contenu de l'éditeur angulaire à une imprimante à l'aide de la boîte de dialogue d'impression intégrée du navigateur. Auparavant, cela nécessitait que les développeurs écrivent leur propre logique d'impression, nous sommes donc très heureux d'offrir cette fonctionnalité en un seul clic.[19659005]Voir tous les <a href=](https://i0.wp.com/d585tldpucybw.cloudfront.net/sfimages/default-source/component-pages/angular/editor/editor-print.png?w=660&ssl=1)
Éditeur angulaire : redimensionnement d'image
Angular Editor : Table Split & Merge Cells
Angular Éditeur : Appliquer des commandes aux mots une amélioration de la qualité de vie. Plus précisément, cette nouvelle fonctionnalité concerne l'application de commandes à des mots ou des blocs de texte dans l'Éditeur.
Pour donner un contexte à ce que cela signifie, voici un exemple : Avant R1 2022, lorsqu'un utilisateur cliquait n'importe où dans un seul mot dans la zone de contenu mais n'a sélectionné aucun texte (ce qui signifie que le curseur clignote entre deux caractères), puis a utilisé le bouton Gras de la barre d'outils ou un raccourci clavier, le résultat final serait que rien n'est arrivé au mot. "commande" pour mettre un mot en gras ne mettrait réellement en gras quelque chose que lorsqu'une sélection a été faite (surlignant plusieurs caractères). une nouvelle fonctionnalité entre en jeu !
Avec R1 2022, l'éditeur dispose d'un ensemble de nouvelles options de configuration permettant aux développeurs de décider quel comportement est idéal pour leurs utilisateurs. En prenant le même exemple que ci-dessus, avec les bonnes propriétés définies, l'éditeur angulaire mettra automatiquement en gras le mot entier dans lequel se trouve actuellement le curseur. documentation ici.
Planificateur angulaire : marqueur de l'heure actuelle
Angular Scheduler : sélection d'emplacement
La fonctionnalité DialogService de l'interface utilisateur Kendo pour le composant Angular Dialog est utilisée lorsque les développeurs doivent créer dynamiquement une instance de composant Dialog lors de l'utilisation d'un service Angular. Pour les personnes se trouvant dans cette situation, la version R1 2022 a ajouté la possibilité pour le composant Kendo UI for Angular Dialog d'avoir des attributs CSS et HTML personnalisés ajoutés au composant lorsqu'il est utilisé via un service Angular. via le service
Développant les fonctionnalités disponibles lors de l'ouverture d'un dialogue angulaire via un service, nous avons également ajouté la possibilité de définir que l'interface utilisateur de Kendo pour le dialogue angulaire doit être rendue droite à l gauche. Cela peut être fait via la propriété htmlAttributes en fournissant un champ dir défini sur rtl.
Pour plus d'informations, vous pouvez vous référer à le Interface utilisateur de Kendo pour les documents du service angulaire de dialogue angulaire & Attributs lors de l'ouverture via le service
Avec R1 2022, le composant Kendo UI for Angular Window a également ajouté les mêmes fonctionnalités lorsque vous travaillez via un service angulaire.Lorsque les gens doivent ajouter une classe CSS personnalisée ou un attribut HTML personnalisé à la fenêtre angulaire composant, ils peuvent utiliser les propriétés Voir l'interface utilisateur Kendo pour le composant de fenêtre angulaire Angular Démos de service pour plus d'informations. cssClass et htmlAttributes pour ce faire. utiliser un service angulaire est la capacité de rendre Utilisez le composant Window en mode RTL (de droite à gauche). Cela peut être fait via la propriété htmlAttributes en fournissant un champ dir défini sur rtl.Commutateur angulaire : taille personnalisée et étiquettes longues
Angular ColorPicker : nouveau design
Grille angulaire et Angular TreeView : pousser et épisser à partir de collections de clés ne met plus à jour l'état
Un commentaire que nous reçu plus tôt cette année a souligné que la façon dont nous fournissons des collections de clés telles que selectedKeysexpandedKeys et checkedKeys présentait des problèmes potentiels, car techniquement les collections peuvent être mutées dans leur forme actuelle. Avec R1 2022, nous avons décidé d'améliorer cela dans les composants Angular Grid et TreeView (deux gros composants qui traitent de la sélection).
Comme certaines personnes ont peut-être travaillé avec le comportement actuel des collections de clés, cela doit être considéré comme une rupture changer car, selon votre utilisation, de nouveaux messages d'erreur peuvent apparaître lorsque vous mettez à jour ces composants vers leur dernière version. Démos Treeview pour plus d'informations.
Vous avez des commentaires ?
Même si nous avons ajouté une tonne de composants et de fonctionnalités avec cette version, nous n'avons peut-être pas ajouté quelque chose que vous ou votre équipe recherchiez. C'est maintenant l'occasion pour vous de faire entendre votre voix ! Faites-nous savoir ce qui vous manque dans l'interface utilisateur de Kendo pour Angular en vous arrêtant sur le Kendo UI for Angular Feedback Portal. Dans ce portail, vous pouvez voter pour votre commentaire préféré ou soumettre le vôtre.
L'interface utilisateur de Kendo pour Angular est devenue ce qu'elle est aujourd'hui grâce aux commentaires continus de nos clients, et nous souhaitons continuer à fournir la meilleure bibliothèque possible pour vous et vos équipes. Alors, profitez-en pour nous faire part de vos commentaires !
Webinaires et diffusions en direct
Vous voulez voir tout ce que j'ai mentionné ci-dessus en direct et en action ? Le mardi 1er février à 11 h HEnous organisons le webinaire sur la version de Kendo UI R1 2022 ! Rejoignez-nous pour découvrir les nouveautés des composants de l'interface utilisateur Angular, jQuery, React et Vue !
Pour vous donner une chance d'avoir une plongée plus interactive dans le nouveau contenu, nous hébergerons également un flux Twitch couvrant l'interface utilisateur de Kendo pour Angular spécifiquement le jeudi 27 janvier à 10h00 HEet nous couvrons également KendoReact sur Twitch le mercredi 26 janvier à 10h00 HE.[19659005]Des tonnes de plaisir seront au rendez-vous, alors rendez-vous sur la page d'inscription au webinaire Kendo UI R1 2022 pour réserver votre place et participer aux festivités !
Source link