This documentation is for a prerelease version of O3DE. Click here to switch to the latest release, or select a version from the dropdown.

Version:

UI Image Component

You can use an Image component to add a color tint or texture to an element. Use the Properties pane of the UI Editor to configure the following settings for the Image component.

Image Settings

NameDescription
SpriteTypeSelect one of the following:
Sprite pathClick the browse () icon and select a suitable file. Click the open-in (arrow) icon next to Sprite path to open the Sprite Editor.
Render targetClick on the folder icon to select an attachment image asset.
IndexThe sprite sheet image index that the component will render.
ColorClick the color swatch to select a different color. Displays only if the SpriteType is Sprite/Texture asset and the image has been configured as a sprite sheet using the Sprite Editor.
AlphaUse the slider to choose an alpha value between 0 and 1.
Image typeSelect one of the following:
Blend ModeSelect one of the following:
Fill TypeSelect one of the following:
Fill AmountThe amount of the image to be filled, from 0.00 to 1.00.
Fill Start AngleThe start angle for the fill, measured in degrees clockwise from vertical.
Corner Fill OriginThe starting corner that the image is filled from. Select one of the following:
Edge Fill OriginThe edge from which the image is filled about (radial corner) or from (linear). Select one of the following:
Fill ClockwiseIf selected, the image is radially filled clockwise about the fill center.
Fill CenterIf selected, the center segment of a slice-resized sprite is visible.