Quoi de neuf dans l'interface utilisateur Telerik pour Blazor avec R1 2022

L'interface utilisateur Telerik pour Blazor R1 2022 apporte plus de 90 composants natifs : Map, FileSelect, Dialog, Heatmap, QR Code, ColorPicker, REPL code runner, options de thème et plus encore !

Hé, les développeurs ! C'est l'heure de sortie de Telerik R1 2022 et nous sommes ravis de commencer 2022 avec l'introduction de plusieurs nouveaux composants d'interface utilisateur tels que Map, FileSelect et ColorPicker; plus de fonctionnalités Data Grid, TabStrip et Editor ; améliorations de thème et de style ; Coureur de code REPL ; Prise en charge de .NET 6 et Visual Studio 2022 ; Mises à jour de l'extension Visual Studio Code ; et plus! La suite de composants de l'interface utilisateur Telerik pour Blazor continue de s'étendre et a atteint une nouvelle étape de plus de 90 composants véritablement natifs ! contenu de la version expédié entre octobre 2021 et janvier 2022 (comprend l'interface utilisateur Telerik pour Blazor 2.28, 2.29, 2.30 et les versions 3.0.0 actuelles) : Gradient, Flat Color Picker, Dialog, File Select

Plongez dans Version 3.0.0 de l'interface utilisateur pour Blazor

Examinons de plus près le contenu actuel de la version 3.0.0, puis passons en revue les nouveaux composants et fonctionnalités de l'interface utilisateur Telerik pour les versions Blazor 2.30, 2.29 et 2.28 expédiées en octobre, novembre et décembre. 2021 dans le cadre de la version R1 2022.

Nouveau composant d'interface utilisateur Blazor Map

Aperçu

Nous sommes heureux d'annoncer la première version du Telerik UI for Blazor Map component ! La carte vous permet d'afficher des informations géographiques organisées en couches et peut être intégrée à des fournisseurs de cartes ouvertes dans vos applications Blazor. Le composant comprend des couches de tuiles, de bulles, de formes et de marqueurs, ainsi que la prise en charge du format de données GeoJSON. Il est compatible avec un large éventail de fournisseurs de cartes de tuiles, vous permettant d'intégrer facilement des fonctionnalités avancées de localisation et de mobilité dans vos cartes, une prise en charge tactile, plusieurs options de personnalisation et plus encore ! for Blazor Map Component" style="vertical-align: middle;"/>

Couches de carte

Selon les différents fournisseurs de cartes et cas d'utilisation, vous pouvez tirer parti des couches suivantes :

• Tile – Rend les éléments et peut être lié aux fournisseurs OpenStreetMap et Azure Maps
• Bubble – Une couche vectorielle qui affiche des bulles sur une autre couche pour marquer les régions
• Shape – Liaison aux Données GeoJSON
• Marqueur – Utilisé pour afficher des marqueurs sur la carte et une info-bulle lorsque le marqueur est survolé.

Voir les démos de la mise en œuvre de la couche de bulles du composant Carte.

Options de configuration de la carte

La carte pour Blazor comprend plusieurs options de configuration liées à la carte elle-même, les commandes de la carte (zoom , attribution, navigateur) et ses tuiles (type, taille, zoom min & max, propriétés de remplissage de styles multiples, forme de marqueur et plus).

Événements de carte

Avec la version initiale du composant Carte, plusieurs événements sont exposés qui vous permettent de définir la logique lorsqu'un marqueur, une forme ou la carte est cliqué : OnMarkerClick, OnShapeClick et OnClick.

Nouveau composant d'interface utilisateur Blazor FileSelect

Présentation

Le UI pour le composant Blazor FileSelect permet aux utilisateurs de sélectionner un ou plusieurs fichiers dans leurs systèmes de fichiers locaux et de les stocker sur un serveur. Le composant est particulièrement pratique lorsque vous souhaitez un contrôle complet sur la gestion des fichiers sélectionnés et la manière dont ils sont téléchargés. Il dispose d'une prise en charge et d'une accessibilité intégrées de la navigation au clavier, tout comme le reste des composants de l'interface utilisateur Blazor du portefeuille Telerik. align: middle;"/>

Désactivation de FileSelect

Dans les cas où vous devez empêcher les utilisateurs de sélectionner des fichiers, FileSelect peut être désactivé avec une seule option de configuration.

Validation FileSelect

Le composant vous permet de définir des règles concernant la taille de fichier minimale et maximale acceptée, les types de fichiers et extensions.

Voir la démo de validation du composant Blazor FileSelect.

Événements FileSelect

Le composant File Select expose les événements OnSelect et OnRemovedonnant un contrôle par programmation sur les fichiers sélectionnés et supprimés :

