Skip to main content

Explanation of terms

This chapter provides an introduction to common terms that appear in the AHMI IDE development process and later in this manual to help users understand the IDE development process as a whole.

IDE Project: An IDE project is a set of HMI projects on the web-based development environment (IDE), which can contain multiple pages. After editing and production can be online simulation debugging, simulating the real instrument screen display. After debugging is completed, a compressed package containing materials and UI action logic can be produced, and the project can be burned into the display using "one-key burning software". Similar to a PPT file.

Project: Project is a collection of one or more projects, the user can create multiple projects to categorize the project, easy to manage the project.

Page: IDE project a scene under the display effect of the tray, carrying the page background, window (the old version called canvas), view (the old version called sub-canvas), controls and the action logic between them. The project consists of a number of pages, which are the same size as the screen. Only one page can be displayed on the screen at a time. There are one or more pages in a project. Similar to a slide in a PPT file.

Window (called canvas in older versions): a window is an internal frame placed inside a page, a purely logical structure. Users need to add windows to the page before they can edit the UI. Each page has one or more windows, the window size is set by the user. Similar to a text/image box in a PPT.

View(old version called sub-canvas): the size of the view is equivalent to the window, itself is also a non-physical logical structure. Each window defaults to at least one view, you can continue to add multiple layers as needed. A view is the carrier of controls that enable editing of the interface. It is a face of the window, and when there are multiple views you can choose to display a particular piece of the view according to the set logic.

Control: the smallest unit of interface editing, according to the realization of the function is divided into buttons, dashboards, sliders, text boxes and so on. Users can add controls with corresponding functions on the view according to their needs, and the position, size, display texture, action and other properties of the controls can be edited.

Properties: Properties are descriptions of pages, windows, views, controls, the "Properties" column is located on the right side of the project editing interface, including the name, location, size, texture, animation, etc., in the selection of any page, window, view, control, the properties of the column will display its corresponding property information, the user through the editing of the properties, to achieve a variety of display effects. When any page, window, view or control is selected, the corresponding property information will be displayed in the property bar.

Resources: Resources are the image files uploaded to the cloud platform by users, the resource list is located on the right side of the project editing interface, the resources belong to the current project, and you need to upload them separately when you use the same resource in different projects.

Variable: Variable is a logical unit that can change the state. Variable can enable registers to realize the information transfer with external system; bind the variable with the control (or page, window), so as to realize the specific display effect of the control by modifying the variable value. Variables are located on the right side of the project editing interface. Note that each variable can be bound to more than one control, and each control can only be bound to one variable.

Timer: Timer is a special variable, you can set the start value, end value, timing step and other parameters of the timer variable to realize the animation effect by timer.

Font: Font bar is located on the right side of the interface, for the controls that can set text and numbers, such as "text box", "numbers", "buttons", you can set the font, size, font of text or numbers, and the size of the font. For controls that can set text and numbers, such as "Text Box", "Numbers", "Buttons", you can set the font, size, color, transparency and other display effects of text or numbers in the Font bar.

Texture: Texture is the display appearance of pages, windows, views, and controls. Users can set the texture as a single color or picture as needed. When setting a single color texture, users can directly select the color and transparency on the color picker; when setting an image texture, users need to upload image resources to the cloud in advance.

Actions: Actions are operations that can be triggered by a page, view, or control. For example, you can set the action of "jump to next page when pressed" for button control; set the action of "show speeding reminder when the display value is greater than 100" for dashboard control, and so on.

psd source file: The psd source file is the output of the Photoshop program, which is a layered, editable, unrasterized file.

PNG: Image file storage format, picture format with transparent background, generates small file size, lossless compression format.

BMP: the standard image file format in the Windows operating system, does not use any other compression, BMP files take up a lot of space.

JPG/JPEG: JPG full name is JPEG, no transparency, uses 24 bits to represent each pixel point, lossy compression format.