Visual Designer

1. Starting the Visual Designer
2. Brief Description of Docking Windows
3. Adding and Editing a Gauge
4. Testing a Digital Dashboard or Diagram
5. Adding Dashboard or Diagram to Application

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.

Starting the Visual designer.

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

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.
• Properties
  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.

Sub-Gauge Editor:

Scale Editor:

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 in a separate window and allow interaction with gauges whose property "Interactive Mode" was set to true in the 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:

   CBCGPVisualContainerCtrl m_wndContainer;
   ...
   m_wndContainer.GetVisualContainer()->LoadFromXML(IDR_DASHBOARD1);