BCGControlBar Pro for MFC
Visual Designer

The Visual Designer allows you quickly create and modify digital dashboards and diagrams for MFC applications. It generates XML files describing layout and properties of dashboard and diagram elements. The XML can be loaded and processed at the runtime whenever required to present an interactive digital dashboard and/or diagram to the end user.

This guide explains how to take advantage of the Designer tool.

Prerequisites.

First of all you have to create an MFC or BCGControlBar Pro -based application using the Application Wizard, or select an existing (MFC or BCGPro-based) application.

Note. If you select a pure MFC project, you'll need to perform some additional steps for migration from MFC to BCGControlBar Pro.

Starting the designer.

Run BCGVisualDesigner.exe application located in <BCGControlBar Pro (or BCGSuite) Installation Folder>\Designer folder. Now you can start creation of a new dashboard or diagram, or load the existing data file. The designer data is saved in files with extension "visual-bcgsoft".

Visual Designer

Brief Description of Docking Windows

  • Toolbox. The Toolbox window contains a list of Gauges and Diagram Elements that are supported by Visual Designer and can be dropped on the design surface at the design time.
  • Elements. The Elements window contains a list of Gauges and Diagram Elements located on the design surface. You can click an Element in the list to select an object on the design surface.
  • The Properties window allows to edit properties of selected objects. If no object is selected on the design surface, you can set properties of the visual container, such as background color.

Adding and Editing a Gauge

To add a new Gauge select the desired object from the Toolbox window and then click the design surface. Now you can drag the object to reposition it on the design surface, change its size and set its specific properties in the Properties window.

Right mouse click on the design surface or selected object brings up a context sensitive popup menu that allows you to add new objects, perform cut/copy/paste/delete operations and change Z order of selected objects.

Some Gauges support collections of sub-gauges and additional scales. The collections can be edited with Properties window - just click "Scales" or "Subgauges" property. It will bring up an additional dialog for collection editing:

Visual Designer
Visual Designer

Testing a Digital Dashboard or Diagram

When you want to see a dashboard in action select View | Run Test menu item. It will display your digital dashboard or diagram in a separate window and allow interaction with gauges whose property "Interactive Mode" was set to true in the designer.

Visual Designer

Adding Dashboard or Diagram to Application

  1. Save your XML file to the application RES folder (the default extension is "visual-bcgsoft").
  2. Import XML file to your resources. You need to specify "BCGP_VISUAL_XML" as resource type.
  3. Load XML into the visual container:
Copy
CBCGPVisualContainerCtrl m_wndContainer;
...
m_wndContainer.GetVisualContainer()->LoadFromXML(IDR_DASHBOARD1);