Files
engine/docs/en/interface/inspector.md
2024-07-17 14:03:06 +08:00

5.2 KiB

order, title, type, group, label
order title type group label
4 Inspector Panel Basics Interface Basics/Interface

The Inspector Panel is located on the right side of the editor and is the most commonly used panel while using the editor. Depending on what you have currently selected, the Inspector Panel will display the corresponding properties. You can use the Inspector Panel to edit almost everything in the scene, such as scenes, entities, components, assets, and more.

image-20240122144004260
Scene Inspector
image-20240122144102202
Entity Inspector
image-20240122144141450
Asset Inspector

Property Types

The properties in the Inspector Panel can be divided into two main categories:

  • Basic Value Types: Number adjustments, color selection, property toggles, etc.
  • Reference Types: Usually resources, such as material selection, texture selection, etc.

Number Adjustments

There are many number adjustment entries available in the Inspector. For different properties, the range of numbers that can be adjusted and the size of each adjustment may vary. The most typical example is adjusting the position, rotation, and scale values of the Transform component.

You can quickly adjust the size of numbers by dragging the slider on the right side of the input box. While dragging, holding down (or ctrl on Windows) allows for more precise adjustments to the numbers (precision is 1/10 of the original step).

image-20240318175444343

Some adjustable properties appear in the form of sliders. You can drag the slider to quickly adjust the size of numbers, such as the Intensity of a light. Similarly, while dragging the slider, holding down (or ctrl on Windows) allows for more precise adjustments to the numbers.

image-20240318175518354

There are also number adjustment properties that appear in the form of input boxes and buttons, such as the Near Plane of a shadow. These properties often have more precise step sizes (such as 0.1, 1, 10). Clicking the button directly increases or decreases the value by the step length.

image-20240318175638055

Color Panel

Some properties need color adjustments, such as lighting, scene background color, or the self-illuminating color of materials. To adjust colors, you need to click on the color button on the left to bring up the color picker. In the color picker, you can use HUE to select colors, adjust the color's transparency; you can also adjust the specific RGBA values of the color in the input box. Click the image-20230926110451443 button to switch between HSLA, RGBA, and HEXA modes.

image-20240318175748734

Asset Selection Popup

Some properties need to reference the required assets. In this case, you can click on the input box of the asset selector to bring up the asset selection popup. Different properties require different types of assets, but the asset selector has already been pre-configured with the corresponding filters, so you can select directly.

The asset selection popup also provides a search box that you can use to find the corresponding assets more accurately.

image-20240122143554973
Mesh Asset Picker
image-20240122134039213
Texture Asset Picker