The panel component is used to add configurable panels to your user interface.
| Name |
Set the name of the Panel Used to identify Inputs & Outputs in the User Interface Node |
| Copy/Paste Style | Copy the current properties to the UI Editor clipboard or paste the properties currently saved in the clipboard to this Panel |
| Color | Set the color of the Panel |
| Shape | Set the shape of the panel from a list of preset shapes |
| Roundness | Set the roundness of the panel's corners *Only visible with shape set to Round Corners |
| Border Width | Set the width of the panel's border *Only visible with shape set to Round Corners |
| Border Color | Set the color of the panel's border *Only visible with shape set to Round Corners |
| Image | Set an image to be the texture of the shape *Only visible with shape set to Round Corners |
| Use Content Width or Height | Automatically set the width or height of the panel based on the size of components embedded within it |
| Inputs and Outputs | Open the Inputs and Outputs menu to select what Inputs and Outputs will be visible in the User Interface Node for this Image |
| Auto Alignment | Automatically update the Image's alignment as it is moved around the canvas to the nearest alignment point |
| Alignment | Set the screen region to align the Image with |
| Width/Height | Set the Width & Height of the Image |
| X/Y | Set the X & Y screen position relative to the set alignment point |
| Visible | Set the Image's visibility * Note that invisible images will not be visible during gameplay but will remain visible in the UI Editor canvas |
| Transition | Set how the Image should appear/disappear when it is made visible or invisible |
| Rotation | Set the rotation of the Image |
| Block Touches | Allow the panel to block touches of components or objects behind it |
| Clip to Screen Bounds | Do not allow the panel to be clipped by the edge of the screen |
Use inputs and outputs to send data into or out from your Panel.
Edit which Inputs & Outputs are enabled by tapping the Inputs & Outputs image in the Properties menu.
| Position X & Y | Input values to adjust the X or Y position of the progress bar |
| Rotation | Input values to adjust the rotation of the progress bar |
| ↳ As Degrees | Use input value as degrees |
| Scale | Input values to adjust the scale of the progress bar |
| Opacity | Input values to adjust the opacity of the progress bar |
| Colors | Input colors to change the colors of different parts of the progress bar |
| Visible | Input values to adjust the visibility of the progress bar |
| Collapsed | Make the progress bar invisible and adjust position of surrounding components to fill the empty space *Note: Only works if the progress bar is embedded in a vertical or horizontal layout |
| Position from World Vector | Input a world position vector to set the position of the panel on the screen |
| Border Width | Input a value to set the width of the panel border |
| Border Color | Input an index or color to set the color of the panel border |
| Add Widget | Input a widget to add to the layout |
| Remove Widget | Input a widget to remove from the layout |
Widgets are collections of components that can be added or removed from layouts while your game is running.