ImageLabel
*Dieser Inhalt wurde mit KI (Beta) übersetzt und kann Fehler enthalten. Um diese Seite auf Englisch zu sehen, klicke hier.
Ein ImageLabel rendert ein Rechteck, wie ein Frame mit einem Objekt.Die Anzeige des Bildes kann durch die Eigenschaften ImageColor3 und ImageTransparency manipuliert werden.Um nur das Bild anzuzeigen und das Rechteck auszublenden, stelle GuiObject.BackgroundTransparency auf 1 ein.
Fortgeschrittene ImageLabel
Kachelbilder können erstellt werden, indem ScaleType auf Enum.ScaleType.Tile gesetzt wird, dann TileSize auf die Größe der gerenderten Kacheln.
9-slice-bilder können erstellt werden, indem ScaleType auf Enum.ScaleType.Slice gesetzt wird, dann SliceCenter in den mittleren bereich des 9-slice-bildes.
Sprite-Blätter können durch die Verwendung von ImageRectOffset und ImageRectSize implementiert werden.Das Packen mehrerer Bilder in eines und die Verwendung dieser Eigenschaft kann die Bild-Assets deiner Erlebnisviel schneller laden, insbesondere, wenn du viele kleine Ikonen in deinen GUIs verwendest.
Zusammenfassung
Eigenschaften
Der Bildinhalt, der vom UI-Element angezeigt wird. Liest und schreibt auf ImageContent .
Bestimmt, wie ein gerendertes Bild koloriert wird.
Der Bildinhalt, der vom UI-Element angezeigt wird. Unterstützt Asset-URIs und EditableImage.
Der Versatz in Pixeln des Unterbereichs eines Bildes, das angezeigt werden soll.
Bestimmt die Größe in Pixeln des Unterbereichs eines Bildes, der angezeigt werden soll.
Bestimmt die Transparenz des gerenderten Bildes.
Weist darauf hin, ob das Bild von Roblox fertig geladen ist.
Wählt den Bildrezyklierungsmodus für das Beschriftungaus.
Legt fest, wie ein Bild skaliert wird, wenn es in einem UI-Element angezeigt wird, dessen Größe sich von der Quellbild unterscheidet.
Legt die Schnittgrenzen eines 9-geschnittenen Bildes fest.
Skaliert die 9-Ecken-Kanten durch die angegebene Relation.
Legt die Kachelgröße des ImageLabel fest.
Bestimmt, ob dieses UI-Element Eingabe sinkt.
Legt den Ursprungspunkt eines GuiObject fest, bezogen auf seine absolute Größe.
Bestimmt, ob die Größenänderung basierend auf dem Inhalt des Kindes erfolgt.
Bestimmt die GuiObject Hintergrundfarbe.
Bestimmt die Transparenz des Hintergrunds und der Grenze GuiObject.
Bestimmt die Farbe des GuiObject-Randes.
Bestimmt, auf welche Weise die GuiObject Grenze in Bezug auf ihre Dimensionen angeordnet wird.
Bestimmt die Pixelf宽te des GuiObject Randes.
Bestimmt, ob ein Nachkomme GuiObjects außerhalb der Grenzen eines Eltern-GUI-Elements rendernwerden soll.
Bestimmt, ob die Maus des Spieler:inaktiv auf der GuiObject gedrückt wird oder nicht.
Bestimmt, ob die GuiButton mit dem Interagieren kann oder nicht, oder ob sich die GuiState des GuiObject ändert oder nicht.
Steuert die Sortierreihenfolge der GuiObject, wenn sie mit einem UIGridStyleLayout verwendet wird.
Legt das GuiObject, was ausgewählt wird, wenn der Gamepad-Auswahlknopf nach unten verschoben wird.
Legt das GuiObject, was ausgewählt wird, wenn der Gamepad-Auswahlsteller nach links verschoben wird.
Setzt das GuiObject, das ausgewählt wird, wenn der Gamepad-Auswahlbereich nach rechts verschoben wird.
Legt das GuiObject, was ausgewählt wird, wenn der Gamepad-Auswahlsteller nach oben verschoben wird.
Bestimmt die Pixel- und Skalarposition des GuiObject.
Bestimmt die Anzahl der Grad, um die sich der GuiObject dreht.
Bestimmen, ob die GuiObject von einem Gamepad ausgewählt werden kann.
Übernimmt die Standardauswahlverzierung, die für Gamepads verwendet wird.
Die Reihenfolge von GuiObjects, die vom Gamepad-UI-Auswahl angezeigt wird.
Bestimmt die Pixelform und Skalierung der GuiObject .
Legt die Size-Achsen fest, auf denen die GuiObject basieren wird, im Verhältnis zur Größe ihres übergeordnetes Teil.
Eine gemischte Eigenschaft von BackgroundTransparency und TextTransparency.
Bestimmt, ob die GuiObject und ihre Nachkommen gerendert werden.
Bestimmt die Reihenfolge, in der ein GuiObject in Bezug auf andere gerendert wird.
Beschreibt die tatsächliche Bildschirmposition eines GuiBase2d Elements, in Pixeln.
Beschreibt die tatsächliche Bildschirm rotation eines GuiBase2d Elements, in Grad.
Beschreibt die tatsächliche Bildschirmgröße eines GuiBase2d Elements, in Pixeln.
Wenn es auf true gesetzt wird, wird die Lokalisierung auf dieses GuiBase2d und seine Nachkommen angewendet.
Eine Referenz auf ein LocalizationTable , das verwendet werden soll, um automatisierte Lokalisierung auf dieses GuiBase2d und seine Nachkommen anzuwenden.
Passt das Spielpadauswahlverhalten in die Down-Richtung an.
Passt das Spielpadauswahlverhalten in die linke Richtung an.
Passt das Spielpadauswahlverhalten in die richtige Richtung an.
Passt das Spielpadauswahlverhalten in die Richtung oben an.
Ermöglicht die Anpassung der Gamepad-Auswahlbewegung.
Methoden
Methoden von GuiObject übernommen- TweenPosition(endPosition : UDim2,easingDirection : Enum.EasingDirection,easingStyle : Enum.EasingStyle,time : number,override : boolean,callback : function):boolean
Bewegt eine GUI reibungslos zu einem neuen UDim2.
- TweenSize(endSize : UDim2,easingDirection : Enum.EasingDirection,easingStyle : Enum.EasingStyle,time : number,override : boolean,callback : function):boolean
- TweenSizeAndPosition(endSize : UDim2,endPosition : UDim2,easingDirection : Enum.EasingDirection,easingStyle : Enum.EasingStyle,time : number,override : boolean,callback : function):boolean
Bewegt eine GUI reibungslos zu einer neuen Größe und Position.
Ereignisse
Ereignisse von GuiObject übernommenFeuert, wenn ein Benutzer beginnt, über ein Mensch-Computer-Schnittstellen-Gerät zu interagieren (Mausknopf unten, Berührung beginnen, Tastaturknopf unten usw.).
Feuert, wenn ein Benutzer ändert, wie er über ein Mensch-Computer-Schnittstellen-Gerät interagiert (Mausknopf unten, Berührung beginnen, Tastaturknopf unten usw.).
Feuert, wenn ein Benutzer die Interaktion über ein Mensch-Computer-Schnittstellen-Gerät (Mausknopf unten, Berührung beginnen, Tastaturknopf unten usw.) beendet.
Feuert, wenn ein Benutzer seine Maus in ein GUI-Element bewegt.
Feuert, wenn ein Benutzer seine Maus aus einem GUI-Element heraus bewegt.
Feuert immer dann, wenn ein Benutzer seine Maus bewegt, während sie sich innerhalb eines GUI-Elements befindet.
Feuert, wenn ein Benutzer das Mobilrad zurück scrollt, wenn die Maus über ein GUI-Element ist.
Feuert, wenn ein Benutzer sein Mausrad nach vorne scrollt, wenn die Maus über ein GUI-Element ist.
Feuert ab, wenn das GuiObject mit dem Gamepad-Auswahlgerät fokussiert wird.
Feuert, wenn der Gamepad-Auswahlstoppt sich auf das GuiObject zu konzentrieren.
Feuert, wenn der Spieler startet, fortsetzt und lange auf das UI-Element drückt.
- TouchPan(touchPositions : Array,totalTranslation : Vector2,velocity : Vector2,state : Enum.UserInputState):RBXScriptSignal
Feuert, wenn der Spieler seinen Finger auf das UI-Element bewegt.
- TouchPinch(touchPositions : Array,scale : number,velocity : number,state : Enum.UserInputState):RBXScriptSignal
Feuert, wenn der Spieler eine Pinch- oder Pull-Geste ausführt, indem er zwei Finger auf das UI-Element legt.
- TouchRotate(touchPositions : Array,rotation : number,velocity : number,state : Enum.UserInputState):RBXScriptSignal
Feuert, wenn der Spieler eine Rotationsgeste mit zwei Fingern auf dem UI-Element ausführt.
Feuert, wenn der Spieler eine Wischgeste auf dem UI-Element ausführt.
Feuert, wenn der Spieler eine Tap-Geste auf dem UI-Element ausführt.
- SelectionChanged(amISelected : boolean,previousSelection : GuiObject,newSelection : GuiObject):RBXScriptSignal
Feuert, wenn die Auswahl des Gamepads sich auf, verlässt oder ändert innerhalb der verbundenen GuiBase2d oder eines Nachkommens GuiObjects.
Eigenschaften
Image
Diese Eigenschaft ist eine Inhaltsart-Eigenschaft, die die Asset-ID eines auf Roblox hochgeladenen Abzeichens oder Bildes enthalten sollte.Es funktioniert identisch zu Decal.Texture bei der Lädtung des Bildes von Roblox.Das gerendete Bild kann mit ImageColor3 und ImageTransparency modifiziert werden.
ImageColor3
Diese Eigenschaft legt fest, wie ein Bild koloriert wird.Wenn auf Weiß eingestellt, findet keine Farbgebung statt.Diese Eigenschaft ist sehr nützlich für die Wiederverwendung von Bildern; wenn die Quelle das Bild komplett weiß mit Transparenz ist, können Sie die gesamte Farbe des Bildes mit dieser Eigenschaftenauf einmal festlegen.
ImageContent
Diese Eigenschaft sollte eine Asset-URI oder einen Verweis auf ein EditableImage enthalten.
Die Asset-URI kann auf ein Abzeichen oder ein Bild verweisen, das auf Roblox hochgeladen wurde. Es funktioniert identisch zu Decal.Texture in Bezug auf das Laden des Bildes.
Das gerendete Bild wird mit ImageButton.ImageColor3 koloriert.Es ist möglich, das Bild so zu rendern, dass es gefliest, skaliert oder in 9 Stücke geschnitten wird, indem die EigenschaftenImageButton.ScaleType angepasst wird.
ImageRectOffset
Ermöglicht die teilweise Anzeige eines Bildes in Verbindung mit ImageRectSize.Diese Eigenschaft legt den Pixelfluss (von oben links) des Bildbereichs fest, der angezeigt werden soll.
ImageRectSize
Ermöglicht die teilweise Anzeige eines Bildes in Verbindung mit ImageRectOffset.Diese Eigenschaft legt die Pixelgröße des Bildbereichs fest, der angezeigt werden soll.Wenn eine der Dimensionen auf 0 festgelegt ist, wird stattdessen das gesamte Bild angezeigt.
ImageTransparency
Diese Eigenschaft legt die Alpha des rendierten Bildes eines UI-Elements fest.Ein Wert von 0 ist vollständig undurchsichtig und ein Wert von 1 ist vollständig durchsichtig (unsichtbar).
Code-Beispiele
This code sample oscillates the ImageTransparency of an ImageLabel/ImageButton from 0 to 1 using a sine wave.
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
Diese Eigenschaft zeigt an, ob die ImageLabel.Image-Eigenschaft von Roblox fertig geladen wurde. Bilder, die von der Moderation abgelehnt wurden, werden nie geladen.
Code-Beispiele
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.
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
Bestimmt, wie das Bild aussieht, wenn es skaliert wird.Standardmäßig glättet das Bild die Textur, wenn es auf dem Bildschirm größer oder kleiner als seine Größe in der Textmemorie angezeigt wird.Wenn es auf Enum.ResamplerMode.Pixelated festgelegt ist, bewahrt das Bild die scharfen Ränder der Pixel.
ScaleType
Diese Eigenschaft bestimmt, auf welche Weise ein ImageLabel.Image gerendert wird, wenn die absolute Größe des UI-Element-Größe vom Größe der Quellbild abweicht.
Standardmäßig ist diese Eigenschaft Enum.ScaleType.Stretch, die einfach die Bilddimensionen ausdehnt/kompaktiert, so dass sie genau zum Platz des UI-Elements passen.Da transparente Pixel beim Hochladen auf Roblox auf Schwarz eingestellt sind, sollten transparente Bilder eine Alpha-Mischung anwenden, um einen schwarzen Umriss um skalierte Bilder zu vermeiden.
Für Enum.ScaleType.Slice wird die Eigenschaft SliceCenter im Eigenschaften-Fenster offengelegt.Dies ist für die neunteilige UI: Wenn die Skalierung erhöht wird, bleiben die Ecken die Größe des Quellbildes.Die Ränder des Bildes werden auf die Breite/Höhe des Bildes ausgedehnt.Schließlich wird das Zentrum des Bildes ausgedehnt, um den mittleren Bereich des Bildes zu füllen.
Schließlich, für Enum.ScaleType.Tile , wird die TileSize Eigenschaft im Eigenschaften Fenster offenbart.Dies ist für kachelierte Bilder, bei denen die Größe jeder Bildtilie durch das Eigenschaft TileSize bestimmt wird.
SliceCenter
Diese Eigenschaft legt die Schnittgrenzen eines 9-geschnittenen Bildes fest, wenn ScaleType auf Enum.ScaleType.Slice gesetzt ist.Bitte beachten Sie, dass diese Eigenschaft nur in dem Eigenschaften-Fenster sichtbar ist, unter dieser Bedingung.
Um mehr über 9-Slice-Bilder zu erfahren, siehe Benutzeroberfläche 9-Slice-Design.
SliceScale
Skaliert die 9-Ecken-Kanten durch die angegebene Relation.Das bedeutet, dass die Ränder rund um die 9-Scheibe wachsen, als hättest du eine neue Version der Textur in vergrößerter Auflösung hochgeladen.Standard auf 1.0.
Siehe auch ScaleType , SliceCenter und SliceScale .
TileSize
Diese Eigenschaft legt die Kachelgröße des ImageLabel mit einem Standard von
Code-Beispiele
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, 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