Fermer

décembre 2, 2021

Visionneuse de rapports WinUI pour ordinateur de bureau


La famille Progress Telerik Reporting s'est agrandie depuis R3 2021 : une nouvelle visionneuse de rapports WinUI pouvant être intégrée aux applications de bureau WinUI3 est désormais disponible.

Je suis sûr que vous avez entendu parler du Telerik day-zero prise en charge de WinUI. C'est une longue histoire écrite par nos grands développeurs qui a commencé il y a plus d'un an. Le premier membre de la famille était le composant DataGrid for WinUI. Après cela, petit à petit, en ajoutant un composant après l'autre, la famille Telerik UI for WinUI s'est agrandie avec la bibliothèque Microsoft WinUI. Apprenez à le connaître en téléchargeant les Démos Telerik WinUI.

Avoir un ensemble stable et complet de commandes Telerik UI pour WinUI pour UWP et Desktop, quelle est la prochaine étape logique ? Si vous avez pensé à un WinUI ReportViewer, vous avez raison ! Fournir un ReportViewer pour WinUI semblait une tâche facile, compte tenu de tous les différents visualiseurs de rapports Telerik que nous avons déjà. La liste des plates-formes prises en charge est large : ASP.NET Core, Blazor, Angular, WPF, Winforms, etc. Et voici un petit secret de la cuisine : elles partagent toutes le même moteur sous la surface.

Vous voulez connaître l'histoire. de fournir un WinUI ReportViewer ? Bien sûr, commençons. Mais, oh, deux petites choses que vous devez savoir d'abord : il a été introduit avec la R3 2021 release. Et des infobulles sur le contenu d'un rapport ont été récemment ajoutées avec le Service Pack R3 2021.

Introduction à WinUI

Si c'est la première fois que vous entendez parler de WinUI ou si vous vous trompez sur ses versions, voici une brève introduction.

La bibliothèque d'interface utilisateur Windows est un cadre UX natif pour les applications de bureau Windows et UWP. Il est basé sur le Fluent Design System. Il existe deux générations de WinUI en cours de développement : WinUI 2 et WinUI 3. Alors que WinUI 2.x est une bibliothèque de contrôle au-dessus d'UWP livrée en tant que package NuGet autonome, WinUI 3.0 est un tout nouveau framework qui vise à remplacer l'interface utilisateur et cadre d'application de l'UWP. WinUI 3.0 est fourni avec le Windows App SDK (anciennement connu sous le nom de Project Reunion).

Les produits Telerik WinUI visent à cibler la dernière version stable du Windows App SDK.

Telerik ReportViewer pour WinUI—Le début

Tout a commencé avec l'interface utilisateur.

Les concepteurs ont suivi l'expérience UX exceptionnelle que nous offrons avec nos autres visionneuses de rapports. Tout d'abord, nous avons créé le « squelette » avec les parties suivantes : navigation, plan de document, zone de rapport, zone de paramètres et barre de zoom.

Partie 1 : Navigation

Qu'est-ce qu'une visionneuse de rapport sans barre de navigation ?![19659003]Ayant ainsi, vous pouvez naviguer à travers les pages du rapport ou l'historique des rapports visités. Vous pouvez également personnaliser les paramètres de la page, imprimer ou exporter le rapport et activer ou désactiver la visibilité du plan du document et de la zone des paramètres.

Pour les besoins de notre visionneuse de rapports, nous avons utilisé la MS CommandBar avec contenu personnalisé pour les AppBarButtons et AppBarToggleButtons à aligner à gauche. En outre, un nouvel ensemble d'icônes de chemin a été fourni par les concepteurs, car certaines des icônes nécessaires manquaient dans l'ensemble prédéfini WinUI symbol icons et dans Segoe MDL2 Assets icons.[19659003]Gif animé ReportVIewer montrant les thèmes intégrés

Partie 2 : Zone de rapport

Le MS TreeView a un design attrayant très bien adapté pour l'explorateur de documents, alors que la zone des paramètres est un contrôle personnalisé—ReportParametersControl—qui change de modèle en fonction du type de paramètre.