• OnSelect – déclenché lorsqu'un ou plusieurs fichiers ont été sélectionnés via le bouton Sélectionner les fichiers
• OnRemove – déclenché lorsqu'un fichier a été supprimé de la liste des fichiers sélectionnés (en cliquant sur l'icône X ou en appuyant sur la touche Suppr)

Améliorations du thème

En fonction de vos commentaires liés aux personnalisations de thèmes et aux tendances du langage de conception, nous allons aborder divers aspects de nos thèmes dans un effort continu pour rendre les thèmes de l'interface utilisateur de Kendo plus flexibles, extensibles et personnalisables pour aider nos utilisateurs à couvrir davantage d'exigences en matière de conception et d'expérience utilisateur. (Remarque : l'ensemble de thèmes communs de Kendo UI peut être partagé entre tous les produits Telerik et Kendo UI : UI pour Blazor, ASP.NET Core et MVC, ainsi que Kendo UI pour jQuery, React, Vue et Angular).

Nous ont revisité tous les composants de l'interface utilisateur Telerik à travers les thèmes par défaut, Bootstrap et Material et ont introduit des options communes qui peuvent être définies au niveau des composants qui peuvent aider à définir les couleurs du thème principal, la taille et la forme des composants individuels, et plus encore.

Avec R1 2022, nous avons mis à jour les catégories de composants Button, Input, DateInput et DropDown pour offrir les options de rendu de thème suivantes :

• ThemeColor
• Size
• Shape[19659006]Arrondi
• FillMode

Ces les options ont été déployées avec la version v5 des thèmes basés sur Kendo UI Sass, qui est la dernière version des packages de thèmes à ce jour.Ces mises à jour contiennent des modifications importantes pour toute personne ayant personnalisé l'interface utilisateur Telerik pour les composants Blazornous vous recommandons donc fortement d'ajouter un peu de temps pour traiter les changements cassants dans le cadre de tout processus de mise à jour que vous avez peut-être planifié. Option de thème" style= "vertical-align : milieu ;"/>

Des composants supplémentaires seront abordés avec les futures versions en 2022. Voici une feuille de route approximative des composants qui seront couverts par la suite : AppBar, BottomNavigation, Badge, Notification, Tooltip, Loader, Toolbar, Window, Dialog, TabStrip, PanelBar, ExpansionPanel, Upload, Editor, Scheduler et plus ! certains composants seront ciblés. Pour fournir plus d'informations sur ces changements et notre plan général autour des thèmes de l'interface utilisateur de Kendo, nous avons récemment publié un article de blog sur l'avenir des thèmes dans Telerik et Kendo UI.

Telerik & Kendo UI Kits for Figma v1.7

Nous avons officiellement présenté les Kits d'interface utilisateur Telerik et Kendo pour Figma il y a quelques mois dans le but d'aider à améliorer la collaboration entre les concepteurs et les développeurs utilisant les composants d'interface utilisateur Telerik et Kendo. Nous avons élargi l'ensemble initial de composants d'interface utilisateur, et je suis heureux de partager qu'avec R1 2022, nous avons introduit des actifs Figma pour tous les composants d'interface utilisateur Telerik et Kendo à une seule exception : les graphiques.

Présentation des paramètres de popup dans tous les composants sélectionnés

Vous pouvez désormais facilement personnaliser les popups dans une seule balise dédiée pour Telerik sélectionnez les composants : Liste déroulante, Combobox, Autocomplete et MultiSelect. Les paramètres contextuels vous permettent de configurer les dimensions minimales et maximales ainsi que les paramètres de largeur, de hauteur et de classe déjà existants.

Inclure toutes les pages dans l'exportation Excel avec OnRead

La demande de portail de commentaires a été implémentée en tant que fonctionnalité dans les composants Data Grid et TreeList. iframe.

Découvrez comment insérer une vidéo dans le composant Telerik Blazor Editor.

Nouvelles méthodes dans le composant de téléchargement

Avec cette version, nous avons exposé de nouvelles méthodes dans l'API du composant de téléchargement pour déclencher le téléchargement, la boîte de dialogue de sélection de fichier et le possibilité d'effacer les fichiers téléchargés avec succès.

Nouvelles fonctionnalités du traitement de documents Telerik

Dans la version R1 2022, nous avons quelque chose de nouveau pour ceux d'entre vous qui utilisent Traitement de documents Telerik dans les applications Blazor ! Dans le dernier package de distribution, vous trouverez plusieurs des éléments les plus recherchés de notre portail de commentaires, tels que :

• Mise en forme conditionnelle pour le traitement de propagation : Permet d'ajouter des règles utilisées lors de la visualisation des cellules et applique une mise en forme en fonction de leurs valeurs.
• Notes pour RadSpreadProcessing : L'utilisateur pourra ajouter et exporter des notes avec un auteur spécifique.
• Imbrication MailMerge for WordsProcessing : Chaque champ de fusion peut contenir une liste d'éléments qui doivent être affichés dans le document fusionné.

