Get Started with WinUI Reporting

• Oct 24, 2024
• 3 minutes to read

Important

The DevExpress WinUI product suite has been discontinued and is no longer available to new customers. We continue to monitor market-demands and the viability of WinUI as a desktop development platform. Should demand increase and market conditions change, we will reconsider our decision.

Existing Users: The DevExpress WinUI product line was available as part of a free product offer that expired on June 1, 2024. If you registered for the free offer before June 1, 2024 you can download the DevExpress WinUI product suite by visiting the DevExpress Client Center. The latest available version is v23.2.

This topic describes how to create a new WinUI application that integrates the Document Viewer control.

Prerequisites

Review the following help topic for information on DevExpress WinUI controls system requirements: DevExpress WinUI Controls - Prerequisites.

DevExpress WinUI Reporting requires an active DevExpress Reporting Subscription.

Create a New Project

1. Start Visual Studio and click Create a new project. Select the Blank App, Packaged (WinUI 3 in Desktop) template and click Next.

   

2. Specify the project name and location. Click Create.

   

Create a NuGet Package Source

If you run the DevExpress installer, the DevExpress 23.2 Local NuGet package source is created automatically.

If you do not install DevExpress controls on a local machine, you should obtain a personal NuGet feed URL and create a DevExpress NuGet package source as follows:

1. Right-click the Dependencies node in the Solution Explorer window and select Manage NuGet Packages:

   

2. Obtain your NuGet feed URL and copy it to the clipboard.

3. Create a new package source for the DevExpress NuGet feed, as described in the following help topic: Install NuGet Packages in Visual Studio, VS Code, and Rider.

Install NuGet Packages

1. In the invoked NuGet Package Manager, set Package source to DevExpress (or DevExpress 23.2 Local). Locate the DevExpress.WinUI package and click Install.

   

2. Optional (required to work with SQLite databases). Set Package source to nuget.org, locate the System.Data.SQLite.Core package, and click Install.

Create a Sample Report

Create a new report as described in the following help topic: Create a Report in Visual Studio. The default report name is XtraReport1.

If you create a report bound to data, specify the sample nwind.db SQLite database as the data source. The sample nwind.db database ships with the DevExpress installation. The database is stored in the following default folder:

C:\Users\Public\Documents\DevExpress Demos 23.2\Components\Data

When a new report is added to the project, the DevExpress.Reporting.Core NuGet package is installed automatically.

Add the Document Viewer to the Page

1. Define the Document Viewer in XAML and specify its DocumentSource property binding:

   MainWindow.xaml

   <Window
   x:Class="App1.MainWindow"
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
   xmlns:dxdvr="using:DevExpress.WinUI.DocumentViewer"
   mc:Ignorable="d">
   
   <Grid>
       <dxdvr:DocumentViewer DocumentSource="{x:Bind Report, Mode=OneWay}"/>
   </Grid>
   </Window>
   

2. Define and initialize the Report property in the code-behind file as shown in the following code snippet:

   MainWindow.cs

   using DevExpress.XtraReports.UI;
   using Microsoft.UI.Xaml;
   
   namespace App1
   {
       public sealed partial class MainWindow : Window
       {
           public MainWindow()
           {
               this.InitializeComponent();
               this.Report = new XtraReport1();
           }
           private XtraReport Report { get; set; }
       }
   }
   

Run the App

When you run the application, it shows the Document Viewer that displays a report. If you create a simple table report from the Categories data table in the nwind.db sample database, the application appears as follows: