Skip to main content
.NET 5.0+

Dashboards Module

  • 5 minutes to read

The Dashboards Module allows you to integrate DevExpress Dashboard controls into WinForms, ASP.NET Web Forms, and ASP.NET Core Blazor XAF applications.

Dashboards_XCRM

The Dashboards Module is demonstrated in the Dashboards section of the Feature Center application. The Feature Center demo is installed in %PUBLIC%\Documents\DevExpress Demos 21.2\Components\eXpressApp Framework\FeatureCenter. The ASP.NET Web Forms version of this demo is available online at https://demos.devexpress.com/XAF/FeatureCenter/.

Dashboards Module Capabilities

For users

For developers

  • Create dashboards at runtime and persist them. Dashboards are stored with other business objects in the application database.
  • View and modify existing dashboards in the Dashboards List View. You can use the Dashboards navigation item to invoke this View.
  • Create predefined dashboards that are available to users after an application’s deployment.
  • Create navigation items associated with individual dashboards.
  • Customize the dashboard’s control options and behavior.

Note

The DashboardView and Dashboard Module are different XAF concepts. Dashboard Views display multiple XAF Views in a single Frame - they do not use DevExpress Dashboard controls.

Dashboards Module Components

Modules

Platform Module
Platform-agnostic DashboardsModule
WinForms DashboardsWindowsFormsModule
ASP.NET Web Forms DashboardsAspNetModule
ASP.NET Core Blazor DashboardsBlazorModule

Integrated DevExpress Controls

  • DashboardDesigner - used to design dashboards in a WinForms application.
  • DashboardViewer - used to view dashboards in a WinForms application.
  • ASPxDashboard - used to view and create dashboards in an ASP.NET Web Forms application.
  • DxDashboard - used to view and create dashboards in an ASP.NET Core Blazor application.

Note

You cannot localize the ASPxDashboard control in the Model Editor because it does not have a corresponding Localizer Object. For more information, refer to the following help topic: Dashboard | Localization.

View Items

The Dashboards Module uses the following View Items to host dashboard controls in WinForms, ASP.NET Web Forms, and ASP.NET Core Blazor XAF applications:

Application Model Extensions

The Dashboards Module extends the Application Model with the IModelDashboardNavigationItem node and adds the IModelClassDashboardsVisibility.IsVisibleInDashboards property to the IModelClass node.

Dashboard Data Type

The Module uses the following built-in business objects (entities) that implement the IDashboardData interface to store dashboards:

You can also use a custom dashboard data type. To do this, inherit DashboardData or implement the IDashboardData interface and pass the implemented type to the DashboardsModule.DashboardDataType property.

Tip

To display the DashboardData object’s Detail View, use a technique listed in the following help topic: Ways to Show a View.

Add the Dashboards Module to Your Application

Follow the steps below to add the Dashboards Module to your application. If you added this Module when you created an XAF application, the Solution Wizard generates the code demonstrated in this section automatically.

  1. Add the platform-agnostic and required platform-specific NuGet packages from the following table:

    Package

    Project

    DevExpress.ExpressApp.Dashboards

    platform-agnostic module project
    (MySolution.Module)

    DevExpress.ExpressApp.Dashboards.Blazor

    Blazor-specific module project
    (MySolution.Blazor.Server)

    DevExpress.ExpressApp.Dashboards.Win

    WinForms-specific module project
    (MySolution.Win)

    DevExpress.ExpressApp.Dashboards.Web

    ASP.NET Web Forms-specific module project
    (MySolution.Web)

  2. In the application constructor, add the platform-agnostic and platform-specific Dashboards Modules to the Modules collection:

    WinForms
    File: MySolution.Win\WinApplication.cs.

    using DevExpress.ExpressApp.Dashboards;
    using DevExpress.ExpressApp.Dashboards.Win;
    // ...
    public partial class MySolutionWindowsFormsApplication : WinApplication {
        public MySolutionWindowsFormsApplication() {
            // ...
            Modules.Add(new DashboardsModule() { 
                // uncomment the following line in EF Core-based applications
                // DashboardDataType = typeof(DevExpress.Persistent.BaseImpl.EF.DashboardData) 
            });
            Modules.Add(new DashboardsWindowsFormsModule());
        }
        // ...
    }
    

    ASP.NET Web Forms
    File: MySolution.Web\WebApplication.cs.

    using DevExpress.ExpressApp.Dashboards;
    using DevExpress.ExpressApp.Dashboards.Web;
    // ...
    public partial class MySolutionAspNetApplication : WebApplication {
        public MySolutionAspNetApplication() {
            // ...
            Modules.Add(new DashboardsModule() { 
                // uncomment the following line in EF 6-based applications
                // DashboardDataType = typeof(DevExpress.Persistent.BaseImpl.EF.DashboardData) 
            });
            Modules.Add(new DashboardsAspNetModule());
        }
        // ...
    }
    

    ASP.NET Core Blazor
    File: MySolution.Blazor.Server\BlazorApplication.cs.

    using DevExpress.ExpressApp.Dashboards;
    using DevExpress.ExpressApp.Dashboards.Blazor;
    // ...
    public partial class MySolutionBlazorApplication : BlazorApplication {
        public MySolutionBlazorApplication() {
            // ...
            Modules.Add(new DashboardsModule() { 
                // uncomment the following line in EF Core-based applications
                // DashboardDataType = typeof(DevExpress.Persistent.BaseImpl.EF.DashboardData) 
            });
            Modules.Add(new DashboardsBlazorModule());
        }
        // ...
    }
    

    Tip

  3. In EF Core-based applications, include the DashboardData entity in the data model:

    File: MySolution.Module\BusinessObjects\MySolutionDbContext.cs.

    using DevExpress.Persistent.BaseImpl.EF;
    // ...
    public class MySolutionEFCoreDbContext : DbContext {
        // ...
        public DbSet<DashboardData> DashboardData { get; set; }
        // ...
    }
    
  4. In ASP.NET Core Blazor applications, do the following in the MySolution.Blazor.Server\Startup.cs file:

    • In the Startup.ConfigureServices method, call the AddXafDashboards method to register Dashboards Module services.
    • In the Startup.Configure method, call the MapXafDashboards method to configure endpoints for the Dashboards Module.
    using DevExpress.ExpressApp.Dashboards.Blazor;
    // ...
    public class Startup {
        // ...
        public void ConfigureServices(IServiceCollection services){
            //...
            services.AddXafDashboards();
        }
        public void Configure(IApplicationBuilder app, IWebHostEnvironment env) {
            // ...
            app.UseEndpoints(endpoints => {
                endpoints.MapXafDashboards();
                // ...
            }
        }
    }
    
See Also