Fermer

janvier 20, 2021

Nouvelle interface utilisateur Telerik pour les composants ASP.NET Core dans R1 2021


Bonne nouvelle 2021, chers développeurs! Nous espérons qu'il vous apportera avant tout santé, inspiration et prospérité! Avec la première version de Telerik UI pour ASP.NET Core de l'année, nous sommes ravis de partager tous les nouveaux composants, fonctionnalités et outils que vous pouvez intégrer à vos projets et créer des applications modernes et attrayantes en deux fois moins de temps.

Le Telerik R1 La version 2021 comprend cinq nouveaux composants Telerik UI pour ASP.NET Core comme le Floating Action Button Bottom Navigation Expansion Panel Radio Group Checkbox Group plus new Grid, ListView, TileLayout and Editor features tout nouveau Visual Studio Code Wizard ] et beaucoup plus! Lisez à l'avance et découvrez les nouveautés de l'interface utilisateur Telerik pour ASP.NET Core R1 2021!

Nouvelle interface utilisateur pour les composants ASP.NET Core

Nouvelle interface utilisateur pour le composant de navigation inférieure ASP.NET Core

Présentation de la navigation inférieure

En plus du composant App Bar que nous avons livré avec Telerik R3 2020 en septembre dernier nous ajoutons un composant de navigation inférieur et élargissons la collection de composants de navigation pour plus de facilité le développement de vos applications ASP.NET Core. Le composant BottomNavigation permet un mouvement intuitif entre les destinations principales d'une application (généralement entre trois et cinq) représentées par des icônes et des étiquettes de texte facultatives. Le composant est livré avec un grand nombre de paramètres de configuration, d'événements, d'accessibilité intégrée, de navigation au clavier et de prise en charge de droite à gauche (RTL).

 Telerik UI for ASP.NET Core Bottom Navigation Component "title =" Telerik UI for Composant de navigation inférieure ASP.NET Core "style =" vertical-align: middle; "/><p align= Interface utilisateur Telerik pour le composant de navigation inférieure ASP.NET Core

Personnalisation du composant de navigation inférieur

Apparence de navigation inférieure peut être complètement adapté au scénario de votre application et vous pouvez rapidement définir son: orientation, couleur du thème, bordure, type de remplissage, ombre et flux d'éléments pour obtenir l'apparence souhaitée.

 Telerik UI pour ASP.NET Core Apparence personnalisée de la navigation inférieure "title =" Interface utilisateur Telerik pour ASP.NET Core Apparence personnalisée de la navigation inférieure "style =" vertical-align: middle; "/></p data-recalc-dims=

Interface utilisateur Telerik pour ASP.NET Core Présentation personnalisée de la navigation inférieure

le contrôle de navigation inférieur expose également une configuration spécifique attributs pour chacun de ses éléments: texte (facultatif), icône, classe CSS, états sélectionnés et activés, etc.

Modèles de composants de navigation inférieurs

En plus de personnaliser l'apparence, vous pouvez rendre du HTML entièrement personnalisé, y compris d'autres Telerik Interface utilisateur pour les composants ASP.NET Core dans la navigation du bas.

 Interface utilisateur Telerik pour ASP.NET Core Bottom NavigationTemplates "title =" Telerik UI pour ASP.NET Core Bottom NavigationTemplates "style =" vertical-align: middle; "/></p data-recalc-dims=

Modèles de navigation inférieure de l'interface utilisateur Telerik pour ASP.NET Core

Nouvelle interface utilisateur pour le bouton d'action flottante ASP.NET Core

Présentation du bouton d'action flottante

L'interface utilisateur Telerik pour le bouton d'action flottante ASP.NET Core (FAB) est pratique lorsque vous devez activer un accès rapide à l'action la plus courante dans l'interface utilisateur de vos applications. Le nom du bouton FAB vient du fait qu'il flotte au-dessus du contenu de l'écran et affiche une action principale contextuelle à l'écran actuel. Le bouton FAB de l'interface utilisateur Telerik pour ASP.NET Core est fourni avec un grand nombre de paramètres de configuration, d'événements, d'accessibilité intégrée, de navigation au clavier et de prise en charge de droite à gauche (RTL).

 Telerik UI pour ASP.NET Core Floating Action Button Component "title =" Interface utilisateur Telerik pour ASP.NET Core Floating Action Button Component "style =" vertical-align: middle; "/></p data-recalc-dims=

Telerik UI pour ASP.NET Core Floating Action Button

Floating Configuration et personnalisation du bouton d'action

