ImageLabel

Visualizza obsoleti

*Questo contenuto è tradotto usando AI (Beta) e potrebbe contenere errori. Per visualizzare questa pagina in inglese, clicca qui.

Un ImageLabel rende un rettangolo, come un Frame fa, con una risorsa di immagine.La visualizzazione dell'immagine può essere manipolata attraverso le proprietà ImageColor3 e ImageTransparency.Per visualizzare solo l'immagine e nascondere il rettangolo, imposta GuiObject.BackgroundTransparency a 1.

L'uso avanzato di ImageLabel include:

  • Le immagini piastrellate possono essere create impostando ScaleType a Enum.ScaleType.Tile , quindi TileSize alla dimensione delle piastrelle rendulate.

  • le immagini a 9 strati possono essere create impostando ScaleType a Enum.ScaleType.Slice , quindi SliceCenter nell'area centrale dell'immagine a 9 strati.

  • Le foglie di sprite possono essere implementate attraverso l'uso di ImageRectOffset e ImageRectSize .Raccogliere più immagini in una e utilizzare questa proprietà può rendere le risorse dell'immagine della tua esperienza caricare molto più rapidamente, soprattutto se utilizzi molte piccole icone nelle tue interfacce utente.

Sommario

Proprietà

  • Image:ContentId
    Lettura Parallela

    Il contenuto dell'immagine visualizzato dall'elemento UI. Legge e scrive a ImageContent .

  • Lettura Parallela

    Determina come verrà colorata un'immagine rendere.

  • Lettura Parallela

    Il contenuto dell'immagine visualizzato dall'elemento UI. Supporta URI di risorse e EditableImage.

  • Lettura Parallela

    Lo spostamento in pixel della sottocarea di un'immagine da mostrare.

  • Lettura Parallela

    Determina la dimensione in pixel della sott area di un'immagine da mostrare.

  • Lettura Parallela

    Determina la trasparenza dell'immagine renderta.

  • Sola Lettura
    Non Replicato
    Lettura Parallela

    Indica se l'immagine è stata caricata completamente da Roblox.

  • Seleziona la modalità di ridimensionamento dell'immagine per il Etichetta.

  • Lettura Parallela

    Determina come verrà ridimensionata un'immagine se viene visualizzata in un elemento UI il cui dimensionamento differisce dall'immagine di origine.

  • Lettura Parallela

    Imposta i confini di taglio di un'immagine a 9 strati.

  • Lettura Parallela

    Aumenta le dimensioni degli angoli a 9 fette secondo la percentuale specificata.

  • Lettura Parallela

    Imposta la dimensione della griglia del ImageLabel .

Proprietà provenienti da GuiObjectProprietà provenienti da GuiBase2d

Metodi

Metodi provenienti da GuiObject

Eventi

Eventi provenienti da GuiObjectEventi provenienti da GuiBase2d

Proprietà

Image

ContentId
Lettura Parallela

Questa proprietà è una proprietà di tipo contenuto che dovrebbe contenere l'ID risorsa di un decal o di un'immagine caricata su Roblox.Funziona identicamente a Decal.Texture con riguardo al caricamento dell'immagine da Roblox.L'immagine rendere può essere modificata utilizzando ImageColor3 e ImageTransparency .

ImageColor3

Lettura Parallela

Questa proprietà determina come viene colorata un'immagine.Quando è impostato su bianco, non si verifica alcuna colorazione.Questa proprietà è molto utile per riutilizzare le risorse dell'immagine; se l'immagine di origine è completamente bianca con trasparenza, puoi impostare l'intero colore dell'immagine in una volta con questa Proprietà.

ImageContent

Lettura Parallela

Questa proprietà dovrebbe contenere un URI risorsa o un riferimento a un oggetto EditableImage.

L' URI delle risorse può fare riferimento a un decal o immagine caricata su Roblox. Funziona identicamente a Decal.Texture per quanto riguarda il caricamento dell'immagine.

