The Console Designer is a stand-alone application that allows for the simplified creation of the Console for TOP Layout through the use of a new and efficient interface.

The Designer is divided into four vertical sections:

1. Preview

The Preview section only shows the final appearance of the console. It is represented by the same UserControl that will be displayed in the CAD, providing an accurate representation. The only difference is that commands are not executed in the designer.

2. Palette

The Palette section allows you to manage different palettes within a console. It highlights the active one and allows customization of the following:

  • Palette Name
  • Background Color of the Palette
  • Background Color of the Palette Box
  • Text Color of the Palette Box

Using the side arrows, you can change the order of the Palettes.
With the Copy button, you can copy the current palette to the same or another console.
With the JSON button, you can view or modify the JSON of the current palette. Be cautious when manually editing the JSON of a palette.
The + and x buttons allow you to add or remove a palette.

3. Design

The Design section allows you to define the console, but in this case, the final graphic appearance is not displayed. Only the text is preserved to help identify the control in the preview window.
The design base is a grid of N rows and M columns.
Each cell in the grid can host a control, and the types of controls that can be defined are:

  • Empty: The cell remains empty (White)
  • Button: Button (Blue)
  • Static: A text container/separator (Gray)

Cells marked in Red indicate that the cell is occupied by the column span/row span of another cell, and therefore cannot be modified.
The current cell is highlighted in Aqua Green.
The choice of colors has been made to ensure the correct usage of the program, even for users with color blindness.

4. Tools

The Tools section allows you to edit the controls of the current palette.
This section is divided into three areas:

  • The first area allows you to define the grid cell. Here, you can change the type of control, command, and define the graphical parameters such as the span and height of the current cell.
  • The second area allows you to modify the image settings of the current cell.
  • The third area allows you to define in detail the text of the cell and its graphical characteristics.