Le bouton d'action flottant peut être facilement personnalisé en fonction des exigences de votre application grâce à son grand nombre de paramètres liés à l'apparence et aux fonctionnalités:

  • Alignement : Utilisation de Align AlignOffset et PositionMode vous avez un contrôle total sur la position du bouton FAB (offset fixe, absolu et pair)
  • Apparence : Nom, icône, Texte, forme, taille, couleur du thème
  • Numéro abrégé ions : vous pouvez également configurer le FloatingActionButton pour afficher des actions associées supplémentaires ( actions de numérotation abrégée )

 Telerik UI pour ASP.NET Core Floating Action Button Shapes "title =" Telerik UI pour ASP. NET Core Floating Action Button Shapes "style =" vertical-align: middle; "/></p data-recalc-dims=

Telerik UI pour ASP.NET Core Floating Action Button Shapes

Floating Action Button Templates

Au cas où vous auriez besoin d'aller au-delà personnalisation et rendu du contenu personnalisé pour les éléments du bouton d'action flottant (par exemple pour ses actions de numérotation abrégée), vous pouvez facilement y parvenir en utilisant la fonction de modèles de bouton FAB.

Événements de bouton d'action flottant

Le Le composant Floating Action Button expose plusieurs événements pour vous permettre de gérer la logique métier dans vos applications ASP.NET Core: OnExpand, OnCollapse, OnItemClick, OnClick.

Nouvelle interface utilisateur pour ASP.NET Core Expansion Panel Component [19659034] Organisez bien le contenu de votre application avec des zones qui peuvent facilement être étendues et réduites avec le nouveau composant Telerik UI pour panneau d'extension ASP.NET Core .

 Telerik UI pour ASP.NET Core Expansion Panel Component "title =" Telerik UI pour ASP.NET Core Expansion Panel Component "style =" vertical-align: middle; "/><p align= Telerik UI pour ASP.NET Core Panneau d'extension

Le panneau d'extension peut être facilement configuré avec les propriétés fournies: Nom, Titre, Sous-titre et Contenu . De plus, il est livré avec des options pour:

  • Activer / le désactiver via sa propriété Disabled
  • Expand / collapse via sa propriété Expanded
  • Empêcher l'expansion / collapse via sa propriété Toggleable property
  • Disable visual animation lors de l'expansion de l'effondrement via sa propriété Animation

Et comme la plupart des autres composants Telerik UI pour ASP.NET Core, il inclut le support RTL et ne nécessite aucun travail pour interagir avec lui en utilisant uniquement le clavier grâce à son Prise en charge de la navigation par clavier intégrée .

Nouvelle interface utilisateur pour AS P.NET Core CheckBox Group Component

CheckBoxGroup Component Overview

Le Telerik CheckBoxGroup component for ASP.NET Core fournit un moyen prêt à l'emploi d'avoir une liste de cases à cocher de style lié aux données . Le contrôle de groupe de cases à cocher comprend de nombreux paramètres de configuration, événements, accessibilité intégrée, navigation au clavier et prise en charge de droite à gauche (RTL).

 Telerik UI for ASP.NET Core CheckBoxGroup Component "title = "Telerik UI pour ASP.NET Core CheckBoxGroup Component" style = "vertical-align: middle;" /> </strong data-recalc-dims=

Telerik UI pour ASP.NET Core CheckboxGroup Component

CheckBoxGroup Binding

CheckBoxGroup la liaison de données est disponible via les deux méthodes: Items () et BindTo (). Vous pouvez utiliser la méthode Items () pour lier chacun des éléments de groupe de cases à cocher et les méthodes BindTo () lors de la liaison du groupe de cases à cocher à un modèle de données. [19659008] Étiquettes et mise en page de CheckBoxGroup

Les éléments de la liste CheckBoxGroup peuvent être disposés en positions horizontales et verticales. Pour d'autres looks personnalisés, vous avez un contrôle total sur le positionnement des étiquettes. Voyez comment dans la documentation officielle . [19659051] Interface utilisateur Telerik pour ASP.NET Core CheckBoxGroup Layo ut & Labels "title =" Interface utilisateur Telerik pour ASP.NET Core CheckBoxGroup Layout & Labels "style =" vertical-align: middle; "/>

Interface utilisateur Telerik pour ASP.NET Core CheckboxGroup Layout and Labels

Nouvelle interface utilisateur pour ASP.NET Core Radio Group Component

RadioGroup Overview

Le nouveau RadioGroup component représente une liste stylisée de boutons radio, similaire au composant CheckBoxGroup, mais les utilisateurs peuvent sélectionner une seule option parmi la liste.

 Telerik UI pour ASP.NET Core RadioGroup Component "title =" Telerik UI pour ASP.NET Core RadioGroup Component "style =" vertical-align: middle; "/></p data-recalc-dims=

Telerik UI pour ASP.NET Core RadioGroup Component

Liaison RadioGroup

Tout comme avec CheckBoxGroup, la liaison peut être effectuée via les méthodes Items () et BindTo ().

