The current version of the Web Report Designer offers beyond-basics functionality, but is still under active development. Please give it a thorough review to make sure the designer fits your scenario before including it in a production project.
The Web Report Designer consists of the following areas:
Design surface - shows the design layout of the report. Provides tools for selecting, moving, resizing and editing the report items.
Menu area - provides buttons for creating a new report and opening, saving or previewing an already existing one. Also, allows switching between loaded reports and shows their save state.
Properties area - displays the properties of the selected report item. In case multiple items are selected, shows only the properties that are marked as "mergeable", in other words properties that can be applied to all items in the current selection. The list of the properties can be organized in categories or in alphabetical order.
Components - lists the available report components that can be added to the report. The items are organized in groups based on their type. The area supports two kinds of layout - grid and list. List is the default view.
Explorer - represents the report structure in a tree-like view. Allows the selection of the visual and non-visual report components and configures their properties.
The Web Report Designer uses a dedicated ASP.NET WebAPI REST service as a backend. The service is responsible for the storage operations like creating, opening or saving report definitions in a specified folder, as well as handling the various requests that concern server-side processing and rendering. The public methods of the service can be overwritten to adjust its functionality to a specific scenario.
The Web Report Designer can be integrated in any ASP.NET Web Application, both under .NET Framework 4.5.1+ or .NET Core 2.1+.
The following NuGet packages are required:
jQuery 3.3.1 or later.
Kendo UI 2020.3.1118 or later.
Telerik Report Viewer script. By default, it is requested from the service.
Web Report Designer script. By default, it is requested from the service.
All other scripts and styles will be provided by the Web Report Designer service when the designer widget is loaded. The list of loaded resources:
jQuery UI 1.12.1 library. We recommend using the version of jQuery UI subset that is served by the Web Report Designer service because it includes a fix related to the dragging and dropping components.
The subset includes Draggable, Droppable, Resizable and their dependencies.
The web report designer in our example is stylized using Roboto font. A link to a font of your preference can be added before creating the Web Designer widget on the page.