UIListLayout umieszcza rodzeństwo GuiObjects w poziomych rzędach lub pionowych kolumnach w obrębie ich rodzica. Kiedykolwiek dodasz lub usuniesz obiekt rodzeństwa, układ dostosowuje się odpowiednio.
Gdy wstawisz UIListLayout, to albo nadpisuje, albo wpływa na Position, Rotation, i/lub Size wszystkich obiektów UI rodzeństwa, więc zmiany tych właściwości w oknie Właściwości lub w skrypcie nie będą miały normalnego efektu.
Kierunek wypełnienia
Właściwość FillDirection określa kierunek, w którym rodzeństwo układu listy będzie renderowane.
Kolejność jest określona przez właściwość SortOrder, która może być rosnąca numerycznie, na podstawie wartości całkowitej LayoutOrder każdego przedmiotu, lub alfanumeryczna na podstawie Name przedmiotu.
Aby odwrócić elementy, na przykład w kolejności z prawej na lewą w poziomej liście, musisz odwrócić sortowanie. Na przykład, jeśli cztery przedmioty są uporządkowane według LayoutOrder w kolejności 0, 1, 2, 3, neguj każdą wartość, aby utworzyć kolejność 0, -1, -2, -3.
Wyrównanie
Właściwości HorizontalAlignment i VerticalAlignment określają odpowiednie wyrównanie X i Y rodzeństwa listy w odniesieniu do siebie nawzajem oraz ogólnych granic listy w obrębie jej kontenera. Na przykład, lista wypełniona poziomo z VerticalAlignment ustawionym na Center centralnie wyrównuje rodzeństwo listy względem siebie i centruje listę pionowo w jej kontenerze.
HorizontalAlignment oraz VerticalAlignment różnią się nieznacznie od wyrównania linii przedmiotów w układzie flex, co pozwala na wyrównanie przedmiotów na tej samej linii bez stosowania tego samego wyrównania do ogólnych granic listy w jej kontenerze.
Zawijanie
Boolean Wraps kontroluje, czy rodzeństwo w obrębie kontenera parent zawija się do nowej linii, gdy ich domyślny rozmiar przekracza szerokość/wysokość granic kontenera.
Wypełnienie
Właściwość Padding określa ilość pustej przestrzeni między każdym elementem listy, ustawioną na skalę (procent rozmiaru kontenera w bieżącym kierunku) lub na offset (statyczna wartość przestrzeni podobna do rozmiaru w pikselach).
Ta właściwość nie stosuje wypełnienia dookoła ogólnych granic listy; zobacz UIPadding, aby zastosować wypełnienie górne, dolne, lewe i/lub prawe do zawartości rodzica.
Układy flex
Integracja flex w UIListLayout to potężny sposób na równe wypełnienie/rozdysponowanie lub wyrównanie/rozciąganie elementów listy wzdłuż ich linii, lub elastyczne konkretne przedmioty w zmiennej przestrzeni.
Chociaż flex jest potężnym narzędziem, nie powinieneś go stosować w UIListLayout bez celu, ponieważ dodaje mały koszt wydajności w porównaniu do układu bez flex, szczególnie podczas zmiany rozmiaru układu lub dynamicznego dodawania/usuwania elementów flex.
Dodatkowo, układ siatki może być preferowany, gdy elementy powinny ściśle pasować do siatki zarówno w kierunku X, jak i Y, ponieważ układy siatki wymuszają stały rozmiar komórki, podczas gdy układy flex mogą używać zmiennej liczby elementów na linię.
Równe wypełnienie lub rozdzielenie
Gdy kierunek wypełnienia układu listy jest ustawiony na Horizontal, właściwość HorizontalFlex określa, jak rozdzielić dodatkową przestrzeń poziomą w kontenerze rodzica. Podobnie, gdy kierunek wypełnienia jest ustawiony na Vertical, właściwość VerticalFlex określa, jak rozdzielić dodatkową przestrzeń pionową.
Praktycznym zastosowaniem HorizontalFlex jest interfejs okna zakładkowego, w którym flex równomiernie wypełnia pasek zakładek, niezależnie od liczby zakładek. Nie ma prostszego podejścia niż flex w tym przypadku, ponieważ automatycznie oblicza szerokość każdej zakładki bez określonych przez dewelopera ustawień szerokości i automatycznie dostosowuje się, jeśli liczba zakładek się zmienia.
Wyrównanie linii przedmiotów
Właściwość ItemLineAlignment definiuje wyrównanie w kierunku przeciwnym rodzeństwa w obrębie jednej linii, umożliwiając wyrównanie obiektów o różnych szerokościach/wysokościach lub sprawienie, aby obiekty o mniejszych szerokościach/wysokościach wypełniały swoją linię.
Praktycznym przypadkiem użycia dla ItemLineAlignment jest rozciągnięcie serii kafelków o niejednorodnych rozmiarach, aby wypełniły cały swój wiersz (Stretch), co sprawia, że układ jest bardziej spójny.
Elastyczne indywidualne przedmioty
Chociaż elastyczne całe układy są potężnym narzędziem, niektóre układy są bardziej odpowiednie do elastycznego przedmiotu indywidualnego. W takich układach niektóre elementy na liście utrzymują swój podstawowy rozmiar, podczas gdy inne przedmioty elastycznie wypełniają zmienne przestrzenie. Praktycznym zastosowaniem jest widżet suwaka z jednolitymi etykietami na obu końcach i elastyczną belką suwaka, która wypełnia całą szerokość pomiędzy.
Aby ustawić jeden konkretny element listy jako elastyczny, wstaw UIFlexItem jako dziecko elastycznego elementu, a następnie ustaw jego właściwość FlexMode na Fill, Grow, Shrink, lub Custom.