L'immagine rendere sarà colorata utilizzando ImageButton.ImageColor3 .È possibile rendere l'immagine come piastrellata, ridimensionata per adattarsi o a 9 fette, regolando la ProprietàImageButton.ScaleType.

ImageRectOffset

Lettura Parallela

Consente il display parziale di un'immagine in combinazione con ImageRectSize .Questa proprietà determina lo spostamento dei pixel (da sinistra in alto) dell'area dell'immagine da mostrare.

ImageRectSize

Lettura Parallela

Consente il display parziale di un'immagine in combinazione con ImageRectOffset .Questa proprietà determina la dimensione dei pixel dell'area dell'immagine da mostrare.Se una delle dimensioni è impostata su 0, viene visualizzata l'intera immagine invece.

ImageTransparency

Lettura Parallela

Questa proprietà determina l'alfa dell'immagine renderta di un elemento UI.Un valore di 0 è completamente opaco e un valore di 1 è completamente trasparente (invisibile).

Campioni di codice

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

Sola Lettura
Non Replicato
Lettura Parallela

Questa proprietà indica se la proprietà ImageLabel.Image ha finito di caricare da Roblox. Le immagini rifiutate dalla moderazione non verranno mai Caricare.

Campioni di codice

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

Lettura Parallela

Determina come appare l'immagine quando viene ridimensionata.Per impostazione predefinita, l'immagine leviga la texture quando viene visualizzata sullo schermo più grande o più piccolo della sua dimensione nella memoria della texture.Quando è impostato su Enum.ResamplerMode.Pixelated, l'immagine preserva i bordi acuti dei pixel.

Lettura Parallela

Questa proprietà determina in che modo un ImageLabel.Image viene visualizzato quando la dimensione assoluta dell'elemento UI differisce dalla dimensione dell'immagine di origine.

Per impostazione predefinita, questa proprietà è Enum.ScaleType.Stretch che semplicemente allungherà/compatterà le dimensioni dell'immagine in modo che si adatti esattamente allo spazio dell'elemento UI.Poiché i pixel trasparenti sono impostati su nero durante l'upload su Roblox, le immagini trasparenti dovrebbero applicare la fusione alfa per evitare un contorno nero attorno alle immagini ridimensionate.

Per Enum.ScaleType.Slice , la proprietà SliceCenter verrà rivelata nella finestra Proprietà.Questo è per l'interfaccia utente a nove strati: quando si aumenta la dimensione, i bordi rimarranno la dimensione dell'immagine di origine.I bordi dell'immagine si allungheranno fino alla larghezza/altezza dell'immagine.Infine, il centro dell'immagine si estenderà per riempire l'area centrale dell'immagine.

Infine, per Enum.ScaleType.Tile , la proprietà TileSize verrà rivelata nella finestra Proprietà.Questo è per le immagini piastrellate, in cui la dimensione di ogni tile di immagine è determinata dalla proprietà TileSize.

SliceCenter

Lettura Parallela

Questa proprietà imposta i confini di taglio di un'immagine a 9 strati quando ScaleType è impostato su Enum.ScaleType.Slice .Si prega di notare che questa proprietà è visibile solo nella finestra Proprietà sotto questa condizione.

Per saperne di più sulle immagini a 9 strati, vedi Interfaccia utente 9 Slice Design.

SliceScale

Lettura Parallela

Aumenta le dimensioni degli angoli a 9 fette secondo la percentuale specificata.Questo significa che i bordi intorno alla 9-slice cresceranno come se tu avessi caricato una nuova versione della texture upscaled.Predefinito a 1.0 .

Vedi anche ScaleType , SliceCenter e SliceScale .

TileSize

Lettura Parallela

Questa proprietà imposta la dimensione di riempimento del ImageLabel con un valore predefinito di UDim2.new(1, 0, 1, 0) . .La messa in piastrelle inizia nell'angolo in alto a sinistra dell'immagine.Questa proprietà è attiva solo se la ScaleType per il ImageLabel è impostata su Enum.ScaleType.Tile .

Campioni di codice

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

Metodi

Eventi