Important!

The Blazor reporting tool allows you to create reports of any complexity - from standard invoices to complex documents with parameters, interactive sorting, and drill-down functionality. However, native visual components such as the viewer and report designer for the .NET MAUI framework aren’t available, and the components from Blazor products don’t work on all the platforms mentioned above. This is due to certain limitations of the .NET MAUI framework and the technology used in component development. Nevertheless, reports can be generated and displayed as exported results, for instance, as PDF files or HTML text. You can also share the exported report. To follow along with the example, you need to have the .NET Multi-platform App UI development framework installed. In the Visual Studio installer, the framework can be found under the Desktop & Mobile category.

STEP 1

First, create a new .NET MAUI Blazor Hybrid App project. For the target framework, it’s recommended to choose .NET 8, as it’s designated as an LTS (Long-Term Support) framework with extended lifecycle and support. Our products also support .NET 9.

STEP 2

After creating a demo .NET MAUI project, we will integrate Stimulsoft’s reporting functionality. To get started, install the required NuGet package for the reporting system — Stimulsoft.Reports.Blazor. If analytics functionality is also required, include the Stimulsoft.Dashboards.Blazor package as well.

STEP 3

Export commands for the report will be located on a separate page in the project. We will add this page in Step 5, but for now, let’s modify the navigation menu by adding a link. To do this, insert the following block of code in the Components/Layout/NavMenu.razor file:

NavMenu.razor

...
<div class="nav-item px-3">
	<NavLink class="nav-link" href="/export">
		<span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span>Export Report
	</NavLink>
</div>
...

STEP 4

You need to add report files to the project. These files can include report or dashboard template (*.mrt, *.mrz, *.mrx), as well as built report files (*.mdc, *.mdz, *.mdx). For example, add the SimpleList.mrt report template to the Resources/raw folder.

STEP 5

Next, you should add a page for exporting reports. Create a new file named Export.razor in the Components/Pages folder. In this example, three buttons will be added:

• The Export PDF button. Triggers the export of the report to a PDF file and opens it using the PDF viewer registered in the operating system.


• The Export HTML button. Triggers the export of the report to an HTML file and displays the report pages directly in the app.


• The Share PDF button. Triggers the export of the report to a PDF file and opens the "Share" menu available in the operating system.

NavMenu.razor

@page "/export"

@using Stimulsoft.Report;
@using Stimulsoft.Report.Blazor;
@using Stimulsoft.Report.Web;
@using Stimulsoft.Report.Export;
@using System.Text;

<button @onclick="@ExportPdf">Export PDF</button>
<button @onclick="@ExportHtml">Export HTML</button>
<button @onclick="@SharePdf">Share PDF</button>

<br /><br />
<div>@((MarkupString)HtmlContent)</div>

@code {
	private StiReport Report = new StiReport();
	private string HtmlContent = string.Empty;

	protected override async Task OnInitializedAsync()
	{
		var reportStream = await FileSystem.OpenAppPackageFileAsync("SimpleList.mrt");
		Report.Load(reportStream);
	}

	private void ShowHtmlReport()
	{
		var service = new StiHtmlExportService();
		service.RenderAsDocument = false;

		var settings = new StiHtmlExportSettings();

		using (var stream = new MemoryStream())
		{
			service.ExportHtml(Report, stream, settings);

			var buffer = stream.ToArray();
			HtmlContent = Encoding.UTF8.GetString(buffer);
		}
	}

	private async Task ExportDocument(StiExportFormat format, string fileName, bool shareFile = false)
	{
		if (Report == null) return;

		await Task.Run(() => Report.Render());

		if (format == StiExportFormat.Html)
		{
			ShowHtmlReport();
		}
		else
		{
			var filePath = Path.Combine(FileSystem.Current.CacheDirectory, fileName);
			using (var fileStream = new FileStream(filePath, FileMode.Create, FileAccess.Write))
			{
				Report.ExportDocument(StiExportFormat.Pdf, fileStream);
			}

			if (shareFile)
			{
				var file = new ShareFile(filePath);
				await Share.Default.RequestAsync(new ShareFileRequest(fileName, file));
			}
			else
			{
				var file = new ReadOnlyFile(filePath);
				await Launcher.OpenAsync(new OpenFileRequest(filePath, file));
			}
		}
	}

	private Task ExportPdf() => ExportDocument(StiExportFormat.Pdf, "Simple List.pdf");
	private Task ExportHtml() => ExportDocument(StiExportFormat.Html, "Simple List.html");
	private Task SharePdf() => ExportDocument(StiExportFormat.Pdf, "Simple List.pdf", true);
}