# Screen

The Screen Component defines the area and rendering of a user interface. Children added to a Screen Component should all have an Element Component.

See [Screens](https://developer.playcanvas.com/user-manual/user-interface/screens.md) for how screens work, and the [User Interface](https://developer.playcanvas.com/user-manual/user-interface.md) section for building interfaces with them.

[Image: Screen Component]

## Properties

| Property         | Description |
|------------------|-------------|
| Screen Space     | When enabled, the contents of the screen are rendered in 2D as an overlay to the canvas. |
| Resolution       | When Screen Space is disabled. The resolution of the screen coordinates (width and height). Screen coordinates increase as you move right and up. |
| Ref Resolution   | Screen Space only, when Scale Mode is Blend. The reference resolution used to calculate the scale factor (width and height). |
| Scale Mode       | Screen Space only. Determines how the user interface scales when the window size does not match the screen size. Options: None (no scaling), Blend (scales by ratio of reference to actual resolution). |
| Scale Blend      | Screen Space only, when Scale Mode is Blend. The weighting of scaling between horizontal (0) and vertical (1). |
| Priority         | Determines the order in which Screen Components in the same layer are rendered. Higher priority is rendered on top. Must be an integer between 0 and 127. |

## See Also

- [Element Component](https://developer.playcanvas.com/user-manual/editor/scenes/components/element.md) - UI elements that are children of the screen
- [Button Component](https://developer.playcanvas.com/user-manual/editor/scenes/components/button.md) - Interactive button elements
- [Screens](https://developer.playcanvas.com/user-manual/user-interface/screens.md) - Screen space and world space, resolution and scaling
- [User Interface](https://developer.playcanvas.com/user-manual/user-interface.md) - Learn more about building user interfaces

## Scripting Interface

You can control a Screen Component's properties using a [Script Component](https://developer.playcanvas.com/user-manual/editor/scenes/components/script.md). The Screen Component's scripting interface is [here](https://api.playcanvas.com/engine/classes/ScreenComponent.html).