ImageLabel

顯示已棄用項目

*此內容是使用 AI（Beta 測試版）翻譯，可能含有錯誤。若要以英文檢視此頁面，請按一下這裡。

一個 ImageLabel 渲染一個長方形，像 Frame 一樣，使用圖像素材。圖像的顯示可以通過 ImageColor3 和 ImageTransparency 屬性進行操縱。要顯示只有圖像並隱藏長方形，請將 GuiObject.BackgroundTransparency 設置為 1 。

高級使用包括：ImageLabel

  • 瓷磚圖像可以通過將 ScaleType 設置為 Enum.ScaleType.Tile 來創建，然後將 TileSize 設置為渲染瓷磚的大小。

  • 9片圖可以通過將 ScaleType 設置為 Enum.ScaleType.Slice 來創建，然後將 SliceCenter 設置為9片圖的中心區域。

  • Sprite 片可以通過使用 ImageRectOffset 和 ImageRectSize 來實現。將多個圖像包裝到一個中，並使用此屬性可以使你的體驗圖像資產載入速度更快，特別是如果你使用了許多小型圖示在你的使用者介面中。

概要

屬性

屬性 繼承自 GuiObject屬性 繼承自 GuiBase2d
檢視繼承自Instance的所有項目
檢視繼承自Object的所有項目

方法

方法 繼承自 GuiObject
檢視繼承自Instance的所有項目
檢視繼承自Object的所有項目

活動

活動 繼承自 GuiObject活動 繼承自 GuiBase2d
檢視繼承自Instance的所有項目
檢視繼承自Object的所有項目

屬性

Image

ContentId
平行讀取

此屬性是一種內容類型屬性，應該持有裝飾或圖像上傳到 Roblox 的資產 ID。它與 Roblox 的圖像載入相同功能，即 Decal.Texture 。渲染的圖像可以使用 ImageColor3 和 ImageTransparency 修改。

ImageColor3

Color3
平行讀取

此屬性決定圖像如何被彩色。當設為白色時，不會發生任何色化。此屬性對於重複使用圖像資產非常有用；如果來源圖像完全白色且透明，您可以一次設置圖像的整個顏色，使用此屬性。

ImageContent

Content
平行讀取

此屬性應包含 資產 URI 或指向 EditableImage 物件的參考。

資產 URI 可以指向 Roblox 上上傳的貼花或圖像。它與載入圖像相關的功能與 Decal.Texture 相同。

渲染的圖像將使用 ImageButton.ImageColor3 來色化。您可以通過調整 ImageButton.ScaleType 屬性來將圖像渲染為瓷磚、縮放以適應或 9 切割來顯示，以實現圖像縮放。

ImageRectOffset

Vector2
平行讀取

允許將圖像與 ImageRectSize 一起部分顯示。此屬性決定要顯示的圖像區域的像素偏移（從左上角開始）。

ImageRectSize

Vector2
平行讀取

允許將圖像與 ImageRectOffset 一起部分顯示。此屬性決定要顯示的圖像區域的像素大小。如果兩個維度都設為 0 ，則整個圖像會顯示。

ImageTransparency

number
平行讀取

此屬性決定了 UI 元素渲染圖像的 alpha。值 0 是完全不透明的，值 1 是完全透明的（隱形）。

範例程式碼

This code sample oscillates the ImageTransparency of an ImageLabel/ImageButton from 0 to 1 using a sine wave.

Oscillate ImageTransparency
local RunService = game:GetService("RunService")



local imageLabel = script.Parent



local function onRenderStep()

	-- Oscillate ImageTransparency from 0 to 1 using a sine wave

	imageLabel.ImageTransparency = math.sin(workspace.DistributedGameTime * math.pi) * 0.5 + 0.5

end



RunService.RenderStepped:Connect(onRenderStep)

IsLoaded

boolean
唯讀
未複製
平行讀取

此屬性表示 ImageLabel.Image 屬性是否已從 Roblox 完全載入。被管理員拒絕的圖像永遠不會載入。

範例程式碼

This code sample measures how long an ImageLabel or ImageButton takes to load an image. If the image was already loaded, this will be 0.

Image Load Time
local imageLabel = script.Parent



local startTime = workspace.DistributedGameTime



-- Wait for the image to load

while not imageLabel.IsLoaded do

	task.wait()

end



-- Measure and display how long it took to load

local deltaTime = workspace.DistributedGameTime - startTime

print(("Image loaded in %.3f seconds"):format(deltaTime))

ResampleMode

Enum.ResamplerMode
平行讀取

決定縮放圖像時的外觀。預設情況下，圖像在顯示於較大或較小的螢幕時會平滑紋理，使紋理記憶中的尺寸與螢幕上的尺寸相同。當設為 Enum.ResamplerMode.Pixelated 時，圖像會保留像素的鋒利邊緣。

ScaleType

Enum.ScaleType
平行讀取

此屬性決定在使用者介面元素的絕對尺寸與來源圖像的尺寸不同時，ImageLabel.Image是以何種方式渲染時，當源圖像的尺寸與絕對尺寸不同時。

預設情況下，此屬性為 Enum.ScaleType.Stretch ，它會簡單地伸展/縮小圖像尺寸，以便它完全符合 UI 元素的空間。透明畫素在上傳到 Roblox 時設為黑色，透明圖像應該應用Alpha混合以避免縮放後的圖像周圍有黑色邊緣。

對於 Enum.ScaleType.Slice , SliceCenter 屬性將在 屬性窗口 中顯示。這是九片 UI 的情況：當縮放時，角落將保持源圖像尺寸。圖像的邊緣將延伸到圖像的寬度/高度。最後，圖像的中心將伸展以填滿圖像的中心區域。

最後，對於 Enum.ScaleType.Tile ，TileSize 屬性將在 屬性窗口 中被揭示。這是用於瓷磚圖像，其每個圖像瓷磚的尺寸由 TileSize 屬性決定。

SliceCenter

Rect
平行讀取

此屬性設置 9 片切圖像的切割邊界，當 ScaleType 設為 Enum.ScaleType.Slice 時。請注意，此屬性只在此條件下才會在 屬性 視窗中顯示。

要了解更多關於9片圖像的信息，請參閱UI 9片設計。

SliceScale

number
平行讀取

以指定比率擴展 9 片邊。這意味著 9 片的邊緣會像你上傳了縮放的新版本的紋理一樣增長。預設為 1.0 。

也見 ScaleType , SliceCenter , 及 SliceScale .

TileSize

UDim2
平行讀取

此屬性設置了 ImageLabel 的瓷磚尺寸，默認值為 UDim2.new(1, 0, 1, 0) .瓷磚開始於圖像的左上角。此特性只有在 ScaleType 對於 ImageLabel 設置為 Enum.ScaleType.Tile 時才會啟用。

範例程式碼

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

Image ScaleType Demo
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, 0.02 do

		imageLabel.Size =

			UDim2.new(0, 100 + math.cos(theta * 2 * math.pi) * 50, 0, 100 + math.sin(theta * 2 * math.pi) * 50)

		task.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
檢視繼承自Instance的所有項目
檢視繼承自Object的所有項目

方法

檢視繼承自Instance的所有項目
檢視繼承自Object的所有項目

活動

檢視繼承自Instance的所有項目
檢視繼承自Object的所有項目