Container¶

Appeareance¶
Backgorund color¶
Rellena el cuerpo del contenedor de un color solido ver más
Background image¶
Rellena el cuerpo del contenedor con una imagen seleccionada ver más
Borders¶
Border Width¶
Asigna el color, ancho y tipo de borde del componente ver más
Border Radius¶
Redondea las esquinas del componente ver más
Dimentions¶
Cambia el tamaño en pixeles del componentes, así mismo los puede cambiar en porcentaje, este porcentaje de dimensiones es directamente proporcional a las dimensiones del dispositivo ver más
Layout¶
Direction¶
Indica la dirección de los componentes hijos dentro de un contenedor ver más
Scroll¶
Con este elemento podemos cambiar la dirección de scroll de los componentes hijos
Horizontal¶
![]() |
![]() |
|---|---|
Al activarlo el contenedor, permite mas objetos hijos sin que estos se encimen entre si o salgan del contenedor y da posibilidad de recorrer de izquierda a derecha el contenedor para visualizar todos los elementos hijos del contenedor

Danger
Al activar esta función, las direcciones alineado hacia arriba y alineado hacia abajo se desactivan dejando disponibles solo alineado a la izquierda y alineado a la derecha
Vertical¶
![]() |
![]() |
|---|---|
Al activarlo el contenedor, permite mas objetos hijos sin que estos se encimen entre si o salgan del contenedor y da posibilidad de recorrer de arriba hacia abajo el contenedor para visualizar todos los elementos hijos del contenedor

Danger
Al activar esta función, las direcciones alineado a la izquierda y alineado a la derecha se desactivan dejando disponibles solo alineado hacia arriba y alineado hacia abajo
Control z-index¶
Este elemento al activarlo (cambiar el valor mayor a 0) se sobrepone a los demás elementos utilizando la dimensión z como su punto base.

Al activar esta función, debemos de posicionar el elemento seleccionado, esto se logra tomando en cuenta las dimensiones del contenedor así como el outer margin y la posición del contenedor con respecto al contenedor al que queremos que se pose encima de él ya que estos nos permitirán la manipulación de la posición del contenedor en el eje z.
Danger
Las dimensiones deben ser en pixeles y no en porcentaje
Si el contendor que queremos posicionar en el eje z esta por debajo de un contendor, debemos saber la altura de nuestro segundo contendor y el outer margin colocar el mismo valor pero en negativo en el valor superior , esto hará que el contenedor en posición z se sobreponga al primer contenedor y ambos bordes inferiores queden alineados (imagen 1), si se requiere dejar un margen de espacio, basta con hacer mas pequeño el outer margin del contenedor en posición z (imagen 2)


Warning
Si el contenedor que vamos a posicionar en z se encuentra primero que el contenedor al que vamos a sobreponer nuestro contenedor, la lógica es la misma solo que en lugar de colocar el valor en el outer margin superior, lo colocamos en el inferior
Info
La misma lógica se aplica para los outer margin laterales
Margins¶
Los margins se utilizan para colocar una espacio entre elementos, ya sea de forma interna o de forma externa ver más
Shadows¶
Con este elemento colocamos sombras a nuestro contenedor, tenemos 6 opciones de sombreado
| Tipo de sombreado | Vista previa |
|---|---|
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
De misma manera, podemos controlar que tan opaco se vería la sombra con la barra Opacity que va de una escala de 0 a 1, siendo 0 transparente y 1 muy opaco

Warning
El elemento Shadows solamente se puede activar cuando el contenedor tiene un color solido en el background, si el background es transparente, no se habilitará para su uso
Control Data¶
Control name¶
Nos sirve para cambiar el nombre al control ver más
Enable dynamic loading¶
Funciona para dar apariencia de cargado al elemento ver más
Control is hidden¶
Funciona para poder ocultar los elementos ver más
Layout¶
Split percentage¶
Esta propiedad nos facilita el poder dividir el contenedor de forma horizontal en el numero de secciones que sumadas deben se 100

Se pueden segmentar en partes iguales o en segmentes pequeños y grandes.
se puede editar directamente el numero de sección, los numero deben ser separados por comas, pero con la restricción que la suma de los segmentos sea 100

Se puede segmentar también desde las opciones que nos ofrece de maneta directa

O ir aumentando o disminuyendo de segmentos con las opciones + , -

Info
Si la suma de segmento no es 100, saldrá un mensa je de alerta
Lock Container¶
Permite bloquear el contenedor y no permite hacer edición de sus dimensiones

OnPress¶

Se activa al presionar el control ver más
OnReachEnd¶

Es un evento que trabaja en conjunto con la función Add Collection to UI, una vez cargada completamente la lista dinámica (de la función Add Collection to UI), este evento se activa para ejecutar las funciones que contenga
OnRefresh¶

Es un evento que trabaja en conjunto con la función Add Collection to UI, una vez cargada completamente la lista dinámica (de la función Add Collection to UI), puedes activar el evento deslizando hacia abajo la lista, generalmente este evento se utiliza para eliminar el caché de a lista y mostrar las nuevamente la lista con los registros nuevos (si es que lo hay).
Este evento ayuda al menor consumo llamadas a la base de datos y ahorrar consumo de Megas de navegación















