Understanding Interface Composition

## Understanding Interface Composition

### Initial Interface

![](/media/202603//1772527484.673874.png)

### Widget List

Some page elements preset by Zhunyi are called widgets. 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. Detailed definitions and property settings for each widget will be given in Section 1.4.

### Object List

All interface widget elements, such as pages, buttons, labels, combo boxes, are considered as objects by the program. When a widget is dragged from the widget list to the design window, the object is created. The object window will generate a corresponding unique object ID. For detailed introduction, please refer to [Object List](/doc/616).

### Main Menu

Manages global operations for the designed interface, such as common Save, Open, Preview, Alignment, Undo, Redo, etc. For detailed introduction, please refer to [Main Menu](/doc/672).

### Design Window

The main area for user operations. This design area is defined as a page. Initially entering the system will automatically create a Main page (Home page). Users can add or delete pages according to their design needs. However, the Main page is system-level and cannot be deleted. For detailed introduction, please refer to [Design Window](/doc/614/#h2-DesignWindow).

### Property List

Features possessed by widgets and pages. Widget features can be adjusted in this module to change the appearance and events of the widget. Appearance includes size, color, position, etc. Events include click, close, popup, etc. For detailed introduction, please refer to [Property List](/doc/614/#h2-PropertyList).

### Event Script

The event script area displays all event functions set in the interface design. The code language is Lua. If the customer has vision engineers, they can use Lua scripts to flexibly edit the interface. For more script editing functions, please refer to Chapter 3. This is just event script code. For detailed introduction to event scripts, please refer to [Event Script](/doc/614/#h2-EventScript).

---

Click here to jump to the corresponding Chinese manual page: [Understanding Interface Composition
](/doc/334)