Izgara ve tablo düzenleri | Dokümantasyon

UIListLayout ile karşılaştırıldığında, UIGridLayout ve UITableLayout daha yapılandırılmış ve düzenli düzenlemelere olanak tanır. Bunlar, her bir öğenin eşit boyutta karolarla bir ızgarada sunulabileceği bir mağaza envanteri gibi arayüzler için en uygun olandır veya öğeler ilgili satırlara/sütunlara sıralanabilir.

Izgara düzeni

UIGridLayout, kardeş GuiObjects'ları, ana kapsayıcıları içinde aynı boyutta, uniform hücreler şeklinde bir ızgarada konumlandırır. Hücreler, düzenin FillDirection değerine göre satır veya sütun eklenerek yerleştirilir; bir sonraki hücre sığmadığında yeni bir satır veya sütun başlar. Daha fazla kontrol için, satır veya sütun başına maksimum hücre sayısını ayarlamak için FillDirectionMaxCells özelliğini kullanabilirsiniz.

Varsayılan olarak, UIGridLayout, kardeş GuiObjects'ları, LayoutOrder değerlerine göre yerleştirir; daha düşük değerler daha yüksek değerlerden önce gelir ve eşit değerler, eklediğiniz sıraya göre sıralanır. Eğer düzenin SortOrder değerini Enum.SortOrder.Name olarak değiştirirseniz, kardeş öğeler alfabetik sıraya göre sıralanır.

Bir UIGridLayout eklediğinizde, bu durum, tüm kardeş UI nesnelerinin Position ve/veya Size değerlerini geçersiz kılar veya etkiler, bu nedenle bu özelliklerde yapılan değişiklikler Özellikler penceresinde veya bir betik içinde normal etkiyi göstermez.

UIGridLayout, ızgara içindeki nesnelere koyduğunuz herhangi bir kısıtlama'yı dikkate alır. Örneğin, bir nesne, ızgaranın CellSize özelliğinden daha yüksek bir UISizeConstraint ile MinSize özelliğine sahipse, nesne birden fazla hücreyi kapsar.

Tablo düzeni

UITableLayout, kardeş GuiObjects ve bunların çocuklarını tablo formatında konumlandırır. Vertical olan varsayılan FillDirection, kardeşlerin önce satırlara yerleştirildiği ve bu satırlardaki çocukların yatay konumlandırıldığı anlamına gelir, böylece her bir satırdaki hücrelerin yüksekliği aynı, her bir sütundaki hücrelerin genişliği ise aynıdır.

Bu düzen, standart HTML satır/sütun yapısını taklit eder:


<table>
	<tbody>
		<tr>
		<!-- Satır1 -->
			<td>Eşleşme 1</td> <!-- TextLabel1 -->
			<td>Eşleşme 2</td> <!-- TextLabel2 -->
			<td>Eşleşme 3</td> <!-- TextLabel3 -->
		</tr>
		<tr>
		<!-- Satır2 -->
			<td>Eşleşme 4</td> <!-- TextLabel4 -->
			<td>Eşleşme 5</td> <!-- TextLabel5 -->
			<td>Eşleşme 6</td> <!-- TextLabel6 -->
		</tr>
		<tr>
		<!-- Satır3 -->
			<td>Eşleşme 7</td> <!-- TextLabel7 -->
			<td>Eşleşme 8</td> <!-- TextLabel8 -->
			<td>Eşleşme 9</td> <!-- TextLabel9 -->
		</tr>
	</tbody>
</table>

Düzenin FillEmptySpaceColumns veya FillEmptySpaceRows özelliklerini etkinleştirmediğiniz sürece, kardeş GuiObjects'ın boyutu hücrelerin boyutunu belirler. Örneğin, boyutu UDim2.new(0.25, 0, 0.1, 0) olan bir TextLabel, ana kapsayıcı içinde %25 genişliğinde ve %10 yüksekliğinde bir tablo hücresi oluşturur.

Bir UITableLayout eklediğinizde, bu durum, tüm kardeş UI nesnelerinin Position ve/veya Size değerlerini geçersiz kılar veya etkiler, bu nedenle bu özelliklerde yapılan değişiklikler Özellikler penceresinde veya bir betik içinde normal etkiyi göstermez.

UITableLayout, tablo içindeki nesnelere koyduğunuz herhangi bir UISizeConstraint'e saygı duyar ve tepki verir. Örneğin, bir nesne, bir başlık hücresinde UISizeConstraint ile bir MinSize özelliğine sahipse, sütundaki diğer hücreler başlık hücresinin boyutuna eşit olacaktır.

Dikkat edin ki, eğer MaxSize özelliği bir hücrenin, hücreden daha geniş olan bir satır veya sütunun ayrılan alanını doldurmasını kısıtlıyorsa, nesne hücrenin üst sol köşesine hizalanır.