Reference API Roblox

Engine API

Website

Related

Reference API Roblox

ImageLabel

A 2D user interface element that displays a single non-interactive image.

Member index 14

HistoryMember
645Image: ContentId
726ImageColor3: Color3
726ImageContent: Content
726ImageRectOffset: Vector2
726ImageRectSize: Vector2
726ImageTransparency: float
726IsLoaded: bool
726ResampleMode: ResamplerMode
726ScaleType: ScaleType
726SliceCenter: Rect
726SliceScale: float
726TileSize: UDim2
573SetEnableContentImageSizeChangedEvents(enabled: bool): null
inherited from GuiObject
726Active: bool
726AnchorPoint: Vector2
726AutomaticSize: AutomaticSize
726BackgroundColor3: Color3
726BackgroundTransparency: float
726BorderColor3: Color3
726BorderMode: BorderMode
726BorderSizePixel: int
726ClipsDescendants: bool
726Draggable: bool
726GuiState: GuiState
726InputSink: InputSink
726Interactable: bool
726LayoutOrder: int
726NextSelectionDown: GuiObject
726NextSelectionLeft: GuiObject
726NextSelectionRight: GuiObject
726NextSelectionUp: GuiObject
726Position: UDim2
726Rotation: float
726Selectable: bool
726SelectionImageObject: GuiObject
726SelectionOrder: int
726Size: UDim2
726SizeConstraint: SizeConstraint
726Visible: bool
726ZIndex: int
462TweenPosition(endPosition: UDim2, easingDirection: EasingDirection = Out, easingStyle: EasingStyle = Quad, time: float = 1, override: bool = false, callback: Function = nil): bool
713TweenPositionInternal(endPosition: UDim2, easingDirection: EasingDirection = Out, easingStyle: EasingStyle = Quad, time: float = 1, override: bool = false, callback: Function = nil): bool
462TweenSize(endSize: UDim2, easingDirection: EasingDirection = Out, easingStyle: EasingStyle = Quad, time: float = 1, override: bool = false, callback: Function = nil): bool
462TweenSizeAndPosition(endSize: UDim2, endPosition: UDim2, easingDirection: EasingDirection = Out, easingStyle: EasingStyle = Quad, time: float = 1, override: bool = false, callback: Function = nil): bool
713TweenSizeAndPositionInternal(endSize: UDim2, endPosition: UDim2, easingDirection: EasingDirection = Out, easingStyle: EasingStyle = Quad, time: float = 1, override: bool = false, callback: Function = nil): bool
713TweenSizeInternal(endSize: UDim2, easingDirection: EasingDirection = Out, easingStyle: EasingStyle = Quad, time: float = 1, override: bool = false, callback: Function = nil): bool
462DragBegin(initialPosition: UDim2)
462DragStopped(x: int, y: int)
483InputBegan(input: InputObject)
483InputChanged(input: InputObject)
483InputEnded(input: InputObject)
462MouseEnter(x: int, y: int)
462MouseLeave(x: int, y: int)
462MouseMoved(x: int, y: int)
462MouseWheelBackward(x: int, y: int)
462MouseWheelForward(x: int, y: int)
462SelectionGained()
462SelectionLost()
462TouchLongPress(touchPositions: Array, state: UserInputState)
462TouchPan(touchPositions: Array, totalTranslation: Vector2, velocity: Vector2, state: UserInputState)
462TouchPinch(touchPositions: Array, scale: float, velocity: float, state: UserInputState)
462TouchRotate(touchPositions: Array, rotation: float, velocity: float, state: UserInputState)
462TouchSwipe(swipeDirection: SwipeDirection, numberOfTouches: int)
462TouchTap(touchPositions: Array)
inherited from GuiBase2d
726AbsolutePosition: Vector2
726AbsoluteRotation: float
726AbsoluteSize: Vector2
726AutoLocalize: bool
726RootLocalizationTable: LocalizationTable
726SelectionBehaviorDown: SelectionBehavior
726SelectionBehaviorLeft: SelectionBehavior
726SelectionBehaviorRight: SelectionBehavior
726SelectionBehaviorUp: SelectionBehavior
726SelectionGroup: bool
525SelectionChanged(amISelected: bool, previousSelection: GuiObject, newSelection: GuiObject)
inherited from Instance
726Archivable: bool
726Capabilities: SecurityCapabilities
726IsInSandbox: bool
726Name: string
726Parent: Instance
726PredictionMode: PredictionMode
726Sandboxed: bool
726UniqueId: UniqueId
576AddTag(tag: string): null
573ClearAllChildren(): null
462Clone(): Instance
573Destroy(): null
486FindFirstAncestor(name: string): Instance
486FindFirstAncestorOfClass(className: string): Instance
486FindFirstAncestorWhichIsA(className: string): Instance
486FindFirstChild(name: string, recursive: bool = false): Instance
486FindFirstChildOfClass(className: string): Instance
486FindFirstChildWhichIsA(className: string, recursive: bool = false): Instance
486FindFirstDescendant(name: string): Instance
563GetActor(): Actor
486GetAttribute(attribute: string): Variant
462GetAttributeChangedSignal(attribute: string): RBXScriptSignal
631GetAttributes(): Dictionary
648GetChildren(): Instances
462GetDebugId(scopeLength: int = 4): string
707GetDescendants(): Instances
486GetFullName(): string
706GetStyled(name: string, selector: string?): Variant
657GetStyledPropertyChangedSignal(property: string): RBXScriptSignal
576GetTags(): Array
576HasTag(tag: string): bool
486IsAncestorOf(descendant: Instance): bool
486IsDescendantOf(ancestor: Instance): bool
664IsPropertyModified(property: string): bool
698QueryDescendants(selector: string): Instances
573Remove(): null
576RemoveTag(tag: string): null
664ResetPropertyToDefault(property: string): null
573SetAttribute(attribute: string, value: Variant): null
462WaitForChild(childName: string, timeOut: double): Instance
726children(): Instances
726clone(): Instance
726destroy(): null
726findFirstChild(name: string, recursive: bool = false): Instance
726getChildren(): Instances
726isDescendantOf(ancestor: Instance): bool
726remove(): null
462AncestryChanged(child: Instance, parent: Instance)
462AttributeChanged(attribute: string)
462ChildAdded(child: Instance)
462ChildRemoved(child: Instance)
462DescendantAdded(descendant: Instance)
462DescendantRemoving(descendant: Instance)
500Destroying()
657StyledPropertiesChanged()
726childAdded(child: Instance)
inherited from Object
726ClassName: string
726className: string
647GetPropertyChangedSignal(property: string): RBXScriptSignal
647IsA(className: string): bool
726isA(className: string): bool
647Changed(property: string)