Changements de rupture dans la version 3.0.0

Alors que nous visons à garantir des versions sans perturbation pendant plus de deux ans, à mesure que le produit et le cadre évoluaient, nous avons introduit plusieurs changements de rupture dans la version 3.0.0 actuelle garantissant des améliorations dans l'API, le rendu et la thématisation et certains liés à l'unification de la dénomination des paramètres. dans la version 3.0.0 et en ajoutant du temps pour les traiter dans le cadre de tout processus de mise à jour que vous avez peut-être prévu. goodies de la version Telerik UI pour Blazor 3.0.0, passons en revue le reste des éléments qui font partie de R1 2022 et ont été expédiés plus tôt. ] a été lancé en octobre et représente un environnement en ligne interactif qui lit, compile et exécute immédiatement votre code Blazor dans le navigateur. L'environnement prêt à l'emploi ne nécessite aucune installation, compte ou outil spécial – il suffit de se lancer et de commencer à coder. Les fonctionnalités supplémentaires incluent :

• Enregistrement de vos extraits de code Blazor
• Partage d'exemples avec une URL simple
• Intégration dans des articles de blog ou des articles avec un iframe interactif
• Partage depuis votre IDE à l'aide de notre Visual Extension Studio et Extension Visual Studio Code
• Installation de vos packages NuGet préférés
• Référence aux fichiers statiques
• Accès transparent à l'interface utilisateur Telerik pour Blazor avec plus de personnaliser les composants de l'interface utilisateur

Telerik REPL pour Blazor s'intègre toujours à la dernière version de l'interface utilisateur Telerik pour Blazor, de sorte que tout extrait créé avant la version 3.0.0 actuelle qui utilise les composants Telerik peut nécessiter une mise à jour en raison des changements de rupture dans the release.

Nouveau composant d'interface utilisateur Blazor Dialog [19659004]Nous avons ajouté un T autonome Composant d'interface utilisateur elerik Blazor Dialog afin que vous disposiez d'une solution prête à l'emploi pour créer des fenêtres contextuelles d'interface utilisateur. Le composant est pratique pour afficher des informations aux utilisateurs et fournit plusieurs options de personnalisation telles que la largeur, la hauteur, le titre, la visibilité, les modèles de bouton de contenu et d'action, la fermeture en cas de clic en superposition, etc.

Nouveau composant d'interface utilisateur Blazor Heatmap Chart

Le Heatmap Chart UI Le composant  vous permet de visualiser des données bidimensionnelles dans une multitude de couleurs. Certaines des fonctionnalités du nouveau composant Heatmap incluent : la visualisation des valeurs de données sous différentes formes ; diverses échelles de couleurs ; des info-bulles qui vous permettent d'afficher des informations supplémentaires ; la construction -in et thèmes et échantillons personnalisés.

Nouvelle interface utilisateur Blazor QR Code Composant

Le nouveau Telerik UI for Blazor QR Code component  est une étiquette lisible par machine qui contient des données pour un localisateur, un identifiant ou un tracker, dirigeant les utilisateurs vers un site Web ou une application lorsqu'ils sont scannés avec n'importe quel appareil intelligent. Vous pouvez encoder plusieurs formats de données tels que les URL, les numéros de téléphone, les adresses e-mail, les informations de contact et les géolocalisations. Le QR Code peut être personnalisé de différentes manières : en y affichant vos propres logos et images personnalisés, en configurant sa taille, sa largeur, son rembourrage, ses bordures, ses niveaux de correction d'erreur, ses couleurs et les paramètres de superposition du QR Code. Le composant prend également en charge la génération de code QR suisse.

Nouveau sélecteur de couleurs Blazor Composants de l'interface utilisateur

En plus du composant ColorPalettenous avons introduit trois nouvelles variantes garantissant une référence simplifiée pour différents scénarios. Vous pouvez brancher le composant ColorGradient au cas où vous auriez besoin d'afficher uniquement un vue dégradée, et pour des scénarios plus avancés, vous pouvez utiliser le FlatColorPicker ou le ColorPicker avec une fenêtre contextuelle.

Améliorations des composants DataGrid et TreeList

