Utilizzando i modificatori di aspetto, puoi ulteriormente personalizzare l'aspetto dei tuoi GuiObjects.
- Applica un gradiente allo sfondo di un oggetto.
- Applica un contorno al testo o a un bordo.
- Imposta angoli arrotondati per un oggetto.
- Aumenta il padding tra i bordi di un oggetto.
- Aggiungi un ombreggiatura dietro un oggetto.
Gradiente
L'oggetto UIGradient applica un gradiente di colore e trasparenza al suo GuiObject genitore.
Puoi configurare il gradiente:
- Scegliendo il punto di partenza del gradiente (all'interno o all'esterno dei limiti del genitore) tramite la proprietà Offset.
- Scegliendo il comportamento di campionamento dei bordi del gradiente tramite la proprietà TileMode.
Sequenza di colori
Per impostare la sequenza di colori di un gradiente:
Nella finestra Explorer, seleziona il UIGradient.
Nella finestra Properties, fai clic all'interno del campo della proprietà Color, quindi fai clic sul pulsante ⋯ a destra della casella di input.
Ogni triangolo sull'asse inferiore della sequenza di colori è un punto chiave che determina il valore del colore in quel punto.
- Fai clic su un punto chiave nella sequenza di colori per selezionarlo o riposizionarlo, oppure aggiungi un altro punto chiave facendo clic ovunque sul grafico.
- Fai clic sul piccolo quadrato accanto a Colore per aprire la finestra pop-up Colori, quindi seleziona il colore desiderato per il punto chiave.
- Se necessario, ripeti questi passaggi per aggiungere/regolare i colori nel grafico.
Trasparenza
Per regolare la trasparenza di un gradiente lungo il suo intervallo:
Nella finestra Explorer, seleziona il UIGradient.
Nella finestra Properties, fai clic all'interno del campo della proprietà Transparency, quindi fai clic sul pulsante ⋯ a destra della casella di input.
Ogni quadrato attraverso il grafico della sequenza numerica è un punto chiave che determina il valore di trasparenza in quel punto.
- Fai clic su un punto chiave nella sequenza numerica per selezionarlo o riposizionarlo, oppure aggiungi un altro punto chiave facendo clic ovunque sul grafico.
- Inserisci una combinazione specifica di tempo/valore tramite gli input Tempo e Valore.
- Se necessario, ripeti questi passaggi per aggiungere/regolare i livelli di trasparenza nel grafico.
Tipo
La proprietà Type di un gradiente imposta il suo tipo tra Linear, Radial o Conical.
Conical — La sequenza di colore/trasparenza si muove in senso orario attorno al centro dell'elemento, eventualmente spostata da Offset. Rotation controlla l'angolo di inizio e fine del movimento. Per impostazione predefinita, questo si muove da 0 a 360 gradi, ma i valori di Scale inferiori a 1 possono ridurre quell'angolo.
Offset e rotazione
Le proprietà Offset e Rotation ti consentono di regolare i punti di controllo del gradiente e il suo angolo. Come illustrato nei seguenti diagrammi, Offset si basa su una percentuale della larghezza o dell'altezza del genitore, e sia i valori positivi che negativi sono validi.
Allo stesso modo, quando ruoti il gradiente, anche i punti di controllo ruotano:
Scala
La Scale di un gradiente moltiplica l'estensione del gradiente, controllando quanto della sequenza di colore/trasparenza è visibile all'interno dell'elemento.
Quando Scale è superiore a 1, il gradiente si estende oltre l'estensione completa e solo una parte del colore/trasparenza è visibile.
Modalità di ripetizione
La proprietà TileMode imposta come il gradiente si ripete quando l'intera sequenza non copre completamente l'elemento genitore.
Clamp — Modalità predefinita in cui i valori di colore/trasparenza all'inizio e alla fine della sequenza si estendono all'infinito, quindi i valori di inizio riempiono qualsiasi area prima del gradiente e i valori di fine riempiono qualsiasi area dopo di esso.
Repeat — Il gradiente si ripete avvolgendo senza soluzione di continuità i tasselli della sequenza di colore/trasparenza dalla fine all'inizio. Questo può produrre una cucitura visibile se i primi e gli ultimi valori di colore/trasparenza nella sequenza differiscono.
Mirror — Il gradiente si riflette a ciascun confine in modo che la sequenza di colore/trasparenza ping-ponga. Questo produce una ripetizione fluida senza cuciture, poiché la direzione si inverte a ciascun bordo del tassello.
Contorno
L'istanza UIStroke applica un contorno al testo o a un bordo. Le caratteristiche principali includono:
- Colore regolabile e spessore del contorno.
- Possibilità di impostare la trasparenza del contorno in modo indipendente dalla trasparenza del genitore.
- Posizione e/o offset personalizzabili rispetto al bordo del genitore.
- Tre stili di angolo (tondo, smussato o a punta).
- Supporto per il gradiente del contorno tramite l'istanza UIGradient.
Spessore
Puoi impostare la larghezza del contorno tramite la proprietà Thickness, che è misurata in pixel (predefinita) o scalata rispetto al genitore, a seconda della StrokeSizingMode del modificatore. Se il contorno è su testo e StrokeSizingMode è impostato su ScaledSize, lo spessore è relativo alla dimensione del carattere.
Colore o gradiente
Puoi impostare il colore del contorno tramite la proprietà Color, oltre a inserire un'istanza figlia UIGradient per creare contorni a gradiente.
Sia l'oggetto genitore che UIStroke possono avere istanze figlie UIGradient, consentendoti di impostare i gradienti sul contorno e sul riempimento in modo indipendente.
Contorno del testo o bordo
A seconda del tipo di genitore, UIStroke opera come un contorno del testo o come un bordo. Quando si collega UIStroke a un oggetto di testo come TextLabel, si applica al contorno del testo; quando si collega UIStroke ad altri GuiObjects, si applica al bordo.
Quando applicato a un oggetto di testo, puoi sovrascrivere il comportamento predefinito del contorno tramite la proprietà ApplyStrokeMode, consentendoti di applicare il contorno ai limiti dell'oggetto invece che al testo stesso. Puoi persino controllare il contorno del testo e il bordo in modo indipendente collegando due istanze UIStroke a un oggetto di testo, una impostata su Contestuale e l'altra su Bordo.
Posizione/offset del bordo
BorderStrokePosition imposta la posizione del contorno rispetto al bordo del suo genitore e BorderOffset ti consente di specificare un offset aggiuntivo alla posizione del contorno.
Trasparenza
La proprietà Transparency imposta la trasparenza del contorno in modo indipendente dalla BackgroundTransparency dell'oggetto genitore o dalla TextTransparency. Questo ti consente di rendere il testo e i bordi "cavi" (composti solo da un contorno).
Stile degli angoli
La proprietà LineJoinMode ti consente di controllare come vengono interpretati gli angoli. Accetta un valore di Round, Bevel o Miter.
Sovrapposizione
Per sovrapporre più istanze di UIStroke su un GuiObject da davanti a dietro, puoi utilizzare la proprietà ZIndex. Quelle con un ZIndex inferiore vengono renderizzate sotto (dietro) quelle con un ZIndex più alto.
Nota che l'ordine di rendering per le istanze UIStroke con lo stesso ZIndex è indefinito. Non applicare più istanze UIStroke con lo stesso indice se il loro ordine di rendering è importante.
Angoli
L'istanza UICorner applica una deformazione agli angoli del suo GuiObject genitore. Puoi controllare il raggio applicato tramite la proprietà CornerRadius utilizzando Scale o Offset.
Scale arrotonda gli angoli a una percentuale basata sulla lunghezza totale del bordo più corto del genitore, il che significa che una scala di 0.5 o superiore deforma il genitore in una forma "a pillola", indipendentemente dalla sua larghezza o altezza. Offset arrotonda gli angoli a un numero specifico di pixel, indipendentemente dalla larghezza/altezza del genitore.
Puoi anche controllare angoli individuali tramite le proprietà TopLeftRadius, TopRightRadius, BottomRightRadius e BottomLeftRadius.
TopRightRadius = (0, 48)
BottomRightRadius = (0, 48)
BottomLeftRadius = (0, 0)
Padding
Un oggetto UIPadding applica padding superiore, inferiore, sinistro e/o destro ai contenuti del GuiObject genitore. Ad esempio, puoi spostare il testo all'interno di un'etichetta di testo verso il basso o verso l'alto applicando un offset alla proprietà PaddingBottom del modificatore.
Ombra
Un oggetto UIShadow rende un'ombreggiatura dietro la sua istanza UI genitore. Le caratteristiche principali includono:
- Regola la sfocatura dell'ombra.
- Regola il colore e la trasparenza dell'ombra.
- Regola l'offset e la diffusione dell'ombra.
- Se il genitore è ruotato da GuiObject.Rotation, anche l'ombra sarà ruotata.
- Se il genitore ha angoli arrotondati, anche l'ombra avrà angoli arrotondati.
UIShadow non supporta il testo. Se aggiungi questo modificatore a un TextLabel o TextButton, renderizza un'ombra dell'area rettangolare di delimitazione dell'oggetto, non del testo.
Sfocatura
La proprietà BlurRadius determina la sfocatura dell'ombra. Un valore più grande rende i bordi dell'ombra più morbidi. Nota che il fattore di scala di questa proprietà UDim è relativo alla larghezza o all'altezza del genitore, a seconda di quale sia più corto.
Colore e trasparenza
La proprietà Color determina il colore dell'ombra, mentre Transparency imposta la trasparenza dell'ombra con 0 che è completamente opaco e 1 che è completamente trasparente.
Offset e diffusione
La proprietà Offset sposta l'ombra rispetto alla posizione del genitore, mentre Spread espande o riduce l'ombra rispetto alla dimensione del genitore.
