Dibandingkan dengan UIListLayout , UIGridLayout dan UITableLayout memungkinkan tata letak yang lebih terstruktur dan terorganisasi.Ini paling cocok untuk antarmuka seperti inventaris toko di mana setiap item dapat dipresentasikan dalam grid ubin berukuran sama, atau item dapat disortir ke dalam baris/kolom terkait.
Desain grid
UIGridLayout posisi saudara GuiObjects dalam grid sel seragam dari ukuran yang sama di dalam wadah orang tua mereka.Sel ditambahkan oleh baris atau kolom berdasarkan tata letak FillDirection sampai sel berikutnya tidak pas, maka baris atau kolom baru dimulai.Untuk kontrol lebih lanjut, Anda dapat menggunakan properti FillDirectionMaxCells untuk menetapkan jumlah maksimum sel per baris atau kolom.


Secara default, posisi saudara dalam urutan nilai yang lebih rendah pergi sebelum nilai yang lebih tinggi, dan urutan di mana nilai yang sama diurutkan tergantung pada urutan di mana Anda menambahkannya.Jika Anda mengubah tata letak SortOrder ke Enum.SortOrder.Name , saudara laki-laki disortir dalam urutan alfabetik.
Desain tabel
UITableLayout posisi saudara GuiObjects dan anak-anak mereka ke dalam format tabel.Default FillDirection dari Vertical berarti bahwa saudara kembar pertama ditempatkan ke dalam baris, dan anak-anak saudara kembar ditempatkan secara horizontal untuk membentuk kolom, sehingga setiap sel dalam baris memiliki ketinggian yang sama dan setiap sel dalam kolom memiliki lebar yang sama.


Pola ini meniru struktur baris/kolom HTML standar:
<table><tbody><tr><!-- Row1 --><td>Label 1</td> <!-- TextLabel1 --><td>Label 2</td> <!-- TextLabel2 --><td>Label 3</td> <!-- TextLabel3 --></tr><tr><!-- Row2 --><td>Label 4</td> <!-- TextLabel4 --><td>Label 5</td> <!-- TextLabel5 --><td>Label 6</td> <!-- TextLabel6 --></tr><tr><!-- Row3 --><td>Label 7</td> <!-- TextLabel7 --><td>Label 8</td> <!-- TextLabel8 --><td>Label 9</td> <!-- TextLabel9 --></tr></tbody></table>
Kecuali Anda mengaktifkan properti tata letak FillEmptySpaceColumns atau FillEmptySpaceRows , ukuran saudara GuiObjects menentukan dimensi sel.Sebagai contoh, TextLabel dari ukuran UDim2.new(0.25, 0, 0.1, 0) akan membuat sel tabel dengan lebar 25% dan tinggi 10% di dalam wadah orang tua.