En comparación con UIListLayout , UIGridLayout y UITableLayout permiten diseños más estructurados y organizados.Estos son más apropiados para interfaces como un inventario de tienda donde cada artículo se puede presentar en una cuadrícula de baldosas de tamaño igual, o los artículos se pueden ordenar en filas/columnas relacionadas.
Diseño en cuadrícula
UIGridLayout posiciones hermanas GuiObjects en una cuadrícula de células uniformes del mismo tamaño dentro de su contenedor padre.Las celdas se agrega por fila o columna según el diseño FillDirection hasta que la siguiente celda no encaje, luego comienza una nueva fila o columna.Para un control adicional, puedes usar la propiedad FillDirectionMaxCells para establecer el número máximo de celdas por fila o columna.
Por defecto, posiciones hermanas en orden de sus valores más bajos antes de valores más altos, y valores iguales se ordenan según el orden en que los agregaste.Si cambias el diseño de SortOrder a Enum.SortOrder.Name, los hermanos se ordenan en orden alfabético.
Una vez que insertes un UIGridLayout , anula o influye en el Position y/o Size de todos los objetos de interfaz de usuario hermanos, por lo que los cambios en esas propiedades dentro de la ventana Propiedades o dentro de un script no tendrán el efecto normal.
UIGridLayout respeta cualquier restricción que coloques en objetos dentro de la cuadrícula.Por ejemplo, si un objeto tiene un UISizeConstraint con una propiedad MinSize que es superior a la propiedad de la cuadrícula CellSize, el objeto se extenderá a múltiples celdas.
Diseño de tabla
UITableLayout posiciones hermanas GuiObjects y sus hijos en formato de tabla.El predeterminado FillDirection de Vertical significa que los hermanos se posicionan primero en filas, y los hijos de esos hermanos se posicionan horizontalmente para formar columnas, de modo que cada celda dentro de una fila tenga la misma altura y cada celda dentro de una columna tenga la misma anchura.
Este patrón imita la estructura de fila/columna HTML estándar:
A menos que habilites las propiedades o del diseño, el tamaño del hermano determina las dimensiones de las celdas.Por ejemplo, un TextLabel de tamaño UDim2.new(0.25, 0, 0.1, 0) creará una celda de tabla de 25% de ancho y 10% de altura dentro del contenedor padre.
Una vez que insertes un UITableLayout , anula o influye en el Position y/o Size de todos los objetos de interfaz de usuario hermanos, por lo que los cambios en esas propiedades dentro de la ventana Propiedades o dentro de un script no tendrán el efecto normal.
UITableLayout respeta y es responsivo a cualquier UISizeConstraint que coloques en objetos dentro de la tabla.Por ejemplo, si un objeto tiene un UISizeConstraint con una propiedad MinSize dentro de una celda de encabezado, el resto de las celdas dentro de la columna tendrán el mismo tamaño que la celda de encabezado.
Tenga en cuenta que si la propiedad MaxSize restringe el tamaño de una celda de llenar el espacio asignado de una fila o columna que es más grande que la celda, el objeto se alinea en la parte superior izquierda de la celda.