Durch die Nutzung von Aussehensmodifikatoren können Sie das Aussehen Ihrer GuiObjects weiter anpassen.
- Wenden Sie einen Gradienten auf den Hintergrund eines Objekts an.
- Wenden Sie einen Stich auf Text oder eine Grenze an.
- Stellen Sie abgerundete Ecken für ein Objekt ein.
- Erhöhen Sie den Abstand zwischen den Rändern eines Objekts.
- Fügen Sie einen Schatten hinter einem Objekt hinzu.
Gradient
Das UIGradient-Objekt wendet einen Farb- und Transparenzverlauf auf sein übergeordnetes GuiObject an.
Sie können den Gradienten konfigurieren, indem Sie:
- Seine Transparenz durch eine NumberSequence in der Transparency-Eigenschaft des Gradienten festlegen.
- Den Ausgangspunkt des Gradienten (innerhalb oder außerhalb der Grenzen des Elternteils) durch die Offset-Eigenschaft auswählen.
- Den Winkel des Gradienten durch die Rotation-Eigenschaft festlegen.
Farbsequenz
Um die Farbsequenz eines Gradienten festzulegen:
Wählen Sie im Explorer-Fenster das UIGradient aus.
Klicken Sie im Eigenschaften-Fenster in das Feld der Color-Eigenschaft und klicken Sie dann auf die ⋯-Schaltfläche rechts im Eingabefeld. Ein Pop-up mit der Farbsequenz wird angezeigt.
Jedes Dreieck auf der unteren Achse der Farbsequenz ist ein Stützpunkt, der den Farbwert an diesem Punkt bestimmt.
Klicken Sie auf einen Stützpunkt in der Farbsequenz und klicken Sie dann auf das kleine Quadrat neben Farbe, um das Farben-Pop-up-Fenster zu öffnen.
Wählen Sie die gewünschte Farbe für den Stützpunkt aus.
Falls erforderlich, können Sie:
- Einen weiteren Stützpunkt hinzufügen, indem Sie irgendwo auf dem Diagramm klicken.
- Einen vorhandenen Stützpunkt an eine neue Position ziehen oder einen Stützpunkt auswählen und einen spezifischen Zeitwert über die Zeit-Eingabe eingeben.
- Einen Stützpunkt löschen, indem Sie ihn auswählen und auf die Löschen-Schaltfläche klicken.
- Die Sequenz zurücksetzen, indem Sie auf die Zurücksetzen-Schaltfläche klicken.
Transparenz
Um die Transparenz eines Gradienten über seinen Bereich anzupassen:
Wählen Sie im Explorer-Fenster das UIGradient aus.
Klicken Sie im Eigenschaften-Fenster in das Feld der Transparency-Eigenschaft und klicken Sie auf die ⋯-Schaltfläche rechts im Eingabefeld. Ein Pop-up zur Zahlenfolge wird angezeigt.
Jeder Quadrat im Diagramm der Zahlenfolge ist ein Stützpunkt, der den Transparenzwert an diesem Punkt bestimmt.
Klicken und ziehen Sie einen beliebigen Stützpunkt, oder wählen Sie einen Stützpunkt aus und geben Sie eine spezifische Zeit/Wert-Kombination über die Eingaben Zeit und Wert ein.
Falls erforderlich, können Sie:
- Einen weiteren Stützpunkt hinzufügen, indem Sie irgendwo auf dem Diagramm klicken.
- Einen Stützpunkt löschen, indem Sie ihn auswählen und auf die Löschen-Schaltfläche klicken.
- Die Sequenz zurücksetzen, indem Sie auf die Zurücksetzen-Schaltfläche klicken.
Offset und Rotation
Die Eigenschaften Offset und Rotation ermöglichen es Ihnen, die Steuerpunkte des Gradienten und seinen Winkel anzupassen. Wie in den folgenden Diagrammen dargestellt, basiert Offset auf einem Prozentsatz der Breite oder Höhe des übergeordneten Elements, wobei sowohl positive als auch negative Werte gültig sind.
Ähnlich drehen sich auch die Steuerpunkte, wenn Sie den Gradienten drehen:
Stich
Die UIStroke-Instanz wendet eine Umrandung auf Text oder eine Grenze an. Wichtige Funktionen sind:
- Möglichkeit, die Transparenz der Umrandung unabhängig von der Transparenz des Elternteils festzulegen.
- Anpassbare Position und/oder Versatz relativ zur Grenze des Elternteils.
- Drei Eckenstile (rund, abgeschrägt oder spitz).
- Unterstützung für den Gradienten der Umrandung über die UIGradient-Instanz.
Dicke
Sie können die Strichstärke über die Thickness-Eigenschaft festlegen, die in Pixeln (Standard) oder skaliert relativ zum Elternteil gemessen wird, abhängig vom StrokeSizingMode des Modifikators. Wenn der Strich auf Text angewendet wird und StrokeSizingMode auf ScaledSize gesetzt ist, ist die Dicke relativ zur Schriftgröße.
Farbe oder Gradient
Sie können die Strichfarbe über die Color-Eigenschaft festlegen und zudem eine untergeordnete UIGradient-Instanz einfügen, um Farbverlauf-Stiche zu erzeugen.
Sowohl das übergeordnete Objekt als auch UIStroke können untergeordnete UIGradient-Instanzen haben, sodass Sie Gradienten auf die Umrandung und Füllung unabhängig einstellen können.
Textumrandung oder Grenze
Abhängig vom Typ seines Elternteils fungiert UIStroke entweder als Textumrandung oder als Grenze. Wenn Sie UIStroke einem Textobjekt wie TextLabel zuweisen, wird es auf die Umrandung des Textes angewendet; wenn Sie UIStroke anderen GuiObjects zuweisen, wird es auf die Grenze angewendet.
Wenn auf ein Textobjekt angewendet, können Sie das standardmäßige Strichverhalten über die ApplyStrokeMode-Eigenschaft überschreiben, sodass Sie den Strich auf die Grenzen des Objekts und nicht auf den Text selbst anwenden können. Sie können sogar die Textumrandung und die Grenze unabhängig steuern, indem Sie zwei UIStroke-Instanzen einem Textobjekt zuweisen, eine auf Kontextuell und die andere auf Grenze.
Grenzposition/-versatz
BorderStrokePosition legt die Position des Streichs relativ zur Grenze seines Elternteils fest, und BorderOffset ermöglicht es Ihnen, einen zusätzlichen Versatz zur Position des Strichs anzugeben.
Transparenz
Die Transparency-Eigenschaft legt die Transparenz des Streichs unabhängig von der BackgroundTransparency des übergeordneten Objekts oder der TextTransparency fest. Dies ermöglicht es Ihnen, Texte und Grenzen zu rendern, die "hohl" sind (nur aus einer Umrandung bestehen).
Eckenstil
Die LineJoinMode-Eigenschaft lässt Sie steuern, wie Ecken interpretiert werden. Sie akzeptiert einen Wert von entweder Round, Bevel oder Miter.
Schichtung
Um mehrere Geschwister UIStroke-Instanzen auf einem GuiObject von vorne nach hinten zu schichten, können Sie die ZIndex-Eigenschaft verwenden. Instanzen mit einem niedrigeren ZIndex werden unter (hinter) jenen mit einem höheren ZIndex gerendert.
Beachten Sie, dass die Rendereihenfolge für UIStroke-Instanzen mit dem gleichen ZIndex undefiniert ist. Wenden Sie keine mehreren UIStroke-Instanzen mit dem gleichen Index an, wenn deren Rendereihenfolge wichtig ist.
Ecken
Die UICorner-Instanz wendet eine Verformung auf die Ecken ihres übergeordneten GuiObject an. Sie können den angewendeten Radius über die CornerRadius-Eigenschaft mithilfe von entweder Scale oder Offset steuern.
Scale rundet die Ecken auf einen Prozentsatz basierend auf der Gesamtlänge der kürzesten Kante des übergeordneten Elements, d.h. dass ein Maß von 0.5 oder höher das Elternteil in eine "Pillen"-Form deformed, unabhängig von seiner Breite oder Höhe. Offset rundet die Ecken auf eine spezifische Anzahl von Pixeln, unabhängig von der Breite/Höhe des Elternteils.
Sie können auch einzelne Ecken über die Eigenschaften TopLeftRadius, TopRightRadius, BottomRightRadius und BottomLeftRadius steuern.
TopRightRadius = (0, 48)
BottomRightRadius = (0, 48)
BottomLeftRadius = (0, 0)
Padding
Ein UIPadding-Objekt wendet oberen, unteren, linken und/oder rechten Padding auf den Inhalt des übergeordneten GuiObject an. Zum Beispiel können Sie den Text in einem Textlabel nach unten oder oben verschieben, indem Sie einen Offset auf die PaddingBottom-Eigenschaft des Modifikators anwenden.
Schatten
Ein UIShadow-Objekt rendert einen Schlagschatten hinter seiner übergeordneten UI-Instanz. Wichtige Funktionen sind:
- Passen Sie die Unschärfe des Schattens an.
- Passen Sie die Farbe und Transparenz des Schattens an.
- Passen Sie den Versatz und die Verbreitung des Schattens an.
- Wenn das Elternteil mit GuiObject.Rotation gedreht wird, wird auch der Schatten gedreht.
- Wenn das Elternteil runde Ecken hat, hat der Schatten auch runde Ecken.
UIShadow unterstützt keinen Text. Wenn Sie diesen Modifikator zu einem TextLabel oder TextButton hinzufügen, wird ein Schatten des rechteckigen Begrenzungsbereichs des Objekts gerendert, nicht des Textes.
Unschärfe
Die BlurRadius-Eigenschaft bestimmt die Unschärfe des Schattens. Ein größerer Wert lässt die Kanten des Schattens weicher erscheinen. Beachten Sie, dass der Skalen-Faktor dieser UDim-Eigenschaft relativ zur Breite oder Höhe des Elternteils ist, je nachdem, welcher Wert geringer ist.
Farbe und Transparenz
Die Color-Eigenschaft bestimmt die Farbe des Schattens, während die Transparency die Transparenz des Schattens festlegt, wobei 0 vollständig undurchsichtig und 1 vollständig transparent ist.
Versatz und Verbreitung
Die Offset-Eigenschaft bewegt den Schatten relativ zur Position des Elternteils, während die Spread den Schatten relativ zur Größe des Elternteils erweitert oder verkleinert.
