ImageLabel
*Ce contenu est traduit en utilisant l'IA (Beta) et peut contenir des erreurs. Pour consulter cette page en anglais, clique ici.
Un ImageLabel rend un rectangle, comme un Frame le fait, avec une contenud'image. Le affichage de l'image peut être manipulé via les propriétés ImageColor3 et 1> Class.ImageLabel
L'utilisation avancée de ImageLabel inclut :
Les images à tuiles peuvent être créées en définissant ScaleType à Enum.ScaleType.Tile , puis TileSize à la taille des carreaux rendus.
Les images de 9 tranches peuvent être créées en définissant ScaleType à Enum.ScaleType.Slice, puis SliceCenter à la zone centrale de l'image de 9 tranches.
Les feuilles de sprite peuvent être implémentées via l'utilisation de ImageRectOffset et ImageRectSize. Packer plusieurs images dans un et utiliser cette propriété peut rendre vos ressources d'image d'expérience beaucoup plus rapide, surtout si vous utilisez de nombreux petits icônes dans vos GUIs.
Résumé
Propriétés
Le contenu de l'image affiché par l'élément UI.
Détermine la façon dont une image rendue sera colorée.
L'Offset en pixels de la sous-zone d'une image à afficher.
Détermine la taille en pixels de la sous-zone d'une image à afficher.
Détermine la transparence de l'image rendue.
Indique si l'image a fini de charger à partir de Roblox.
Sélectionne le mode de redimensionnement d'image pour l'étiquette.
Détermine la façon dont une image sera mise à l'échelle si elle est affichée dans un élément de l'interface utilisateur dont la taille diffère de l'image source.
Définit les limites de tranche d'une image en 9 tranches.
Échelle les 9 bords d'边 par le ratio spécifié.
Définit la taille de la case de l'ImageLabel.
Détermine si cet élément de l'interface utilisateur coule l'entrée.
Détermine le point d'origine d'un GuiObject , par rapport à sa taille absolue.
Détermine si la redimensionnement se produit en fonction du contenu de l'enfant.
Détermine la couleur de l'arrière-plan GuiObject.
Détermine la transparence de l'arrière-plan et de la frontière de GuiObject.
Détermine la couleur de la GuiObject bordure.
Détermine la manière dont la GuiObject bordure est distribuée par rapport à ses dimensions.
Détermine la largeur de pixel de la GuiObject bordure.
Détermine si le descendant GuiObjects en dehors des limites d'un élément GUI parent doit rendu.
Détermine si la souris du joueur est activement pressée sur le GuiObject ou non.
Détermine si le GuiButton peut être interagi ou non, ou si le GuiState du GuiObject change ou non.
Contrôle l'ordre de tri du GuiObject lorsqu'il est utilisé avec un UIGridStyleLayout .
Définit le GuiObject qui sera sélectionné lorsque le sélecteur de gamepad sera déplacé vers le bas.
Définit le GuiObject qui sera sélectionné lorsque le sélecteur de gamepad sera déplacé à gauche.
Définit le GuiObject qui sera sélectionné lorsque le sélecteur de gamepad sera déplacé à droite.
Définit le GuiObject qui sera sélectionné lorsque le sélecteur de gamepad sera déplacé vers le haut.
Détermine la position pixel et vectorielle de l' GuiObject .
Détermine le nombre de degrés par lesquels le GuiObject est pivoté.
Déterminez si le GUI peut être sélectionné par une manette de jeu.
Surclasse l'ornement de sélection par défaut utilisé pour les gamepads.
L'ordre de GuiObjects sélectionné par la sélection de l'interface de jeu.
Détermine la taille de pixel et de taille vectorielle de GuiObject .
Définit les Size axes sur lesquels le GuiObject sera basé, par rapport à la taille de son parent.
Une propriété mixte de BackgroundTransparency et TextTransparency .
Détermine si le GuiObject et ses descendants seront rendus.
Détermine l'ordre dans lequel un GuiObject rendu par rapport aux autres.
Décrivez la position d'écran réelle d'un élément UI, en pixels.
Décrivez la rotation de l'écran réelle d'un élément UI, en degrés.
Décrivez la taille réelle de l'interface utilisateur, en pixels.
Lorsqu'il est réglé sur vrai, la localisation sera appliquée à ce GuiBase2d et à ses descendants.
Une référence à un LocalizationTable pour être utilisé pour appliquer la localisation automatisée à ce GuiBase2d et à ses descendants.
Personnalise le comportement de sélection du gamepad dans la direction vers le bas.
Personnalise le comportement de sélection du gamepad dans la direction de gauche.
Personnalise le comportement de sélection du gamepad dans la bonne direction.
Personnalise le comportement de sélection du gamepad dans la direction vers le haut.
Permet la personnalisation de la sélection du gamepad.
Méthodes
Méthodes hérités de GuiObject- TweenPosition(endPosition : UDim2,easingDirection : Enum.EasingDirection,easingStyle : Enum.EasingStyle,time : number,override : bool,callback : function):bool
Déplace facilement une GUI vers un nouveau UDim2.
- TweenSize(endSize : UDim2,easingDirection : Enum.EasingDirection,easingStyle : Enum.EasingStyle,time : number,override : bool,callback : function):bool
Redimensionne facilement une GUI en une nouvelle UDim2 .
- TweenSizeAndPosition(endSize : UDim2,endPosition : UDim2,easingDirection : Enum.EasingDirection,easingStyle : Enum.EasingStyle,time : number,override : bool,callback : function):bool
Déplace facilement une GUI dans une nouvelle taille et position.
Évènements
Évènements hérités de GuiObjectActivé lorsqu'un utilisateur commence à interagir via un appareil d'interface humain-ordinateur (bouton de souris, toucher de début, bouton de clavier, etc).
Activé lorsqu'un utilisateur change la façon dont ils interagissent via un appareil d'interface humain-ordinateur (bouton de souris, toucher le début, bouton de clavier, etc).
Activé lorsqu'un utilisateur arrête d'interagir via un appareil d'interface humain-ordinateur (bouton de souris, toucher début, bouton de clavier, etc).
Se déclenche lorsqu'un utilisateur déplace son curseur dans un élément GUI.
Se déclenche lorsqu'un utilisateur déplace sa souris à l'extérieur d'un élément GUI.
Se déclenche toujours lorsqu'un utilisateur déplace sa souris pendant qu'il est à l'intérieur d'un élément GUI.
Se déclenche lorsqu'un utilisateur fait glisser son roue de souris quand la souris est sur un élément de l'interface graphique.
Se déclenche lorsqu'un utilisateur fait glisser sa molette de souris vers l'avant lorsqu'il est au-dessus d'un élément GUI.
Activé lorsque l'objet Gui est focalisé avec le sélecteur Gamepad.
Activé lorsque le sélecteur Gamepad arrête de se concentrer sur GuiObject.
Démarre lorsque le joueur démarre, continue et s'arrête longuement sur la pression de l'API.
- TouchPan(touchPositions : Array,totalTranslation : Vector2,velocity : Vector2,state : Enum.UserInputState):RBXScriptSignal
Se déclenche lorsque le joueur déplace son doigt sur l'élément de l'interface utilisateur.
- TouchPinch(touchPositions : Array,scale : number,velocity : number,state : Enum.UserInputState):RBXScriptSignal
Se déclenche lorsque le joueur effectue un geste de pince ou de tir à l'aide de deux doigts sur l'élément de l'interface utilisateur.
- TouchRotate(touchPositions : Array,rotation : number,velocity : number,state : Enum.UserInputState):RBXScriptSignal
Se déclenche lorsque le joueur effectue une rotation à l'aide de deux doigts sur l'élément de l'interface utilisateur.
Se déclenche lorsque le joueur effectue un geste de ramassage sur l'élément de l'interface utilisateur.
Se déclenche lorsque le joueur effectue un geste de touche sur l'élément de l'interface.
- SelectionChanged(amISelected : bool,previousSelection : GuiObject,newSelection : GuiObject):RBXScriptSignal
Se déclenche lorsque la sélection du gamepad se déplace, quitte ou change dans la GuiBase2d ou tout descendant GuiObjects connecté.
Propriétés
Image
La propriété Image est une propriété de type de contenu qui doit contenir l'ID de l'asset d'une image ou d'un autocollant téléchargé sur Roblox. Elle fonctionne identiquement à Decal.Texture en matière de chargement de l'image à partir de Roblox. L'image rendue peut être modifiée en utilisant Class.ImageLabel
ImageColor3
La propriété ImageColor3 détermine comment une image est colorée. Lorsqu'elle est réglée sur « blanche », aucune coloration n'a lieu. Cette propriété est très utile pour réutiliser les ressources d'image ; si l'image source est complètement blanche avec une transparence, vous pouvez définir la couleur de l'image entière à l'aide de cette propriété.
ImageContent
ImageRectOffset
Permet la présentation partielle d'une image en conjonction avec ImageRectSize. Cette propriété détermine le décalage des pixels (à partir du haut à gauche) de la zone d'image à afficher.
ImageRectSize
Permet la présentation partielle d'une image en conjonction avec ImageRectOffset. Cette propriété détermine la taille des pixels de la zone d'image à afficher. Si l'une des dimensions est réglée sur 0, l'ensemble de l'image est affichée à la place.
ImageTransparency
ImageTransparency détermine l'Alpha d'une image rendue par un élément de l'interface utilisateur. Une valeur de 0 est complètement opaque et une valeur de 1 est complètement transparente (invisible).
Échantillons de code
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
La propriété IsLoaded indique si la propriété ImageLabel.Image a fini de charger à partir de Roblox. Les images rejetées par la modération ne seront jamais chargées.
Échantillons de code
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
Détermine la façon dont l'image apparaît lorsqu'elle est redimensionnée. Par défaut, l'image aplatit la texture lorsqu'elle est affichée sur l'écran plus grande ou plus petite que son taille dans la mémoire de texture. Lorsque elle est réglée sur Enum.ResamplerMode.Pixelated, l'image conserve les bords tranchants des pixels.
ScaleType
La propriété ScaleType détermine la manière dont un ImageLabel.Image est rendu lorsque la taille absolue de l'élément de l'interface diffère de la taille de l'image source.
Par défaut, cette propriété est Enum.ScaleType.Stretch qui étire/compense simplement les dimensions de l'image pour qu'elle s'adapte exactement à l'espace de l'élément de l'interface. Étant que les pixels transparents sont définis sur noir lors du téléchargement sur Roblox, les images transparentes devraient s'appliquer à l'Alpha Blending pour éviter un contour noir autour des images échelonnées.
Pour Enum.ScaleType.Slice, la propriété SliceCenter sera révélée dans la fenêtre propriétés. Ceci est pour l'interface de huit-Slice UI : lorsque vous redimensionnez, les coins restent la taille de l'image source. Les bords de l'image s'étendent jusqu'à la largeur/hauteur de l'image. Enfin, le
Enfin, pour Enum.ScaleType.Tile, la propriété TileSize sera révélée dans la fenêtre propriétés. Cela s'applique aux images carrelées, où la taille de chaque carre est déterminée par la propriété 1> Class.ImageLabel.TileSize|TileSize1>.
SliceCenter
La propriété SliceCenter définit les limites de chaque tranche d'image lorsque ScaleType est réglé sur Enum.ScaleType.Slice. Remarquez que cette propriété n'est visible que dans la 1> fenêtre propriétés1> sous cette condition.
Pour en savoir plus sur les images à 9 tranches, voir Design de l'interface utilisateur 9 tranches.
SliceScale
Échelle les 9 bords d'边 par le ratio spécifié. Cela signifie que les bords autour des 9 bords grandiront comme si vous aviez téléchargé une nouvelle version de la texture upscaled. Par défaut, 1.0 .
Voir également ScaleType , SliceCenter et SliceScale .
TileSize
TileSize définit la taille de la case de ImageLabel avec un
Échantillons de code
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