Grootte-modifiers en beperkingen

Naast de basis grootte van UI-objecten, kun je grootte-modifiers gebruiken om een object proportioneel te schalen of het automatisch te laten aanpassen. Je kunt ook groottebeperkingen invoegen om de aspectverhouding te controleren, of om een minimum en maximum grootte of tekstgrootte in te stellen.

Schalen

Een UIScale object slaat een numerieke waarde op die de AbsoluteSize eigenschap van het bovenliggende GuiObject vermenigvuldigt. Bijvoorbeeld, als je wilt dat een object twee keer zo groot is als het momenteel is, kun je een UIScale object invoegen met een Scale eigenschap van 2.

Deze modifier is nuttig voor het "inzoomen" tijdens het ontwerpen van een gedetailleerde gebruikersinterface in Studio, omdat het het object en al zijn kinderen proportioneel schaalt, inclusief eventuele toegepaste verschijning-modifiers zoals UIStroke of UICorner. Het is ook nuttig om de grootte van een object te tweeneren, bijvoorbeeld om de grootte van een knop iets te vergroten wanneer een speler zijn muis eroverheen beweegt.

Automatische sizing

De AutomaticSize eigenschap past automatisch de grootte van een bovenliggend GuiObject aan op basis van de grootte van zijn afgeleiden. Je kunt deze eigenschap in verschillende gevallen gebruiken, waaronder:

• Het uitbreiden van een GuiObject om tekst die in veel talen is gelokaliseerd te passen.
• Gebruikers toestaan om tekst in te voeren binnen een TextBox, waarbij de grootte automatisch wordt aangepast op basis van de hoeveelheid ingevoerde tekst.
• De grootte van tekstobjecten automatisch aanpassen met behulp van rijke tekstmarkup, inclusief lettertype en grootte.

Je kunt de AutomaticSize eigenschap inschakelen voor elk GuiObject. Standaard is deze ingesteld op None, maar je kunt de waarde wijzigen om specifieke controle te hebben over welke richting(en) het GuiObject zich aanpast om zijn inhoud te passen.

Om automatische sizing in te schakelen:

1. Klik in het Explorer venster op een willekeurig GuiObject, zoals een Frame, TextBox, of ImageLabel.

2. Navigeer in het Properties venster naar de AutomaticSize eigenschap (AutomaticCanvasSize voor ScrollingFrame) en stel deze in op een van de volgende opties:

   • X — Past de inhoud horizontaal aan.
   • Y — Past de inhoud verticaal aan.
   • XY — Past de inhoud zowel horizontaal als verticaal aan.

   

Zodra automatische sizing is ingesteld, let op dat andere objecteigenschappen als volgt werken:

Vergelijkbaar met het concept van grootte van een object, houdt AutomaticSize rekening met de AnchorPoint eigenschap bij het aanpassen van de inhoud. Bijvoorbeeld, de volgende video toont drie TextLabels die automatisch worden aangepast vanaf hun ankerpunt.

• Het bovenste label heeft een AnchorPoint waarde van (0, 0.5) wat het aan de middelste van de linkerkant verankert.
• Het middelste label heeft een AnchorPoint waarde van (0.5, 0.5) wat het in het midden verankert.
• Het onderste label heeft een AnchorPoint waarde van (1, 0.5) wat het aan de middelste van de rechterkant verankert.

Beperkingen

Er zijn drie soorten beperkingen die je kunt gebruiken voor een gebruikersinterface-object: grootte, tekstgrootte, en aspect verhouding. Om een beperking te gebruiken, moet je deze instellen als een kind van het GuiObject dat je wilt beperken.

Grootte

De UISizeConstraint specificeert een minimum en maximum grootte voor een GuiObject. Deze beperking zorgt ervoor dat het GuiObject niet te klein of te groot wordt op verschillende schermformaten.

Bijvoorbeeld, als je de MinSize eigenschap instelt op (200, 200) en de MaxSize eigenschap op (400, 400), kan het GuiObject niet kleiner schalen dan 200×200 pixels of groter dan 400×400 pixels.

Tekstgrootte

De UITextSizeConstraint specificeert een minimum en maximum lettergrootte voor een GuiObject met tekst, zoals een TextLabel, TextButton, of TextBox. Deze beperking zorgt ervoor dat de tekst binnen een GuiObject niet onleesbaar of te groot wordt.

Als je de TextScaled eigenschap van het bovenliggende GuiObject inschakelt, schaalt de tekstgrootte mee met de grootte van de container en respecteert het beperkingen, zelfs als het object kleiner of groter wordt dan de MinTextSize en MaxTextSize waarden.

Bijvoorbeeld, het volgende TextLabel object heeft een UITextSizeConstraint met een MinTextSize waarde van 50 en een MaxTextSize waarde van 80. Zelfs wanneer de TextLabel kleiner wordt, wordt het lettertype nooit kleiner dan 50 pixels, en wanneer het object groot wordt, overschrijdt het lettertype nooit 80 pixels.

Aspectverhouding

De UIAspectRatioConstraint handhaaft een breedte‑tot‑hoogte aspectverhouding op een GuiObject, ongeacht de kernmaat, zelfs als die maat als een percentage van de bovenliggende is ingesteld. Bijvoorbeeld, deze beperking invoegen als een kind van een Frame en de AspectRatio eigenschap instellen op 2 (2:1) houdt de breedte van het frame op twee keer die van de hoogte. Evenzo, het instellen van deze beperking's AspectRatio eigenschap op 0.5 (0.5:1) houdt de breedte van het frame op de helft van die van de hoogte.

Het instellen van deze beperking's AspectRatio op de standaardwaarde van 1 (1:1) is een handige manier om niet-proportionele schaling/strekken van een ImageLabel met een vierkante afbeeldingselement te voorkomen, zoals een avatar-miniatuur.