RadioGroup Labels and Layout

Les éléments RadioGroup peuvent être disposés horizontalement ou position verticale. Pour d'autres aspects personnalisés, vous avez un contrôle total sur le positionnement des étiquettes. Consultez la documentation officielle .

 Telerik UI pour ASP.NET Core RadioGroup Layout & Labels "title =" Telerik UI for ASP.NET Core RadioGroup Layout & Labels "style =" vertical-align: middle; "/></p data-recalc-dims=

Telerik UI pour ASP.NET Core RadioGroup Layout & Labels

Form Component Integration

Last but not least les deux RadioGroup et les composants CheckBoxGroup s'intègrent parfaitement comme éléments de configuration intégrés dans le compone Form nt.

Nouvelle interface utilisateur Telerik pour ASP.NET Core Fonctionnalités

Exportation de grille vers CSV

L'interface utilisateur Telerik pour ASP.NET Core Grid a été améliorée avec l'option d'exporter ses données vers un fichier CSV (en plus de l'existant options d'exportation aux formats PDF et Excel). Par défaut, la grille d'interface utilisateur Telerik exporte toutes les lignes, mais vous pouvez la configurer pour exporter uniquement les lignes sélectionnées. Pour plus d'informations sur les options d'exportation de grille disponibles, consultez la page de documentation dédiée .

 Interface utilisateur Telerik pour ASP.NET Core Grid Export vers CSV "title =" Interface utilisateur Telerik pour ASP.NET Core Grid Export vers CSV "style =" vertical-align: middle; "/><p align= Interface utilisateur Telerik pour ASP.NET Core Grid Export to CSV

Organize Items in the Grid Column Menu

Le menu Grid column a été amélioré avec un nouveau mode de rendu disponible comme option de configuration facilement paramétrable. Par défaut, le menu des colonnes est initialisé avec le mode de rendu "classique", et si vous souhaitez profiter du nouveau style, vous pouvez facilement le passer en "moderne". "

 Telerik UI pour ASP.NET Core Grid Column Menu Modern Rendering" title = "Telerik UI pour ASP.NET Core Grid Column Menu Modern Rendering" style = "vertical-align: middle;" /><p align= Telerik UI pour ASP.NET Core Grid Column Menu Rendu moderne

Propriété exportable pour les colonnes de grille

L'interface utilisateur Telerik pour ASP.N Les colonnes ET Core Grid ont désormais une nouvelle propriété Exportable qui vous permet de définir quelles colonnes seront exportées et lesquelles seront ignorées. En plus de cela, vous pouvez définir une colonne comme exportable uniquement lorsqu'un format de fichier spécifique est utilisé (par exemple exportable pour CSV, mais pas pour PDF).

Nouvelle fonctionnalité de l'éditeur: importation, modification et exportation de fichiers

Le composant Telerik UI pour ASP.NET Core Editor peut facilement servir d'éditeur de texte enrichi en vous permettant d'importer, de modifier et d'exporter son contenu . Les formats d'importation de fichiers pris en charge sont les suivants: DOCX, RTF, HTML et TXT, et en ce qui concerne les formats d'exportation pris en charge, ils incluent: DOCX, RTF, PDF, HTML, TXT.
 Telerik UI pour ASP.NET Core Editor - Import, Modifier et exporter "title =" Interface utilisateur Telerik pour ASP.NET Core Editor - Importer, modifier et exporter "style =" vertical-align: middle; "/></p data-recalc-dims=

Interface utilisateur Telerik pour ASP.NET Core Editor – Importer, modifier et Exportation

Nouvelle fonctionnalité de l'éditeur: liste avec des chiffres romains sous forme de puces

L'interface utilisateur Telerik pour ASP.NET Core Editor prend désormais en charge les listes d'éléments non ordonnés, ainsi que la possibilité de créer des listes numérotées avec des chiffres arabes et romains. Un exemple des nouvelles fonctionnalités peut être trouvé dans la démo Editor All Tools .

New Editor Feature: Table Aligning Tool

Lorsque vous travaillez avec des tableaux dans Editor, les utilisateurs peuvent désormais facilement les aligner à l'aide du nouveau outils intégrés pour l'alignement à gauche, au centre ou à droite. Dans la démo de l'éditeur Tous les outils vous pouvez sélectionner l'ed itor et les options d'alignement apparaîtront dans la barre d'outils, vous permettant d'effectuer l'alignement nécessaire en un clic.

Nouvelle fonctionnalité TileLayout: Options d'ajout / suppression d'éléments

