Embedding Beautiful Reporting into Your WPF Applications

栏目: IT技术 · 发布时间: 4年前

内容简介:Here’s what you need to do to implement the Telerik Report Viewer in WPF applications and connect it to Telerik Reporting REST service. Learn more.In this step-by-step tutorial, I will demonstrate how to use the Telerik Report Viewer in the WPF application

Here’s what you need to do to implement the Telerik Report Viewer in WPF applications and connect it to Telerik Reporting REST service. Learn more.

In this step-by-step tutorial, I will demonstrate how to use the Telerik Report Viewer in the WPF application. This tutorial covers the following topics:

  • What is the Telerik Report Viewer?
  • How can it be integrated with the app?
  • How to implement the Report Viewer in a WPF application and connect it to an existing Telerik Reporting REST service
  • Report Viewer toolbar

What is the Telerik Report Viewer?

The Telerik WPF Report Viewer is suitable for WPF and WinForms projects. The viewer is built with Telerik UI for WPF controls providing better look and feel, and functionality. It can operate with an embedded reporting engine or as a client of Telerik Reporting REST Service or Telerik Report Server

. It allows developers to deliver reports to any rich application developed with the Windows Presentation Foundation (WPF).

The purpose of the WPF Report Viewer control is to display Telerik reports and allow the user to interact with them. Reports are processed and rendered on the client machine. The report in the viewer is rendered as standard XAML elements, like Canvas and TextBlock, through Telerik Reporting XAML for WPF rendering mechanism.

Save Your Seat: Reporting In-Depth—How to Streamline Reporting with Ease

How Can it Be Integrated with the App?

To integrate the Telerik Report Viewer in a WPF application, the following are the prerequisites to use:

System Requirement

  • Visual Studio 2010 or later
  • .NET Framework 4 or above
  • If the WPF Report Viewer will connect to a Telerik Reporting REST service, make sure the service is up and running
  • A running Telerik Reporting REST Service endpoint to use in a WPF application (find more infohere)
  • Install the Telerik Report Viewer Window item template (find more infohere)

How to Implement the Report Viewer in a WPF Application

The WPF ReportViewer control is a composite of Telerik UI for WPF controls, and the viewer’s functionality resides in Telerik.ReportViewer.Wpf.dll and the viewer’s UI in Telerik.ReportViewer.Wpf.xaml. Following are the steps to use this in WPF:

Step 1:Create a new WPF application project in Visual Studio.

Step 2:Next, right-click on the project and select Add , then select New Item from the menu. It will open the Add New Item window, as below screenshot:

Embedding Beautiful Reporting into Your WPF Applications

Step 3:Select WPF from the left side menu, and then you will see a list of WPF controls or templates and select Telerik Report Viewer Window R2 2020 .

Embedding Beautiful Reporting into Your WPF Applications

Step 4:Provide the name for it, then click the Add button. It will open the Add new Report Viewer page. Select REST service from the left side and provide your reporting REST service path as below:

Embedding Beautiful Reporting into Your WPF Applications

Step 5:Click on Next button, and it will open the next page to configure the report source. Select the first option for report definition and provide the .trdp file path as below:

Embedding Beautiful Reporting into Your WPF Applications

Step 6:Click the Next button, and it will open the last page for Configure Report Viewer . Tick the checkbox for Enable accessibility .

Embedding Beautiful Reporting into Your WPF Applications

Step 7:Click the Finish button. It will show the static HTML log page with a message and detailed summary as below:

Embedding Beautiful Reporting into Your WPF Applications

It will update the App.xaml file with ResourceDictionaries as below code:

App.xaml

<Application
  x:Class="wpf_report_viewer.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:wpf_report_viewer"
  StartupUri="MainWindow.xaml">
  <Application.Resources>
    <ResourceDictionary>
      <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary

         Source="/Telerik.ReportViewer.Wpf.Themes;component/Themes/Material/System.Windows.xaml" />
        <ResourceDictionary
          Source="/Telerik.ReportViewer.Wpf.Themes;component/Themes/Material/Telerik.Windows.Controls.xaml" />
        <ResourceDictionary
          Source="/Telerik.ReportViewer.Wpf.Themes;component/Themes/Material/Telerik.Windows.Controls.Input.xaml" />
        <ResourceDictionary
          Source="/Telerik.ReportViewer.Wpf.Themes;component/Themes/Material/Telerik.Windows.Controls.Navigation.xaml" />
        <ResourceDictionary
          Source="/Telerik.ReportViewer.Wpf.Themes;component/Themes/Material/Telerik.ReportViewer.Wpf.xaml" />
      </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
  </Application.Resources>
</Application>

It will add the Telerik references as below:

Embedding Beautiful Reporting into Your WPF Applications

Step 8:In the previous steps we have added one .xaml file as the code below:

newly-added.xaml

