Widget List

## Widget List

### Definition
Some page elements preset by Zhunyi are called widgets (controls). In the widget list, there are four major categories: Basic, Container, Layout, and Others. All these widgets can be easily dragged to the design window with the mouse for detailed design. (More useful widgets will be enriched in the future, please look forward to it)

![](/media/202603/2026-03-04_111039_0015130.23523902985024592.png)

> **Example Template**
>
> The example template is a configuration running UI example model arranged by Zhunyi Technology based on actual project desensitization. It provides users with one-click import for learning layout arrangement and UI design, providing a reference example for beginners to learn. Users can also design good-looking templates themselves and save them, so that they can be applied to other engineering projects.

### Basic Widgets

| Widget Name | Definition |
| --- | --- |
| [Image Widget](/doc/621)  | Presents the camera display window used in the flow to the running interface designed by the customer. Main menus include Zoom In Image, Zoom Out Image, and Best Fit Image. |
| [Run Control Widget](/doc/617) | The definition of run control is the same as the run button on the VG software, that is: continuously run all flows, including global flows. |
| [Button Widget](/doc/628) | The button widget is an interactive control. Users can trigger specific functions or commands by clicking and other operations. Such as opening a new page, running a certain flow, etc. |
| [Status Monitor Widget](/doc/618) | Mainly used for displaying the detection results of flows and modules. It can also be used for the detection of hardware interface status and software running status. Usually, the data type is BOOL. |
| [Label Widget](/doc/627) | A label is metadata of content, usually presented in the form of short text, symbols, or codes. Zhunyi Interface Software mainly interprets it as text form. The label can connect to a data source in the interface design module, and Zhunyi defines rich data source connection interfaces for customers to design. |
| [Condition Label Widget](/doc/673) |  |
| [BOOL Setting Widget](/doc/623) | Mainly used to display or control some BOOL value parameters or switches, such as turning on and off the soft keyboard, turning on or off the mask. Display hardware device status, such as camera connection status, whether it is connected or disconnected, etc. |
| [Integer Setting Widget](/doc/678) | The integer setting widget is mainly used to display or change global variables or flow module parameters with a numerical type of integer. |
| [Float Setting Widget](/doc/622) | The float setting widget is mainly used to display or change global variables or flow module parameters with a numerical type of floating-point number. |
| [String Setting Widget](/doc/624)| A widget for displaying and modifying data of string type. Currently, it is used most for modifying and displaying string variables in global variables. |
| [Dropdown Setting Control Widget](/doc/629) | It is a Graphical User Interface (GUI) control that allows users to select one or more values from a predefined list of options. It usually appears in a folded form and expands the option list when clicked or hovered. Currently, Zhunyi Visual Design only supports single-selection combo boxes. |
| [Integer Slider Widget](/doc/626) | The integer slider widget is mainly used to display or change global variables or flow module parameters with a numerical type of integer. This widget is similar to the [Integer Setting Widget](/doc/678), with only style differences. |
| [Float Slider Widget](/doc/625) | Same as [Float Setting Widget](/doc/622). |

### Container Widgets

| Widget Name | Definition |
| --- | --- |
| [Container Widget](/doc/630)  | It is a group box control without a title, a container that groups controls together. This control has layout attributes and can achieve the layout and design of controls on the page. It is more flexible and can also be quickly created through shortcut keys. |
| [Combo Box Widget](/doc/631)  | A container that groups controls together. This control has layout attributes and can achieve the layout and design of controls on the page. |
| [Tab Widget](/doc/634) | The tab widget is mainly used to add multiple tabs. This control can add more pages to display information that users want to display, without being limited by window size. |

### Layout Widgets

| Widget Name | Definition |
| --- | --- |
| [Vertical Layout Widget](/doc/638)  | Quickly achieve vertical layout of other controls. Just drag the controls that need vertical layout into this control. |
| [Horizontal Layout Widget](/doc/674)  | Quickly achieve horizontal layout of other controls. Just drag the controls that need horizontal layout into this control. |
| [Horizontal Spacer Widget](/doc/632) | It is an invisible control used for layout management. Its main function is to fill blank space or push controls to maintain specific alignment. It does not belong to visible interface elements, but can significantly affect the dynamic adjustment of the layout. |
| [Vertical Spacer Widget](/doc/679) | It is an invisible control used for layout management. Its main function is to fill blank space or push controls to maintain specific alignment. It does not belong to visible interface elements, but can significantly affect the dynamic adjustment of the layout. |

### Other Widgets
| Widget Name | Definition |
| --- | --- |
| [Login Widget](/doc/633)  | Provides permission display and permission switching functions, and can customize some event triggers. The permissions of the VG3 running interface are consistent with those of the editing interface, which are Administrator, Engineer, and Operator respectively. |
| [Image Box Widget](/doc/640)  | Can freely insert images to enrich the customer's software interface, such as adding some icons or company logos. |
| [Log Widget](/doc/635)  | The log widget can display 5 types of log information during operation, including Basic, Software Tips, Function, Communication, and Monitor. |
| [Pie Chart Widget](/doc/636)  | Data pie chart presentation mode. For data, the running interface provides various chart presentation methods, making the user running interface more competitive. |
| [Bar Line Chart Widget](/doc/637)  | Data bar line chart presentation mode. For data, the running interface provides various chart presentation methods, making the user running interface more competitive. |
| [Static Table Widget](/doc/645)  | Data static table presentation mode. For data, the running interface provides various chart presentation methods, making the user running interface more competitive. |
| [Dynamic Table Widget](/doc/639)  | Data dynamic table presentation mode. For data, the running interface provides various chart presentation methods, making the user running interface more competitive. |
| [Circular Progress Widget](/doc/644)  | Data progress display control, which can monitor the progress change of a certain value. Commonly used for CPU, memory or other progress monitoring. |

---

Click here to jump to the corresponding Chinese manual page: [Widget List](/doc/339)