Skip to main content
.NET 6.0+

Access the Dashboard Control

  • 5 minutes to read

This topic describes how to access the DashboardViewer control in a WinForms application, ASPxDashboard control in an ASP.NET Web Forms application, and the DxDashboard component model in an ASP.NET Core Blazor application.

Note

Refer to the following help topic for information on how to access the DashboardDesigner control: How to: Access the WinForms Dashboard Designer.

Important

Before you proceed, ensure that your platform-specific module (if exists) or application project (in solutions without the platform-specific Module project) references the corresponding assemblies or NuGet packages:

  • WinForms: the DevExpress.Dashboard.v23.2.Win.dll and DevExpress.ExpressApp.Dashboards.Win.v23.2.dll assemblies;
  • ASP.NET Web Forms: the DevExpress.Dashboard.v23.2.Web.dll and DevExpress.ExpressApp.Dashboards.Web.v23.2.dll assemblies;
  • ASP.NET Core Blazor: the DevExpress.ExpressApp.Dashboards.Blazor.23.2 NuGet package.

WinForms and ASP.NET Web Forms Applications

To access the dashboard control, follow the steps below in the WinForms and ASP.NET Web Forms module project (MySolution.Module.Win, MySolution.Module.Web). If your solution does not contain the WinForms module project, follow the steps in the application project (MySolution.Win).

  1. Add a Controller that activates for IDashboardData Detail Views.
  2. In the Controller’s OnActivated method, use the CompositeView.FindItem method to find the View Item with the “DashboardViewer” identifier.
  3. Handle the ViewItem.ControlCreated event and use the WinDashboardViewerViewItem.Viewer (WinForms) or WebDashboardViewerViewItem.DashboardControl property (ASP.NET Web Forms) to access the dashboard control.

WinForms

File:
MySolution.Win\Controllers\WinDashboardController.cs in solutions without the WinForms-specific module project. MySolution.Module.Win\Controllers\WinDashboardController.cs(.vb) in solutions with the WinForms-specific module project.

using System;
using DevExpress.DashboardWin;
using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Dashboards.Win;
using DevExpress.Persistent.Base;
// ...
public class WinDashboardController : ObjectViewController<DetailView, IDashboardData> {
    private WinDashboardViewerViewItem dashboardViewerViewItem;
    protected override void OnActivated() {
        base.OnActivated();
        dashboardViewerViewItem = View.FindItem("DashboardViewer") as WinDashboardViewerViewItem;
        if(dashboardViewerViewItem != null) {
            if(dashboardViewerViewItem.Viewer != null) {
                CustomizeDashboardViewer(dashboardViewerViewItem.Viewer);
            }
            else {
                dashboardViewerViewItem.ControlCreated += DashboardViewerViewItem_ControlCreated;
            }
        }
    }
    private void DashboardViewerViewItem_ControlCreated(object sender, EventArgs e) {
        CustomizeDashboardViewer(((WinDashboardViewerViewItem)sender).Viewer);
    }
    private void CustomizeDashboardViewer(DashboardViewer dashboardViewer) {
        dashboardViewer.AllowPrintDashboardItems = true;
    }
    protected override void OnDeactivated() {
        if(dashboardViewerViewItem != null) {
            dashboardViewerViewItem.ControlCreated -= DashboardViewerViewItem_ControlCreated;
            dashboardViewerViewItem = null;
        }
        base.OnDeactivated();
    }
}

ASP.NET Web Forms

File: MySolution.Module.Web\Controllers\WebDashboardController.cs(.vb).

using System;
using DevExpress.DashboardWeb;
using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Dashboards.Web;
using DevExpress.Persistent.Base;
// ...
public class WebDashboardController : ObjectViewController<DetailView, IDashboardData> {
    private WebDashboardViewerViewItem dashboardViewerViewItem;
    protected override void OnActivated() {
        base.OnActivated();
        dashboardViewerViewItem = View.FindItem("DashboardViewer") as WebDashboardViewerViewItem;
        if(dashboardViewerViewItem != null) {
            if(dashboardViewerViewItem.DashboardControl != null) {
                SetHeight(dashboardViewerViewItem.DashboardControl);
            }
            else {
                dashboardViewerViewItem.ControlCreated += DashboardViewerViewItem_ControlCreated;
            }
        }
    }
    private void DashboardViewerViewItem_ControlCreated(object sender, EventArgs e) {
        SetHeight(((WebDashboardViewerViewItem)sender).DashboardControl);
    }
    private void SetHeight(ASPxDashboard dashboardControl) {
        dashboardControl.Height = 760;
    }
    protected override void OnDeactivated() {
        if(dashboardViewerViewItem != null) {
            dashboardViewerViewItem.ControlCreated -= DashboardViewerViewItem_ControlCreated;
            dashboardViewerViewItem = null;
        }
        base.OnDeactivated();
    }
}

ASP.NET Core Blazor Applications

To access the DxDashboard component model, follow the steps below in the ASP.NET Core Blazor module project (MySolution.Module.Blazor). If your solution does not contain this project, follow the steps in the application project (MySolution.Blazor.Server). A component model is the representation of a Blazor component in code. When you modify the model, the underlying component reflects these changes. Refer to the following help topic for more information on component models: Underlying Controls and Components Behind UI Elements (ASP.NET Core Blazor).

  1. Add a Controller activated in the IDashboardData Detail Views.
  2. In the Controller’s OnActivated method, use the CustomizeViewItemControl<T>(DetailView, Controller, Action<T>) extension method to customize the BlazorDashboardViewerViewItem before the DxDashboard component is rendered. Declare the additional CustomizeDashboardViewerViewItem method and customize the View Item in it.
  3. In the CustomizeDashboardViewerViewItem method, cast the View Item’s Control property value to DevExpress.ExpressApp.Dashboards.Blazor.Components.DxDashboardViewerAdapter and access its ComponentModel property.

The following example demonstrates how to set the default dashboard working mode to Designer.

File:
MySolution.Blazor.Server\Controllers\BlazorDashboardController.cs in solutions without the ASP.NET Core Blazor-specific module project. MySolution.Module.Blazor\Controllers\BlazorDashboardController.cs(.vb) in solutions with the ASP.NET Core Blazor-specific module project.

using DevExpress.DashboardWeb;
using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Dashboards.Blazor.Components;
using DevExpress.ExpressApp.Dashboards.Blazor.Components.Models;
using DevExpress.Persistent.Base;
// ...
public class BlazorDashboardController : ObjectViewController<DetailView, IDashboardData> {
    protected override void OnActivated() {
        base.OnActivated();
        View.CustomizeViewItemControl<BlazorDashboardViewerViewItem>(this, CustomizeDashboardViewerViewItem);
    }
    void CustomizeDashboardViewerViewItem(BlazorDashboardViewerViewItem dashboardViewerViewItem) {
        if(dashboardViewerViewItem.Control is DxDashboardViewerAdapter dashboardViewerAdapter) {
            SetWorkingMode(dashboardViewerAdapter.ComponentModel);
        }
    }
    private void SetWorkingMode(DxDashboardModel dxDashboardModel) {
        dxDashboardModel.WorkingMode = WorkingMode.Designer;
    }
}
See Also