<Window x:Class="wpf_report_viewer.TelerikReportViewer"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:wpf_report_viewer"
    xmlns:tr="http://schemas.telerik.com/wpf"
    xmlns:telerikReporting="clr-namespace:Telerik.Reporting;assembly=Telerik.Reporting"
    Title="Report Viewer Window">
    <Grid x:Name="LayoutRoot">
        <Grid Margin="20" >
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <tr:ReportViewer Grid.Row="0" x:Name="ReportViewer1" 
                             HorizontalAlignment="Stretch" EnableAccessibility="True"
                             ReportEngineConnection="engine=RestService;uri=http://localhost:12345/api/reports">
              <tr:ReportViewer.ReportSource>
                <telerikReporting:UriReportSource 
                    Uri="path\Reports\Product Catalog.trdp" />
              </tr:ReportViewer.ReportSource>
            </tr:ReportViewer>
        </Grid>
    </Grid>
</Window>

Design

Embedding Beautiful Reporting into Your WPF Applications

Step 9:Lastly, in the App.xaml file, we need to replace the StartupUri of the Application tag as below:

From

<Application
  x:Class="wpf_report_viewer.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:wpf_report_viewer"
  StartupUri="MainWindow.xaml"/>

To

<Application
  x:Class="wpf_report_viewer.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:wpf_report_viewer"
  StartupUri="newly-added.xaml"/>

The value we have changed is so that when the application starts it will open the recently added Telerik Report Viewer XAML file; otherwise it would show the MainWindow XAML.

Step 10:At this point, we’re all set. Start the application, and it should display the WPF window with the rendered report in it as shown below:

Embedding Beautiful Reporting into Your WPF Applications

In case the report is not displayed, please make sure the Reporting REST service is running, following the suggestions in this Knowledge Base article .

The Report Viewer is divided into three main parts: the first part on top for the toolbar, the second part on the left with the toolbar for the filter, and the third part beside the filter for showing the data.

Report Viewer Toolbar

The toolbar of the WPF Report Viewer provides basic functionality for interacting with the currently loaded report:

Embedding Beautiful Reporting into Your WPF Applications

  • Navigate back in history
  • Navigate forward in history
  • Refresh
  • Go to the first page
  • Go to the previous page
  • Go to a specific page
  • Total number of pages
  • Go to next page
  • Go to the last page
  • Print preview: switches between Logical and Physical page renderer
  • Print
  • Export: seeRendering Extensions for available export formats.
  • Show/Hide document map
  • Show/Hide parameters area
  • Zooming

Filter- In the output screenshot, we have seen the Language drop-down is there above the rest of the filters. Based on the filter selection of the language selection, the report data is shown for the catalog in that language. The default language selection is English . When we change it to another language, like French , it will show the French catalog results:

Embedding Beautiful Reporting into Your WPF Applications

You can download this example from GitHub .

Grab the eBook: A Quick Guide to Expert .NET Reporting Tools

Conclusion

In this article, we discussed what the Telerik Report Viewer is, its prerequisites, how to use or work with it in a WPF application, and the Report Viewer toolbar for users. If you have any suggestions or queries regarding this article, please leave a comment.

“Learn It, Share it.”

Tried Telerik DevCraft?

You can chooseTelerik Reportingand Telerik Report Server as individual products or enjoy them as part of the great Telerik DevCraft bundles.

Try Telerik DevCraft

Telerik DevCraft is the finest software developer tools collection across .NET and JavaScript technologies, which includes modern, feature-rich and professionally designed UI components for web, desktop and mobile applications, reporting and report management solutions, document processing libraries, automated testing and mocking tools from the Telerik and Kendo UI suites. DevCraft will arm you with everything you need to deliver outstanding applications in less time and with less effort. With the backing of our legendary support team, which consists of the developers who build the products, and a ton of resources and trainings you can rest assured that you have a stable partner to rely on for your everyday challenges along your software development journey.


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

点石成金

点石成金

[美] 克鲁格 (Steve Krug) / 蒋芳 / 机械工业出版社 / 2015-1-1 / CNY 59.00

《点石成金:访客至上的Web和移动可用性设计秘笈(原书第3版)》是一本关于Web设计原则而不是Web设计技术的书。《点石成金:访客至上的Web和移动可用性设计秘笈(原书第3版)》作者是Web设计专家,具有丰富的实践经验。他用幽默的语言为你揭示Web设计中重要但却容易被忽视的问题,只需几个小时,你便能对照书中讲授的设计原则找到网站设计的症结所在,令你的网站焕然一新。一起来看看 《点石成金》 这本书的介绍吧!

JS 压缩/解压工具
JS 压缩/解压工具

在线压缩/解压 JS 代码

HTML 编码/解码
HTML 编码/解码

HTML 编码/解码

XML 在线格式化
XML 在线格式化

在线 XML 格式化压缩工具