Description

An ImageLabel renders a rectangle, like a Frame does, with an image asset. The display of the image can be manipulated through the ImageColor3 and ImageTransparency properties. To display only the image and hide the rectangle, set GuiObject.BackgroundTransparency to 1.

Advanced ImageLabel usage includes:

  • Tiled images can be created by setting ScaleType to ScaleType.Tile, then TileSize to the size of rendered tiles.

  • 9-slice images can be created by setting ScaleType to ScaleType.Slice, then SliceCenter to the center area of the 9‑slice image.

  • Sprite sheets can be implemented through the use of ImageRectOffset and ImageRectSize. Packing multiple images into one and using this property can make your experience's image assets load much quicker, especially if you use many small icons in your GUIs.

History 79

Members 14

Image

TypeDefault
ContentId

This property is a content-type property that should hold the asset ID of a decal or image uploaded to Roblox. It functions identically to Decal.Texture with regards to loading the image from Roblox. The rendered image can be modified using ImageColor3 and ImageTransparency.

History 4

ImageColor3

TypeDefault
Color3

This property determines how an image is colorized. When set to white, no colorization occurs. This property is very useful for reusing image assets; if the source image is completely white with transparency, you can set the entire color of the image at once with this property.

History 5

ImageContent

TypeDefault
Content

This property should hold an asset URI or a reference to an EditableImage object.

The asset URI can reference a decal or image uploaded to Roblox. It functions identically to Decal.Texture with regards to loading the image.

The rendered image will be colorized using ImageButton.ImageColor3. It is possible to make the image render as tiled, scaled to fit, or 9-sliced, by adjusting the ImageButton.ScaleType property.

History 6

ImageRectOffset

TypeDefault
Vector2

Allows the partial display of an image in conjunction with ImageRectSize. This property determines the pixel offset (from the top-left) of the image area to be displayed.

History 5

ImageRectSize

TypeDefault
Vector2

Allows the partial display of an image in conjunction with ImageRectOffset. This property determines the pixel size of the image area to be displayed. If either dimension is set to 0, the entire image is displayed instead.

History 5

ImageTransparency

TypeDefault
float

This property determines the alpha of a UI element's rendered image. A value of 0 is completely opaque and a value of 1 is completely transparent (invisible).

History 5

IsLoaded

TypeDefault
bool

This property indicates if the ImageLabel.Image property has finished loading from Roblox. Images declined by moderation will never load.

This property is not replicated. Its interface does not cross the network boundary.
This property is read-only. Its value can be read, but it cannot be modified.

History 5

Tags: [ReadOnly, NotReplicated]

ResampleMode

TypeDefault
ResamplerMode

Determines how the image looks when it is scaled. By default, the image smooths out texturing when displayed on the screen larger or smaller than its size in texture memory. When set to Enum.ResamplerMode.Pixelated, the image preserves the sharp edges of pixels.

History 3

ScaleType

TypeDefault
ScaleType

This property determines in what way an ImageLabel.Image is rendered when the UI element's absolute size differs from the source image's size.

By default, this property is ScaleType.Stretch which will simply stretch/compact the image dimensions so it fits the UI element's space exactly. Since transparent pixels are set to black when uploading to Roblox, transparent images should apply alpha blending to avoid a blackish outline around scaled images.

For ScaleType.Slice, the SliceCenter property will be revealed in the Properties window. This is for nine-slice UI: when scaling up, the corners will remain the source image size. The edges of the image will stretch to the width/height of the image. Finally, the center of the image will stretch to fill the center area of the image.

Finally, for ScaleType.Tile, the TileSize property will be revealed in the Properties window. This is for tiled images, where the size of each image tile is determined by the TileSize property.

History 7

SetEnableContentImageSizeChangedEvents

Parameters (1)
enabledbool
Returns (1)
null

History 2

SliceCenter

TypeDefault
Rect

This property sets the slice boundaries of a 9-sliced image when ScaleType is set to Enum.ScaleType.Slice. Please note that this property is only visible in the Properties window under this condition.

To learn more about 9-slice images, see UI 9 Slice Design.

History 7

SliceScale

TypeDefault
float

Scales the 9-slice edges by the specified ratio. This means that the edges around the 9-slice will grow as if you'd uploaded a new version of the texture upscaled. Defaults to 1.0.

See also ScaleType, SliceCenter, and SliceScale.

History 15

TileSize

TypeDefault
UDim2

This property sets the tiling size of the ImageLabel with a default of UDim2.new(1, 0, 1, 0). Tiling starts at the top-left corner of the image. This property is only active if the ScaleType for the ImageLabel is set to ScaleType.Tile.

History 5

Settings