Search results

Display SSRS RDL report in Bold Reports UWP Report Viewer

This section explains you the steps required to create your first UWP reporting application to display an already created SSRS RDL report in the Bold Reports UWP Report Viewer without using a Report Server.

To get start quickly with Report Viewer, you can check on this video:

Create the application project

Open Visual Studio 2017 and select File > New > Project.
Go to Installed > Visual C# > Windows Universal.
Select Blank App (Universal Windows), change the application name, and then click OK.
Select the target and minimum platform version of Windows 10, version 1809(10.0; Build 17763) from the dropdown, and then click OK.

Set the same version for the target and the minimum platform version.

Configure Report Viewer in an application

Right-click the project or solution on the Solution Explorer tab and choose Manage NuGet Packages. Alternatively, select Tools > NuGet Package Manager > Manage NuGet Packages for Solution.

Refer to the NuGet Packages to learn more details about installing and configuring Report Viewer NuGet packages.
Search for BoldReports.UWP NuGet package and install them in your UWP application.

Package Purpose

BoldReports.UWP Contains UWP Reporting controls (Report Viewer and Report Writer) to preview and export the reports.

Package	Purpose
`BoldReports.UWP`	Contains UWP Reporting controls (Report Viewer and Report Writer) to preview and export the reports.

Initialize Report Viewer

Open the MainWindow.xaml file and import the Report Viewer namespace as shown below,
```
xmlns:BoldReports="using:BoldReports.UI.Xaml"
```

Initialize the Report Viewer component inside the <Grid> tag as shown below in the MainWindow.xaml file,

<Page
    ....
    ....
    ....
    xmlns:BoldReports="using:BoldReports.UI.Xaml"
    ....>
    <Grid>
        <BoldReports:ReportViewer Name="ReportViewer"/>
    </Grid>
</Page>

Create Web API service

The Report Viewer requires a Web API service to process the RDL report files. You can skip this step and use the online Web API services to preview the already available reports or you should create any one of the following Web API services:

Adding already created report

If you have created a new service, you can add the reports from the Syncfusion installation location. For more information, refer to the samples and demos section.

Create a folder Resources in your Web API application to store RDL reports and add the already created reports to it.
Add already created reports to the newly created folder.

In this tutorial, the sales-order-detail.rdl report is used, and it can be downloaded at this link.

Refer to the create RDL report section for creating new reports.

Set report path and service URL

Open the MainWindow.xaml.cs file.

Initialize the window loaded event inside the MainWindow() constructor.

public MainPage()
{
    this.InitializeComponent();
    this.Loaded += MainPage_Loaded;
}

private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
}

Set the ReportPath and ReportServiceUrl properties in the MainWindow_Loaded event method and invoke the RefreshReport() method to render the report.

You can replace the following code in your MainWindow_Loaded event method.

private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
    this.ReportViewer.ReportPath = "~/Resources/docs/sales-order-dtail.rdl";
    this.ReportViewer.ReportServiceURL = @"https://demos.boldreports.com/services/api/ReportViewer";
    this.ReportViewer.RefreshReport();
}

In the above code, the sales-order-detail.rdl report and reportServiceUrl used from online URL.

Preview the report

Build and run the application to view the report output in the Report Viewer as displayed in the following screenshot.

Preview of sales order detail report

Note: You can refer to our feature tour page for the UWP Report Viewer to see its innovative features.