• Validation améliorée – deux fonctionnalités supplémentaires : désactiver la validation intégrée et exposer l'option aux développeurs de construire un personnalisé
• Enh anced Editing – UX d'édition améliorée dans les scénarios de virtualisation des données
• Adapter la largeur de colonne au contenu – trois nouvelles méthodes qui vous permettent de redimensionner la largeur de colonne pour s'adapter au contenu
• Améliorations de SearchBox – le l'entrée de la zone de recherche et les critères de filtre peuvent désormais être facilement effacés en utilisant l'icône X dans la zone, la touche Échap ou par programmation
• Déclencher OnEdit, OnUpdate, OnCancel sur chaque cellule dans Incell EditMode – vous pouvez décidez vous-même si vous souhaitez mettre à jour le modèle de manière conditionnelle ou pour chaque champ
• Options d'exportation de la grille vers Excel – définissez les éléments de données ou les colonnes à inclure dans le fichier exporté (via l'événement OnBeforeExcelExport), contrôlez la largeur des colonnes exportées, ont une prise en charge transparente pour l'exportation des valeurs d'énumération et déclenchent l'exportation Excel et CSV par programme descriptions des parties de format pour plusieurs composants DateInputs. Les espaces réservés de format sont pris en charge pour DateTimePickerDatePickerTimePickerDateRangePicker et DateInputDateInputDateInput

  

  Améliorations des composants de l'interface utilisateur TabStrip

  Le TabStrip expose désormais deux nouveaux paramètres : PersistTabContentqui détermine si le contenu des onglets est conservé lors du changement d'onglet, et Visiblequi vous permet de contrôler facilement la visibilité de chacun des onglets .

  

  Mode de validation dans les composants d'entrée[19659004] Un nouveau paramètre enum ValidateOn a été introduit dans tous les composants d'entrée Telerik Blazor, tels que Date & Time Pickers TextBox Numeric TextBox MaskedTextBox  et Zone de texte[1945901sept]. Le paramètre ValidateOn vous permet de configurer s'il faut déclencher la validation en cas de changement, de flou ou lors de la saisie. ;"/>

  Nouvelles fonctionnalités dans les graphiques

  Nous avons exposé plusieurs propriétés de graphique demandées via le portail de commentaires dédiéqui vous permettront de personnaliser facilement la couleur et l'opacité de l'arrière-plan de la zone, la largeur de ligne et type de tiret .

  Code source du produit Disponible pour les titulaires de licence

  À partir de l'interface utilisateur Telerik pour Blazor 2.29, nous expédions désormais le code source du produit pour nos titulaires de licence actifs (disponible dans la section Votre compte -> Téléchargements).

  .Compatibilité NET 6 et Visual Studio 2022

  L'interface utilisateur Telerik pour la bibliothèque Blazor est c compatible avec .NET 6 et Visual Studio 2022 depuis novembre 2021, peu après la sortie par Microsoft. Vous pouvez plonger dans un développement transparent avec nos composants Web et créer de nouveaux projets à l'aide de nos modèles de projet VS et VS Code et de nos mises en page intégrées. "L'interface utilisateur Telerik pour Blazor est compatible avec .NET 6 et VS 2022" style="vertical-align: middle;"/>

  Extensions de code Visual Studio et Visual Studio

  Le Créer de nouveaux assistants de projet pour Visual Studio et Code Visual Studio offrent désormais l'option de configuration du thème et des nuances, ainsi qu'un tout nouveau modèle de projet de tableau de bord d'administration. Vous pouvez désormais styliser votre projet au moment de sa création et configurer à la fois le thème et les nuances spécifiques de l'assistant en un clic.À l'aide du modèle de projet du tableau de bord d'administration, vous pouvez facilement démarrer un projet Blazor avec la mise en page et les fonctionnalités prédéfinies – réorganiser la mise en page en fonction de vos besoins, et simplement branchez vos données et liez-les au c Composants, y compris la grille, la disposition des tuiles, le tiroir, le calendrier, le formulaire, divers types de graphiques, la carte et plus encore. ="vertical-align: middle;"/>

  Téléchargez l'interface utilisateur Telerik pour Blazor 3.0.0

  Accédez à la page Interface utilisateur Telerik pour Blazor et téléchargez un essai gratuit de l'interface utilisateur Telerik pour Blazor 3.0.0. Ou, si vous êtes titulaire d'une licence active, vous pouvez récupérer les dernières et les meilleures sur la page "Votre compte", ou mettre à jour votre référence de package NuGet Telerik.UI.for.Blazor vers la version 3.0.0. Assurez-vous d'examiner et d'évaluer les changements de rupture annoncés avant de mettre à jour vers la dernière version de vos solutions Blazor. assurez-vous de vous inscrire au webinaire sur la version Telerik R1 2022 et aux sessions Twitch en direct pour voir les composants et les fonctionnalités nouvellement publiés en action :

  Sessions Twitch :
  Lun 24 janvier I 10 :00 am ET – midi I Desktop & Mobile
  Mar 25 janvier I 10h00 ET – midi I Web .NET

  Webinaire :
  Mer 2 février I 11h00 – 13h00 HE

  Réservez votre place pour le webinaire

  Merci pour votre soutien continu !