Le composant Telerik TileLayout prend désormais en charge dynamiquement ajout et retrait de carreaux . Il convient parfaitement aux applications de type tableau de bord où les utilisateurs d'applications auront la possibilité de réorganiser les KPI, d'ajouter de nouveaux éléments en les faisant glisser et de les déposer d'une barre latérale dans la zone visuelle principale ou de les supprimer complètement.

 Telerik UI pour ASP. NET Core TileLayout Ajouter et supprimer des éléments "title =" Interface utilisateur Telerik pour ASP.NET Core TileLayout Ajouter et supprimer des éléments "style =" vertical-align: middle; "/><p align= Interface utilisateur Telerik pour ASP.NET Core TileLayout Ajouter et supprimer Éléments

Nouvelle fonction de regroupement ListView

Les éléments ListView peuvent désormais être organisés en groupes à l'aide de la fonction de regroupement DataSource et de la configuration appropriée du modèle ListView, afin qu'il puisse accueillir les données groupées comme indiqué dans le groupement List View démo .

 Interface utilisateur Telerik pour ASP.NET Core ListView Grouping "title =" Interface utilisateur Telerik pour ASP.NET Core ListView Grouping "style =" vertical-align: middle; "/><p align= Interface utilisateur Telerik pour ASP Groupement ListView .NET Core

Navigation au clavier et accessibilité

Avec la version R1 2021, nous avons ajouté la navigation par clavier intégrée et la prise en charge des normes d'accessibilité WAI-ARIA, Section 508 et WCAG 2.1 pour plusieurs composants: ScrollView Drawer Timeline et TileLayout .

Nouvel assistant de code Visual Studio

Dans les versions précédentes, nous avons donné beaucoup d'amour à Visual Studio et développé nos extensions et modèles pour celui-ci. Avec R1 2021, un nouvel assistant Visual Studio Code simplifie le processus de création de projet avec l'interface utilisateur Telerik pour les composants ASP.NET. À l'aide de l'assistant, vous pouvez facilement démarrer avec des modèles de projet prédéfinis qui intègrent déjà l'interface utilisateur Telerik pour les composants ASP.NET Core tels que les entrées de grille, de graphique et de formulaire. Vous pouvez également configurer rapidement un thème SASS et choisir parmi Default, Material et Bootstrap.

 Assistant Visual Studio Code avec interface utilisateur pour les modèles ASP.NET Core "title =" Assistant Visual Studio Code avec interface utilisateur pour modèles ASP.NET Core "style =" vertical-align: middle; "/></p data-recalc-dims=

Visual Studio Code Assistant avec interface utilisateur pour les modèles ASP.NET Core

Mise en évidence améliorée des séries de zones

Les graphiques en zones peuvent désormais avoir une indication visuelle lorsque l'utilisateur survole les différentes séries. Avec la nouvelle fonctionnalité, les graphiques en zones rendront les séries non survolées transparentes pour mettre l'accent sur la série qui intéresse le plus l'utilisateur.

Nouvelles fonctionnalités de Telerik Document Processing: Prise en charge du traitement des mots pour les contrôles de contenu

Avec la version R1 2021, nous avons quelque chose de nouveau et pour ceux d'entre vous qui utilisent Traitement de document Telerik dans leurs applications ASP.NET Core! Les contrôles de contenu permettent aux utilisateurs d'ajouter une sémantique spécifique au document: restriction de la saisie, modification du comportement d'édition, etc. Habituellement, les contrôles de contenu sont utilisés pour créer un modèle qui vous permet de remplir spe données spécifiques par interaction avec le document (à l'aide de cases à cocher, d'options prédéfinies, de calendriers). Avec la dernière version de la bibliothèque RadWordsprocessing, vous pouvez créer et manipuler les contrôles de contenu à l'intérieur d'un document.

Téléchargez la dernière interface utilisateur Telerik pour ASP.NET Core maintenant

Téléchargez et essayez un version d'essai de l'interface utilisateur Telerik pour ASP.NET Core, ou si vous êtes un détenteur de licence actif, vous pouvez simplement récupérer la dernière et la meilleure sur la page Votre compte! Partagez vos impressions avec nous sur notre portail de commentaires et aidez-nous à façonner l'avenir de l'interface utilisateur pour ASP.NET Core.

Session Twitch spéciale et webinaire

Assurez-vous de vous inscrire à Telerik R1 2021 webinaire de sortie le mardi 26 janvier | De 11 h 00 à 13 h 00 HE ou rejoignez la session en direct d'une journée complète sur Twitch le vendredi 29 janvier, de 8 h 00 à 17 h 00 HE pour voir le les composants et fonctionnalités nouvellement publiés en action et obtenez des idées sur la façon de les utiliser dans vos projets pour un aperçu plus approfondi de toutes les nouvelles fonctionnalités de la version.

Réservez votre siège pour le webinaire

Merci pour votre soutien continu et bon codage ASP.NET Core!





Source link