1. apireference
2. gui
3. imagebutton

ImageRectSize

Property of: ImageButton

Value Type: Vector2

---

Code Samples

---

Image Animation using Spritesheet

This code sample uses ImageRectOffset/ImageRectSize in order to play an animation of a man throwing a punch

-- Place this in an ImageLabel/ImageButton with size 256x256
local imageLabel = script.Parent

-- The following image is 1024x1024 with 12 frames (256x256)
-- The frames play an animation of a man throwing a punch
imageLabel.Image = "rbxassetid://848623155"
imageLabel.ImageRectSize = Vector2.new(256, 256)

-- The order of the frames to be displayed (left-to-right, then top-to-bottom)
local frames = {
	Vector2.new(0, 0); Vector2.new(1, 0); Vector2.new(2, 0); Vector2.new(3, 0);
	Vector2.new(0, 1); Vector2.new(1, 1); Vector2.new(2, 1); Vector2.new(3, 1);
	Vector2.new(0, 2); Vector2.new(1, 2); Vector2.new(2, 2); Vector2.new(3, 2);
}

-- Animate the frames one at a time in a loop
while true do
	for i = 1, #frames do
		imageLabel.ImageRectOffset = frames[i] * imageLabel.ImageRectSize
		wait(.1)
	end
end

Image ScaleType Demo

This code sample demonstrates the different ScaleType options - Stretch, Tile and Slice. It does this by resizing an ImageLabel/ImageButton in a circle.

local imageLabel = script.Parent

-- Set the source image to be a 64x64 padlock
imageLabel.Image = "rbxassetid://284402752"
imageLabel.BackgroundTransparency = 0
imageLabel.BackgroundColor3 = Color3.new(1, 1, 1) -- White
imageLabel.ImageColor3 = Color3.new(0, 0, 0) -- Black

local function resizeInACircle()
	for theta = 0, 2, .02 do
		imageLabel.Size = UDim2.new(
			0, 100 + math.cos(theta*2*math.pi) * 50,
			0, 100 + math.sin(theta*2*math.pi) * 50
		)
		wait()
	end
end

while true do
	-- Stretch simply stretches the source image to fit
	-- the UI element's space
	imageLabel.ScaleType = Enum.ScaleType.Stretch
	resizeInACircle()	
	-- Tile will render the source image multiple times
	-- enough to fill the UI element's space
	imageLabel.ScaleType = Enum.ScaleType.Tile
	imageLabel.TileSize = UDim2.new(0, 64, 0, 64)
	resizeInACircle()	
	-- Slice will turn the image into a nine-slice UI.
	imageLabel.ScaleType = Enum.ScaleType.Slice
	imageLabel.SliceCenter = Rect.new(30, 30, 34, 34)
	resizeInACircle()	
end