Editor

When creating split-screen programs and H5 programs, you will enter the editor for program production.

1. In the top left corner, the program name is displayed, and double-clicking allows for modification.
2. On the left side, there is a menu area with options such as images, videos, music, components, text, background, screen stickers, effects, etc.
3. Select materials from these menus, drag them to the central canvas.
4. Click on the canvas properties to view canvas orientation, resolution, etc.
5. Undo: Revert the last operation; Redo: Restore the last operation; Clear: Clear all content on the current canvas.
6. The right side displays options for the selected material.
7. Save Only: Save the program to the program list; Save and Publish: This program will be saved in the program list and enter the program publishing page.

Images

1. Drag and drop the desired image material onto the white canvas area. Adjust the size of the image, and use the keyboard delete key to remove materials from the canvas.
2. On the right side, set position, size, transparency, and other styles.
3. You can set entrance animations, emphasis animations, exit animations, etc.

4. Images can be set to play for a specific duration on the page, with a default of 30 seconds.

5. Layers: Each material is a layer that can be shown/hidden, locked, duplicated, etc.
6. Right-clicking on a material allows for operations such as bringing to the top, sending to the bottom, moving up, moving down, etc.

Videos

1. Drag and drop the desired video material onto the white canvas area.
2. On the right side, set position, size, transparency, and other styles.

3. The default duration for the video page is the total duration of the video, and it is not recommended to modify it.

Music

1. Drag and drop the desired music onto the white canvas area. It can be placed anywhere; the terminal device won't display a music icon. The music will play as the background music for the program in a loop.

Components

Image Carousel

1. Drag the image carousel component onto the white canvas area and adjust its display size.
2. On the right side, component settings allow you to add or remove images in the carousel, set transition animations, interval time between images, etc.

Web Page

1. Drag the web page component onto the white canvas area and adjust its display size.
2. On the right side, in the component settings, enter the web page address.

Video Carousel

1. Drag the video carousel component onto the white canvas area and adjust its display size.
2. On the right side, component settings allow you to add or remove videos/images in the carousel.

Hualala Calling System

1. Drag the queue calling system component onto the white canvas area. This component defaults to full-screen display and cannot be resized.
2. On the right side, in the calling system settings, enter the IP address and API port number of the cash register system.

Text

1. Drag the text from the left to the white canvas area. Double-click to modify the text content.
2. On the right side, in the general settings, you can set the position and transparency of the text.
3. Text Editing: You can change the font, font size, text color, letter spacing, text alignment, horizontal/vertical display, bold, italic, underline, strikethrough, etc.
4. Animation Effects: You can set entrance animations, emphasis animations, and exit animations for the text.

Background

1. You can choose a color as the background color.
2. You can choose uploaded background materials as the background. The background cannot be deleted.

Screen Stickers

1. You can upload labels such as "Sold Out" or "New Product Launch" to screen stickers, creating well-designed posters.
2. On the device side, clicking the top left corner three times with a mouse can bring up the screen sticker function, allowing for quick content changes.

Effects

Click on the respective effect to apply it to the program.