La zone de rapport a deux vues—un modèle interactif et une impression modèle d'aperçu. Le basculement entre le rendu logique et le rendu physique de la page s'effectue en basculant le bouton Aperçu avant impression dans la barre de commandes.

Sous le rapport, il y a un zoom qui, avec les fonctionnalités d'exploration et d'exploration, rend le rapport interactif. La fonction de zoom a été développée avec le Telerik LayoutTransformControl et le Telerik RangeSliderqui pourraient tous deux être d'une grande aide pour un développeur.

Un petit mais crucial composant Telerik a été utilisé pour disposer toutes ces parties de la zone de rapport : le GridSplitter.

Partie 3 : Touches finales

Aucun look ne semble terminé sans une petite étincelle.[19659003] Dans le cadre de l'UX de la visionneuse de rapports, il s'agissait des superpositions avec des messages informatifs et des info-bulles sur les boutons et à l'intérieur des rapports.

Je pense que voici la partie où je vous dis que la visionneuse de rapports prend en charge les six éléments intégrés. dans les thèmes – Lumière, Sombre et quatre thèmes à contraste élevé (Contraste élevé #1, Contraste élevé #2, Lumière à contraste élevé et Noir à contraste élevé). construit avec les composants Microsoft et Telerik UI pour WinUI.

Les binaires fournis avec la visionneuse sont :

  • un pour la partie fonctionnelle (Telerik.ReportViewer.WinUI.dll)
  • un pour la thématisation (Telerik.ReportViewer.WinUI.Themes.dll)

Le la partie fonctionnelle dépend du moteur de reporting pour le rendu des rapports. Les rapports sont rendus en tant que contrôles XAML standard via le mécanisme de rendu Telerik Reporting XAML, ajusté pour les spécificités de WinUI.

  • en tant que moteur de rapport intégré (dans l'application WinUI elle-même)
  • en l'hébergeant à distance à l'aide du service de rapports REST
  • en utilisant le serveur de rapports, une plate-forme basée sur un serveur qui fournit un stockage pour les rapports et améliore leur gestion

Une note latérale est que le framework WinUI est en développement actif, et nous continuerons à ajouter des fonctionnalités avec l'avancement du framework.

À quoi s'attendre ensuite ?

En fonction de la demande de nos clients, nous couvrirons toutes les fonctionnalités que nous avons déjà pour les autres plateformes. Un moteur de recherche avec surbrillance des résultats et des info-bulles des événements côté client sont quelques-unes des fonctionnalités qui viendront ensuite.

Theme It as You Need It

Le Telerik ReportViewer pour WinUI bénéficie du ]UserThemeResources extension de balisage fournie par Telerik. Son objectif est de permettre aux développeurs de remplacer facilement les ressources utilisées dans les thèmes par défaut.

Il expose trois propriétés statiques—DarkResourcePathLightResourcePath et HighContrastResourcePath . Tous font référence au chemin URI du dictionnaire de ressources contenant les définitions de ressources de thème pour le thème respectif. Si aucune valeur n'est définie pour l'un ou l'autre, le thème sombre par défaut sera utilisé. Envie de l'essayer ? Faisons-le ensemble.

Étape 1 : Ouvrez la solution de démonstration

Depuis R3 2021 SP1, nous livrons une solution dédiée contenant deux projets WinUI—un projet contenant le code de démonstration et un Projet de packaging d'application Windows ] qui est configuré pour créer l'application dans un package MSIX.

Il se trouve sous le chemin suivant :

C:Program Files (x86)ProgressTelerik Reporting R3 2021ExamplesCSharp

Assurez-vous de définir le projet de package en tant que démarrage.

Étape 2 : ajouter des dictionnaires de ressources personnalisés pour chaque thème

resource-dictionaries" title="resource-dictionaries"/></p data-recalc-dims=

Nous allons imiter les trois palettes Office2019 de Telerik UI pour la suite WPF : clair, foncé et contraste élevé. Comment ? En ajoutant des valeurs personnalisées des pinceaux suivants dans chacun des dictionnaires de ressources.

CustomResourcesDark.xaml :

<ResourceDictionary

     <SolidColorBrush x:Key="TelerikReportViewer_Background" Color="#FF0F0F0F"/>[1965909    <SolidColorBrush x:Key="TelerikReportViewer_BorderBrush" Couleur[19659057]="#FF606060"/>

    <SolidColorBrush x:Key=[19659058]"TelerikReportViewer_CommandBarBackground" Color="#FF3C3C3C" />

</ResourceDictionary>[19659086]CustomResourcesLight.xaml:

<ResourceDictionary

    <SolidColorBrush x:Key="TelerikReportViewer_Background" x:Key="TelerikReportViewer_Background"[19659019659058]"#FFDFDFDF"/>

    <SolidColorBrush x:Key="TelerikReportBrusher_B Couleur="#FFACACAC"/>

    <SolidColorBrush x:Key[19659057]="TelerikReportViewer_CommandBarBackground"[19659056]Couleur="#FFF1F1F1" />

</ResourceDictionary>

CustomResourcesHigh Contrast.xaml :

<ResourceDictionary

     <SolidColorBrush x:Key="TelerikReportViewer_Background" Couleur[19650005708]=[1965905708]=["/>

     <SolidColorBrush x:Key="TelerikReportViewer_BorderBrush]Color"[1965905619659057]="#FFFFFFFF"/>

     <SolidColorBrush x:Key=[19659058]"TelerikReportViewer_CommandBarBackground" Color="#FF000000" />

</ResourceDictionary>[19659158]Étape 3 : Branchez la ressource UserThemeResources[19659013]Ajoutez la définition UserThemeResources dans les ressources de l'application et personnalisez l'arrière-plan de la démo :

<ResourceDictionary>

    < telerik:UserThemeResources x:Key="themeResourceInitializer"

    <ResourceDictionary.ThemeDictionaries>[194590045] ]        

        <ResourceDictionary x:][19659019659058]"Par défaut">

            <SolidColorBrush x:Key="[196590Brush]Couleur="#FF3C3C3C" />

        </ResourceDictionary>

 

        

         ]ResourceDictionary x:Key="Light">

            <SolidColor56Brush[196590Clé="DemoBackgroundBrush" Color="#FFF1F1F1" />

         /ResourceDictionary>

 

        [19659002]        <ResourceDictionary x:Key="HighContrast">

<SolidColorBrush x:Key="DemoBack GroundBrush" Color="#FF000000" />

        </ResourceDictionary>

    </ResourceDictionary.ThemeDictionaries>

 

    <ResourceDictionary.MergedDictionaries>

        <XamlControls][Resources[1965199056]90ml using :Microsoft.UI.Xaml.Controls" />

 

        

    </ResourceDictionary.MergedDictionaries >

</ResourceDictionary>

Ta-da ! Nous avons un thème personnalisé pour le ReportViewer

ReportViewer avec des thèmes personnalisés clairs et sombres" title="ReportViewer avec des thèmes personnalisés clairs et sombres" style="vertical-align: middle;" data-openoriginalimageonclick= "true"/></a data-recalc-dims=

Essayez-le et partagez vos commentaires

Nouveau dans Telerik Reporting et/ou Telerik UI pour WinUI ? Pas de soucis. Vous pouvez en savoir plus via Telerik UI pour WinUI et Telerik Reporting. N'attendez pas pour les essayer : obtenez un essai gratuit dès maintenant :

L'interface utilisateur Telerik pour les contrôles WinUI est déjà prête pour la production pour les applications Win32. Telerik Reporting est un outil d'intégration .NET complet et mature pour les applications Web et de bureau.

Une dernière chose à garder à l'esprit : les licences concernant Telerik UI for WinUI et Telerik Reporting sont des produits individuels différents. Vous pouvez acheter les deux avec l'un de nos deux meilleurs ensembles de produits—DevCraft Complete ou DevCraft Ultimate.

Nous aimerions connaître votre avis, donc si vous avez des questions et/ou des commentaires, n'hésitez pas eux ci-dessous.




Source link