Insieme alla base dimensionamento degli oggetti UI, puoi utilizzare modificatori di dimensione per ridimensionare un oggetto in modo proporzionale o ridimensionarlo automaticamente. Puoi anche inserire vincoli di dimensione per controllare il rapporto d'aspetto, oppure impostare una dimensione minima e massima o una dimensione del testo.
Ridimensionamento
Un oggetto UIScale memorizza un valore numerico che moltiplica la proprietà AbsoluteSize dell'oggetto GuiObject genitore. Ad esempio, se vuoi che un oggetto sia due volte più grande di come è attualmente, puoi inserire un oggetto UIScale con una proprietà Scale di 2.
Questo modificatore è utile per "ingrandire" mentre progetti un'interfaccia utente dettagliata in Studio, poiché ridimensiona proporzionalmente l'oggetto e tutti i suoi figli, inclusi eventuali modificatori di aspetto applicati come UIStroke o UICorner. È anche utile per eseguire tween sulla dimensione di un oggetto, ad esempio per aumentare leggermente la dimensione di un pulsante quando un giocatore passa il mouse sopra di esso.
Ridimensionamento automatico
La proprietà AutomaticSize ridimensiona automaticamente un oggetto GuiObject genitore alle dimensioni dei suoi discendenti. Puoi utilizzare questa proprietà in una varietà di casi, tra cui:
- Espandere un GuiObject per adattarsi a testo che è stato localizzato in molte lingue.
- Consentire agli utenti di inserire testo all'interno di un TextBox, regolando automaticamente le sue dimensioni in base alla quantità di testo inserito.
- Regolare automaticamente la dimensione degli oggetti di testo utilizzando rich text markup, inclusi tipo e dimensione del carattere.
Puoi abilitare la proprietà AutomaticSize per qualsiasi GuiObject. Per impostazione predefinita, è impostato su None, ma puoi cambiare il suo valore per avere il controllo specifico sulla direzione in cui il GuiObject si ridimensiona per adattarsi ai suoi contenuti.
ScrollingFrame utilizza la proprietà AutomaticCanvasSize invece di AutomaticSize. Comporta nello stesso modo, ma ridimensiona la proprietà CanvasSize del frame, non la base Size.
Per abilitare il ridimensionamento automatico:
Nella finestra Explorer, fai clic su qualsiasi GuiObject, come Frame, TextBox o ImageLabel.
Nella finestra Properties, vai alla proprietà AutomaticSize (AutomaticCanvasSize per ScrollingFrame) e impostala su una delle seguenti opzioni:
- X — Ridimensiona il contenuto orizzontalmente.
- Y — Ridimensiona il contenuto verticalmente.
- XY — Ridimensiona il contenuto sia orizzontalmente che verticalmente.
Una volta impostato il ridimensionamento automatico, nota che altre proprietà dell'oggetto si comportano come segue:
Simile al concetto di dimensionamento di un oggetto, AutomaticSize prende in considerazione la proprietà AnchorPoint quando ridimensiona il contenuto. Ad esempio, il seguente video mostra tre TextLabels che si ridimensionano automaticamente dal loro punto di ancoraggio.
- L'etichetta in alto ha un valore di AnchorPoint di (0, 0.5), che la ancorano al centro del lato sinistro.
- L'etichetta di mezzo ha un valore di AnchorPoint di (0.5, 0.5), che la ancorano al centro.
- L'etichetta in basso ha un valore di AnchorPoint di (1, 0.5), che la ancorano al centro del lato destro.
Vincoli
Ci sono tre tipi di vincoli che puoi utilizzare per un oggetto dell'interfaccia utente: dimensione, dimensione del testo e rapporto d'aspetto. Per utilizzare un vincolo, devi impostarlo come figlio dell'oggetto GuiObject che vuoi vincolare.
Dimensione
Il UISizeConstraint specifica una dimensione minima e massima per un GuiObject. Questo vincolo assicura che il GuiObject non diventi troppo piccolo o grande su diverse dimensioni dello schermo.
Ad esempio, se imposti la proprietà MinSize a (200, 200) e la proprietà MaxSize a (400, 400), il GuiObject non può ridimensionarsi a dimensioni inferiori a 200×200 pixel o superiori a 400×400 pixel.
Quando un oggetto UI è sotto il controllo sia di una struttura di layout come UIListLayout che di un UISizeConstraint, il vincolo sovrascriverà il layout e controllerà la dimensione dell'oggetto.
Dimensione del testo
Il UITextSizeConstraint specifica una dimensione del carattere minima e massima per un GuiObject con testo, come un TextLabel, TextButton, o TextBox. Questo vincolo assicura che il testo all'interno di un GuiObject non diventi illeggibile o troppo grande.
Se abiliti la proprietà TextScaled dell'oggetto GuiObject genitore, la dimensione del testo si ridimensiona con le dimensioni del contenitore e rispetta i vincoli anche se l'oggetto diventa più piccolo o più grande rispetto ai valori MinTextSize e MaxTextSize.
Ad esempio, il seguente oggetto TextLabel ha un UITextSizeConstraint con un valore di MinTextSize di 50 e un valore di MaxTextSize di 80. Anche quando il TextLabel diventa più piccolo, il carattere non diventa mai più piccolo di 50 pixel e quando l'oggetto diventa grande, il carattere non supera mai 80 pixel.
Non utilizzare valori di proprietà MinTextSize inferiori a 9 o il testo sarà difficile da leggere per molti spettatori.
Rapporto d'aspetto
Il UIAspectRatioConstraint impone un rapporto d'aspetto larghezza-altezza su un GuiObject indipendentemente dalla sua dimensione base, anche se quella dimensione è impostata come percentuale del suo genitore. Ad esempio, inserendo questo vincolo come figlio di un Frame e impostando la proprietà AspectRatio a 2 (2:1) mantiene la larghezza del frame al doppio della sua altezza. Allo stesso modo, impostando questa proprietà a 0.5 (0.5:1) mantiene la larghezza del frame a metà della sua altezza.
Impostare questa proprietà AspectRatio al valore predefinito di 1 (1:1) è un modo conveniente per prevenire il ridimensionamento/stretching non proporzionale di un ImageLabel con un asset di immagine quadrato, come un avatar thumbnail.
Quando un oggetto UI è sotto il controllo sia di una struttura di layout come UIListLayout che di un UIAspectRatioConstraint, il vincolo sovrascriverà il layout e controllerà la dimensione dell'oggetto.