L’Outil Surpuissant pour Exploser ton Chiffre d'Affaires en 2024 !
Quoi de neuf dans KendoReact avec R1 2021
La version R1 2021 de KendoReact est arrivée et elle contient huit nouveaux composants d'interface utilisateur pour React ainsi qu'un vaste ensemble de nouvelles fonctionnalités pour les composants existants.
KendoReact apporte toujours le tonnerre en ce qui concerne les versions et la version R1 2021 d'aujourd'hui n'est pas différent! Nous avons des tonnes de nouveaux composants, fonctionnalités et même un support pour React 17 à annoncer aujourd'hui. Continuez à lire pour découvrir les nouveautés de KendoReact avec R1 2021.
React 17 Support
La version React 17 avait la fameuse déclaration «No New Features» dans son article de blog d'annonce mais cela n'était pas nécessairement le cas pour les créateurs de composants d'interface utilisateur comme l'équipe KendoReact. Néanmoins, le jour du lancement officiel, nous avons eu un support de jour zéro pour React 17 dans tous les composants de l'interface utilisateur de KendoReact. Bien que cela se soit produit en octobre 2020, il est certainement bon de répéter que vous pouvez mettre à niveau vers le dernier et le meilleur avec KendoReact.
Nouveaux composants React
Nouveau composant: TileLayout
Le nouveau composant KendoReact TileLayout est le composant idéal pour créer des tableaux de bord interactifs à l'aide d'un seul composant d'interface utilisateur avec un ensemble flexible d'options de configuration. Définissez simplement des mesures de type grille (lignes et colonnes) avec une collection de tuiles et de leurs dimensions et vous voilà parti pour la course.
Une fois la configuration terminée, les utilisateurs finaux peuvent profiter de la possibilité de faire glisser les différents indicateurs de performance clés qui s'affichent afin d'obtenir la mise en page souhaitée. Chaque indicateur, ou Tile, est entièrement personnalisable, ce qui signifie que vous pouvez créer des mises en page vraiment étonnantes et interactives avec ce nouveau composant React.
Rendez-vous dans la section de documentation et de démonstration de KendoReact TileLayout pour se
Nouveau composant: DropDownTree
L'un des composants de formulaire les plus demandés au cours des dernières versions a été un composant React UI qui combine le composant TreeView et un composant déroulant, qui a conduit au nouveau KendoReact DropDownTree.
Le composant React DropDownTree est parfait pour les formulaires qui doivent être concis et occuper le moins d'espace possible tout en offrant une structure de données avancée pour sélectionnez un élément dans. Lorsque les utilisateurs interagissent avec l'élément d'entrée simple, la liste déroulante s'ouvre pour révéler un TreeView intégré avec une structure hiérarchique. Les utilisateurs peuvent alors choisir un nœud et la valeur sélectionnée apparaîtra dans l'entrée du composant.
Pour voir comment vous pouvez tirer parti de ce composant déjà populaire, rendez-vous sur le KendoReact DropDownTree . [19659016] Nouveau composant: MultiColumnComboBox
En plus de la liste des menus déroulants populaires que nous avons ajoutés dans R1 2021, nous avons également le nouveau composant Reactox MultiComboBox de KendoReact. prend une liste déroulante et fournit une structure de tableau pour chaque élément. Les éléments sont toujours affichés sous forme de liste, mais chaque élément peut afficher plusieurs champs par ligne, ce qui donne cette apparence de table classique. Une fois qu'un utilisateur sélectionne un élément, une valeur unique être affiché dans l'entrée mais l'élément de données sous-jacent a bien sûr tous les champs disponibles pour le développeur.
Nouveau composant: FloatingActionButton
Trouvé dans de nombreuses applications Web et applications mobiles modernes, le nouveau composant React FloatingActionButton fournit un bouton permanent qui semble flotter au-dessus du contenu existant dans une zone prédéfinie de l'écran. Ce bouton a tendance à être responsable d'une seule action, souvent contextuelle au contenu de la page en cours, et a été repéré comme le bouton «composer» dans gmail et d'autres clients de messagerie.
L'aspect et la convivialité du composant peut être personnalisé grâce aux options de configuration disponibles pour vous assurer que le bouton principal correspond à votre conception globale. De plus, le KendoReact FloatingActionButton peut comporter un ensemble de boutons «numérotation abrégée» qui s'animeront à partir du bouton principal et fourniront plusieurs boutons d'action parmi lesquels sélectionner. Tout comme le bouton principal, l'aspect et la convivialité de tous ces boutons peuvent tous être modifiés pour assurer une apparence cohérente dans toutes vos applications.
Nouveau composant: BottomNavigation
Avec R1 2021, nous avons également introduit le nouveau composant KendoReact BottomNavigation – l'élément d'interface utilisateur de navigation idéal pour applications Web et mobiles réactives.
Le composant React BottomNavigation s'intègre facilement à n'importe quelle bibliothèque de routage. Ainsi, la navigation entre les vues est simple comme bonjour, et chaque élément de navigation du composant comporte une icône et une étiquette associée pour garantir que les utilisateurs contexte autour de ce que chaque navigation fournira.
Cela peut aller sans dire, mais ce composant est complètement réactif et répondra à tout changement de t La taille de la fenêtre.
Vous pouvez en savoir plus sur le composant KendoReact BottomNavigation dans nos documents et démos en ligne ici .
Nouveau composant: ListBox
Un autre composant très demandé est le nouveau React ListBox. Ce composant fournit une interface pour afficher une liste d'éléments dans une zone définie qui peut être parcourue. En outre, plusieurs ListBox peuvent être combinées afin de donner une expérience utilisateur qui permet aux utilisateurs de déplacer des éléments entre les listes. Lorsque vous traitez avec plusieurs ListBox, vous avez également la possibilité d'ajouter des boutons qui s'affichent entre les cases pour aider à gérer le déplacement d'un ou de plusieurs éléments entre les différentes instances de ListBox.
Pour en savoir plus sur le composant React ListBox, vous pouvez reportez-vous à la documentation et les démos de KendoReact ListBox .
Nouveau composant: Icon & SvgIcon
Pour arrondir notre liste de nouveaux composants, avec R1 2021, nous introduisons également les composants React Icon et React SVGIcon. Les noms le donnent en quelque sorte, mais ces composants d'interface utilisateur sont tous deux responsables de l'affichage des icônes dans votre application React. La grande différence entre les deux est que le composant Icône KendoReact affiche les icônes sous forme d'icônes de police, tandis que SVGIcon restitue toutes ses icônes sous forme d'éléments SVG.
Lorsque vous ajoutez ces composants UI React à votre application, vous avez accès à plus de 400 icônes intégrées de KendoReact donc il y a de fortes chances que vous trouviez l'icône parfaite à utiliser pour n'importe quel scénario.
Pour voir plus de ces icônes en action, vous pouvez trouver la documentation pour l'icône KendoReact ici et le documentation pour le SVGIcon KendoReact ici .
Fonctionnalités des composants étendus
Grille – Navigation au clavier intégrée
Alors que KendoReact Grid prend en charge la navigation au clavier depuis longtemps, nous avons laissé les développeurs déterminer exactement comment gérer ladite navigation. Ainsi, à titre d'exemple, plutôt que de supposer quels raccourcis clavier ou quelles exigences d'interaction vous pourriez avoir, nous avons laissé au développeur le soin de déterminer exactement ce qui se passe lorsque vous appuyez sur la touche de tabulation dans la grille de données de réaction.
Bien que cela donne un beaucoup de flexibilité, cela vient également avec une complexité supplémentaire puisque maintenant les développeurs doivent réfléchir à la façon dont la navigation au clavier devrait fonctionner pour eux et également écrire le code pour correspondre à ces règles. Afin de rendre cela plus facile pour tous les développeurs, avec R1 2021, nous avons ajouté des moyens intégrés et avisés pour gérer la navigation au clavier dans la grille de données KendoReact pour aider à réduire cette complexité. Cela permet aux développeurs qui veulent juste que la navigation au clavier soit prise en charge dès la sortie de la boîte d'utiliser un simple ensemble d'options de configuration au lieu de passer du temps à comprendre comment écrire du code pour chaque type d'interaction.
Pour en savoir plus sur cette navigation améliorée au clavier dans la grille de données KendoReact, rendez-vous dans cette section de documentation de la grille KendoReact .
Grille – Performances améliorées dans la gestion des états pour les cellules de données
Tout le monde aime les améliorations de performances, non? Eh bien, avec R1 2021, nous avons examiné comment nous pourrions améliorer les performances de la grille KendoReact et avons découvert que nous pouvions améliorer la gestion de l'état au niveau de la cellule.
Comme vous pouvez l'imaginer, les cellules Grid
TreeList – Navigation au clavier intégrée
Semblable à l'amélioration de Grid mentionnant la navigation au clavier, avec R1 2021, le composant KendoReact TreeList a fait un pas vers la simplification de la navigation au clavier pour les développeurs. contrôlez exactement la façon dont la navigation au clavier est gérée, vous pouvez maintenant également activer une navigation au clavier au niveau de base qui gère les interactions pour vous grâce à quelques options de configuration.
Rendez-vous sur cette démo de navigation au clavier de KendoReact TreeList pour en savoir plus .
Gantt: Navigation au clavier intégrée
Poursuivant l'histoire de la navigation au clavier dans nos composants React UI, KendoReact Gantt a également ajouté une navigation au clavier intégrée avec R1 2021. Ceci est très utile pour s'assurer que le Gantt peut passer les examens de conformité d'accessibilité et faire il est très facile d'ajouter la navigation au clavier. Pour les développeurs qui ont besoin d'un peu de contrôle supplémentaire, ils peuvent bien sûr prendre le relais pour s'adapter à toutes les exigences de navigation au clavier.
Gantt: édition
Une autre mise à jour de React Gantt que nous avons réussi à ajouter avec cette version est la fonctionnalité d'édition intégrée qui peut aider les utilisateurs finaux à modifier et mettre à jour les tâches trouvées dans le Gantt. Cela éloigne le composant KendoReact Gantt d'un simple composant en lecture seule et ajoute une fonctionnalité importante que de nombreux utilisateurs de Gantt recherchent. [19659008] Vous pouvez voir la fonction d'édition de Gantt de KendoReact dans cette démo en ligne .
Editor: Amélioration de la navigation au clavier
Le tour d'horizon des améliorations de la navigation au clavier pour R1 2021 se poursuit, l'éditeur KendoReact ayant également ajouté une option intégrée pour la navigation au clavier qui évite d'avoir à définir vos propres opérations au clavier avec le composant Editor. Tout comme pour les autres composants auxquels nous avons ajouté cette fonctionnalité, l'activation de la navigation au clavier de cette manière rend l'atteinte des objectifs d'accessibilité aussi simple que possible.
Avatar – Nouvelles options et conception mise à jour
Avec la R1 2021, le composant KendoReact Avatar a reçu plusieurs mises à jour de sa conception ainsi que des options de configuration supplémentaires pour aider à contrôler l'aspect général du composant . Sans entrer dans les détails, cette mise à jour offre aux développeurs React encore plus de flexibilité en ce qui concerne la personnalisation de l'apparence du composant React Avatar.
Pour en savoir plus sur l'avatar KendoReact, vous pouvez consulter nos démos en ligne !
Scheduler – Formulaire personnalisé et éditeur de formulaire
L'édition existe dans le planificateur KendoReact depuis un certain temps, mais le formulaire responsable de l'édition de tout événement a toujours été un formulaire par défaut qui ne pouvait pas être personnalisé – mais cela a officiellement changé avec R1 2021. Avec la nouvelle fonctionnalité Formulaire personnalisé et Éditeur de formulaire, un développeur React peut transmettre un composant personnalisé pour être responsable de l'édition du planificateur. Cela donne encore une autre façon d'adapter le planificateur à toutes les exigences de conception.
Pour voir comment vous pouvez créer vos propres Formulaires personnalisés avec le planificateur KendoReact, vous pouvez vous référer à cette démo .
Scheduler – Marqueur d'heure actuelle
Une autre mise à jour du composant KendoReact Scheduler qui a atterri dans R1 2021 est l'heure actuelle Marqueur. Cette fonctionnalité est subtile au début, mais elle fournit un indicateur qui est constamment affiché dans l'interface du calendrier et indique votre heure actuelle à travers les événements affichés. Cette fonctionnalité permet aux utilisateurs finaux de savoir plus facilement quels événements ils ont programmés comme
Pour voir la fonction React Scheduler Current Time Marker en action, rendez-vous sur cet article de documentation et de démonstration . [19659075] Nous voulons vos commentaires!
Tous les composants et fonctionnalités de l'interface utilisateur ci-dessus ont été ajoutés grâce aux commentaires des utilisateurs de KendoReact, c'est pourquoi j'aime toujours demander: qu'est-ce que nous avons manqué avec cette version? Existe-t-il un composant ou une fonctionnalité d'interface utilisateur dont vous avez besoin pour vos applications React que nous n'avons pas encore ajouté? Nous voulons de vos nouvelles! N'hésitez pas à fournir un commentaire dans la section des commentaires ci-dessous, ou à ajouter votre demande spécifique dans notre Portail de commentaires KendoReact .
Inscrivez-vous à notre webinaire en direct R1 2021
Vous souhaitez voir ces nouveaux composants et fonctionnalités être ajouté à notre célèbre application ACME React? Curieux d'obtenir plus d'informations sur cette version et d'autres activités React que nous sommes en train de préparer? Ou voulez-vous juste prendre le temps de me poser des questions à moi-même et au reste de l'équipe KendoReact? Eh bien, rejoignez-nous pour le webinaire sur la version 2021 de Kendo UI R1 2021 le jeudi 28 janvier à partir de 11h00 HE . Pour plus de détails, rendez-vous sur notre page d'inscription au webinaire . Les places sont limitées, alors n’oubliez pas de prendre votre place aujourd'hui!
Source link