Obok podstawowego rozmiaru obiektów interfejsu użytkownika, możesz wykorzystać modyfikatory rozmiaru do skalowania obiektu proporcjonalnie lub automatycznego zmieniania rozmiaru. Możesz również wstawić ograniczenia rozmiaru, aby kontrolować proporcję, lub ustawić minimalny i maksymalny rozmiar lub rozmiar tekstu.
Skala
Obiekt UIScale przechowuje wartość numeryczną, która mnoży właściwość AbsoluteSize rodzica GuiObject. Na przykład, Jeśli chcesz, aby obiekt był dwukrotnie większy, niż jest obecnie, możesz wstawić obiekt UIScale z właściwością Scale równą 2.
Ten modyfikator jest przydatny do "przybliżania" podczas projektowania szczegółowego interfejsu użytkownika w Studio, ponieważ proporcjonalnie skaluje obiekt i wszystkie jego dzieci, w tym wszelkie zastosowane modyfikatory wyglądu, takie jak UIStroke lub UICorner. Jest to również użyteczne do tweenu rozmiaru obiektu, na przykład, aby nieco zwiększyć rozmiar przycisku, gdy gracz najedzie na niego myszą.
Automatyczne zmienianie rozmiaru
Właściwość AutomaticSize automatycznie zmienia rozmiar obiektu nadrzędnego GuiObject do rozmiaru jego potomków. Możesz używać tej właściwości w różnych przypadkach, w tym:
- Pozwalanie użytkownikom na wprowadzanie tekstu w obrębie TextBox, automatycznie dostosowując jego rozmiar w zależności od ilości wprowadzonego tekstu.
- Automatyczne dostosowywanie rozmiaru obiektów tekstowych przy użyciu znaczników tekstu wzbogaconego, w tym rodzaju i rozmiaru czcionki.
Możesz włączyć właściwość AutomaticSize dla dowolnego GuiObject. Domyślnie jest ustawiona na None, ale możesz zmienić jej wartość, aby uzyskać szczegółową kontrolę nad tymi kierunkami, w których GuiObject zmienia rozmiar, aby dopasować się do swojego contentu.
ScrollingFrame używa właściwości AutomaticCanvasSize zamiast AutomaticSize. Działa na tej samej zasadzie, ale zmienia rozmiar CanvasSize ramki, a nie jej podstawowego Size.
Aby włączyć automatyczne zmienianie rozmiaru:
W oknie Eksploratora kliknij dowolny GuiObject, taki jak Frame, TextBox lub ImageLabel.
W oknie Właściwości przejdź do właściwości AutomaticSize (AutomaticCanvasSize dla ScrollingFrame) i ustaw ją na jedną z następujących opcji:
- X — Zmienia rozmiar zawartości horyzontalnie.
- Y — Zmienia rozmiar zawartości wertykalnie.
- XY — Zmienia rozmiar zawartości zarówno horyzontalnie, jak i wertykalnie.
Po ustawieniu automatycznego zmieniania rozmiaru, zauważ, że inne właściwości obiektów działają w sposób następujący:
Podobnie jak w przypadku koncepcji rozmiaru obiektu, AutomaticSize bierze pod uwagę właściwość AnchorPoint podczas zmiany rozmiaru zawartości. Na przykład, w poniższym filmie wyświetlane są trzy TextLabels, które automatycznie zmieniają rozmiar od swojego punktu kotwiczenia.
- Górna etykieta ma wartość AnchorPoint równą (0, 0.5), co kotwiczy ją do środka lewej strony.
- Środkowa etykieta ma wartość AnchorPoint równą (0.5, 0.5), co kotwiczy ją do środka.
- Dolna etykieta ma wartość AnchorPoint równą (1, 0.5), co kotwiczy ją do środka prawej strony.
Ograniczenia
Istnieją trzy rodzaje ograniczeń, które możesz użyć dla obiektu interfejsu użytkownika: rozmiar, rozmiar tekstu i proporcja. Aby użyć ograniczenia, musisz ustawić je jako dziecko GuiObject, który chcesz ograniczyć.
Rozmiar
UISizeConstraint określa minimalny i maksymalny rozmiar dla GuiObject. To ograniczenie zapewnia, że GuiObject nie stanie się zbyt mały lub zbyt duży na różnych rozmiarach ekranów.
Na przykład, jeśli ustawisz właściwość MinSize na (200, 200) i właściwość MaxSize na (400, 400), GuiObject nie może zmieniać rozmiaru na mniejszy niż 200×200 pikseli lub większy niż 400×400 pikseli.
Gdy obiekt UI jest kontrolowany zarówno przez strukturę układu, taką jak UIListLayout, jak i przez UISizeConstraint, ograniczenie to nadpisze układ i kontroluje rozmiar obiektu.
Rozmiar tekstu
UITextSizeConstraint określa minimalny i maksymalny rozmiar czcionki dla GuiObject z tekstem, takim jak TextLabel, TextButton lub TextBox. To ograniczenie zapewnia, że tekst w GuiObject nie stanie się nieczytelny lub zbyt duży.
Jeśli włączysz właściwość TextScaled obiektu nadrzędnego GuiObject, rozmiar tekstu zmienia się w zależności od rozmiaru kontenera i respektuje ograniczenia, nawet jeśli obiekt staje się mniejszy lub większy niż wartości MinTextSize i MaxTextSize.
Na przykład, poniższy obiekt TextLabel ma UITextSizeConstraint z wartością MinTextSize równą 50 i wartością MaxTextSize równą 80. Nawet gdy TextLabel staje się mniejszy, czcionka nigdy nie staje się mniejsza niż 50 pikseli, a gdy obiekt staje się duży, czcionka następnie nie przekracza 80 pikseli.
Nie używaj wartości właściwości MinTextSize niższych niż 9, ponieważ tekst może być trudny do przeczytania dla wielu widzów.
Proporcja
UIAspectRatioConstraint wymusza proporcję szerokości do wysokości na GuiObject niezależnie od jego podstawowego rozmiaru, nawet jeśli ten rozmiar jest ustawiony jako procent rodzica. Na przykład, wstawienie tego ograniczenia jako dziecka Frame i ustawienie właściwości AspectRatio na 2 (2:1) utrzymuje szerokość ramki na dwukrotnym wzroście w stosunku do wysokości. Podobnie, ustawienie na 0.5 (0.5:1) utrzymuje szerokość ramki na połowie wysokości.
Ustawienie na domyślne 1 (1:1) jest wygodnym sposobem na zapobieżenie nieproporcjonalnemu skalowaniu/rozciąganiu ImageLabel z kwadratowym zasobem obrazu, takim jak miniaturka awatara.
Gdy obiekt UI jest kontrolowany zarówno przez strukturę układu, taką jak UIListLayout, jak i przez UIAspectRatioConstraint, to ograniczenie nadpisze układ i kontroluje rozmiar obiektu.