To set up complex logic for your World, you may use custom UI.

This section provides instructions on how to add a custom UI panel to a World.

Step 1: Add Canvas and Basic Features

1. On the Hierarchy panel, right-click on the blank space and click "UI" > "Canvas". A canvas is then created, where you can preview custom UI in real time.

For details about Canvas, see Canvas.

2. Right-click "Canvas" > "Create Empty" to create an object named "CustomizeUI".

3. Right-click "CustomizeUI", click "UI" > "Image" to create an image and name it "bg", click "UI" > "Button - TestMeshPro" to create a button and name it "btn_Close", click "UI" > "Text - TextMeshPro" to create a text component and name it "Text_Tip", and click "UI" > "Input Field - TextMeshPro" to create a text input field and name it "Text_InputField".

A custom UI panel is then created with background, a text input field, and a close button. Various UI types are available in a World and they are different from official UI layers. The following table describes major UI types:

• As a creator, UGC UI and UI in a World can meet your demands. When creating a UI layer, adjusting its "Sort Order" to the recommended value will bring you best visual experience in the World.

We will explain how to add specific logic to these features below.

For details about the image component, see Image.
For details about the button component, see Button.
For details about the text component, see Text.
For details about the input field component, see Input Field.

Step 2: Write a Custom UI Script

1. Create a new script based on what you have learned in the last course and name it "CustomizeUI".
2. Open the CustomizeUI script, and define 3 variables: UIPanle, InputField, and CloseButton.

3. Write the logic for the panel display method.

4. Write the logic for the panel hiding method.

5. Configure the default text for the input box.

6. Click the CustomizeUI object to add Para Script and mount the CustomizeUI script.
7. Drag CustomizeUI, Text_InputField, and btn_Close components to the corresponding fields.

8. Add an onclick method by dragging in CustomizeUI and click "NoFunction" > "ParaScript" > "CallMethod(string)".

9. Enter ClosePanel in the method input box. This means that the UI panel will be hidden once you click the close button.
10. Drag CustomizeUI to the FirstWorld folder.

Finally, a basic custom UI panel is implemented.