Skip to main content
You are viewing help content for pre-release software. This document and the features it describes are subject to change.
All docs
V26.1
  • Use BI Dashboard Project and Form Templates

    • 6 minutes to read

    The VCL Template Kit ships with automatically installed Project and Form templates for the ExpressDashboards Suite. These templates are designed to reduce time spent on repetitive project and form setup as well as improve onboarding for new VCL developers and boost productivity in experienced teams.

    VCL Dashboards: Run and Test the Generated App

    Before You Begin

    Note

    Ensure that your development environment meets ExpressDashboards and ExpressReports prerequisites:

    1. Microsoft Windows 10 or newer.
    2. Embarcadero RAD Studio IDE 12.3 or newer (Community Edition IDEs are not supported).
    3. DevExpress VCL v26.1.x.
    4. The EdgeView2 SDK package installed from the GetIt package manager.

    Project Template

    The BI Dashboard Viewer Application template creates a single-form application project that contains a TdxDashboardControl component.

    To run the Application/Project Wizard, select the following item in the RAD Studio IDE menu:

    FileNewDevExpress VCL v26.1 Application/Project - Delphi

    VCL Dashboards — RAD Studio Menu Items for the VCL Template Kit

    VCL Dashboards: The "BI Dashboard Viewer Application" Template

    Select BI Dashboard Viewer Application in the Reporting & Data Analytics category and click Create Project.

    Result: Generated Project

    The TdxDashboardControl component occupies the main form area (the component’s Align property is set to alClient). The generated form is derived from the TdxForm class and encapsulates all best practices regarding app building for high-DPI multi-monitor environments.

    VCL Dashboards: A Generated Dashboard Viewer Project Example

    App Deployment Settings

    The generated BI Dashboard Viewer project includes a Windows 32-bit build target, including all preconfigured post-build events required for automatic WebView2 Loader deployment:

    VCL Dashboards: Project Settings for the Generated Project

    Tip

    You may need to manually add an extra build target (Windows 64-bit) and/or additional resources and dependencies according to your business needs and desired app functionality. Refer to the following help topics for detailed information in this regard:

    VCL Reports/Dashboard App Deployment

    Sample Data & Layout

    The TdxDashboardControl component is empty at design time. The generated project includes the main form’s OnCreate event handler that creates a TdxBackendInMemoryJSONConnection component to load a sample JSON data file (RevenueByIndustryData.json) located within the nested Data project folder.

    The same handler loads a sample dashboard layout from the RevenueByIndustryLayout.xml file located within the same Data folder.

    Run & Test the App

    Build and run the generated project. Check industry categories to filter data and use built-in UI elements to export dashboard content in any supported format.

    VCL Dashboards: Run and Test the Generated App

    Form Template

    The BI Dashboard Viewer Form template allows you to add a configured DevExpress form with a TdxDashboardControl component to an existing application.

    To run the Form/User Control Wizard, select the following item in the RAD Studio IDE menu:

    FileNewDevExpress VCL v26.1 Application/Project - Delphi

    VCL Dashboards — RAD Studio Menu Items for the VCL Template Kit

    VCL Dashboards: The "BI Dashboard Viewer Form" Template

    Select BI Dashboard Viewer Form in the Reporting & Data Analytics category and click Create Form.

    Result: Generated Form

    The template creates a child form derived from the TdxForm class. The TdxDashboardControl component occupies the form’s area similar to the main form created by the BI Dashboard Viewer Application template.

    VCL Dashboards: A Generated Dashboard Viewer Form Example

    Sample Data, Layout, and Deployment

    The added form loads the same sample data and layout on form creation as the BI Dashboard Viewer Application template. If the target project does not include post-build events required for WebView2 Loader deployment, the form template adds them automatically.

    Use the Generated Form

    The form template does not automatically associate the generated form with existing app functionality. You need to manually display the form in code. For example:

    uses
      uChildForm;  // Adds the generated form's unit explicitly
    
    procedure TMainForm1.cxDashboardDisplayButton1Click(Sender: TObject);
    begin
      ChildForm.Show;  // Displays the generated form
    end;
    

    Application Builder Options

    Application Builder is a universal application template that allows you to choose/combine multiple target business scenarios, and different UI layouts and navigation options. You can add one or multiple views with pre-configured DevExpress UI controls based on project requirements.

    The Application Builder template wizard contains two steps:

    Step 1 — Select Navigation Type

    This step allows you to select a navigation UI type (sidebar and/or tabbed MDI layout) designed to switch between multiple Views on the same application form:

    VCL Dashboards: Select a Navigation UI Type in the "Application Builder" Template

    Scroll the Application Builder pane down to select required Views (Step 2).

    Step 2 — Add Views to the Application

    Step 2 lists multiple options that allow you to add one or multiple Views dedicated to corresponding DevExpress UI controls.

    VCL Dashboards: Select Views in the "Application Builder" Template

    All available options are grouped into the following categories: All, Grid, TreeList, Chart, Reporting & Data Analysis, Scheduler, Word, Excel, and PDF. Select Reporting & Data Analytics to display Report and Dashboard Views.

    VCL Dashboards: The "Reporting & Data Analytics" Category in the "Application Builder" Template

    You can click individual Views to select or deselect them. All selected Views are added into the generated project once you click Create Project.

    Result: Generated Project

    The generated project includes a TdxNavBar control as a sidebar and selected View forms displayed as frames. Each View includes a Ribbon UI.

    VCL Dashboards: A Multi-View Application Example

    Individual application Views use the same sample data and layouts as corresponding standalone project templates. Similar to standalone Report and Dashboard templates, the Application Builder template automatically adds post-build events required for WebView2 Loader deployment.

    Next Steps

    Review the following tutorials to get started with the TdxDashboardControl component:

    Read Tutorial: Create a Dashboard
    Basic Tutorial. Follow this tutorial to create a simple dashboard application: set up a memory-based data source, load JSON data, create Bubble Map and Chart dashboard items, and bind them to data.
    Read Tutorial: Bind a Dashboard to FireDAC Data
    Follow this tutorial to create a dashboard and bind it to data using standard FireDAC components (TFDQuery and TFDConnection) shipped with the RAD Studio IDE.
    Read Tutorial: Bind a Dashboard to a Stored Procedure
    Follow this tutorial to create a dashboard, bind it to a parametrized stored procedure, and pass dashboard parameters to that procedure using the Dashboard Designer dialog at design time.
    See Also