La sección es uno de los nodos más importantes en Voltapp, ya que es la que se utiliza para colocar todos los elementos (nodos) en relación con los demás.

Componentes

Sección

Una sección es un nodo que contiene varios otros nodos hijos y decide cómo están dispuestos en relación con los demás. El orden de los nodos hijos en el árbol de la izquierda de la pantalla corresponde al orden en el que se muestran en la pantalla.

Puede crear un número infinito de nodos de sección dentro de una sección, lo que le permite crear una disposición y distribución de los diferentes nodos como desee en la pantalla.

Dirección

Selecciona si las secciones serán horizontales o verticales.

Align

Puede alinear la sección en el borde derecho, izquierdo o central.

Split

Puede elegir si las secciones se distribuirán en el borde superior, inferior o central.

Spacing

Permite elegir el espaciado entre secciones.

Off

Puede activar o desactivar las secciones.

Estilo

El estilo gestiona las propiedades visuales generales aplicadas a este nodo.

Antecedentes

Controla el fondo (imagen, color o degradado) del nodo.

Opacidad

Controla la opacidad del nodo.

Redondeo

Controla el radio de redondeo de las esquinas exteriores del nodo. Puede establecer el radio para todas las esquinas (superior izquierda, superior derecha, inferior izquierda, inferior derecha) o para cada esquina individualmente.

Border

Controla la forma, el color y el grosor del borde del nodo.

Grosor**: El grosor del borde. Puede establecer el grosor de todos los bordes (superior, izquierdo, derecho, inferior) o de cada uno de ellos individualmente.
Forma**: el estilo del borde.
Color**: el color del borde.

Shadows

Permite añadir una o varias sombras a un nodo. Cada sombra está definida por :

tipo** : si la sombra está dentro o fuera de la caja del nodo.
x:** especifica la distancia horizontal. Los valores negativos colocan la sombra a la izquierda del elemento.
y**: especifica la distancia vertical. Los valores negativos colocan la sombra por encima del elemento.
Desenfoque**: cuanto mayor sea este valor, mayor será el desenfoque, por lo que la sombra se hace más grande y más clara.
Dispersión**: los valores positivos hacen que la sombra se expanda y crezca, los valores negativos hacen que la sombra se reduzca.

Blur

Aplica el desenfoque sólo al fondo del nodo, para crear un efecto de cristal al estilo de iOS. Cuanto mayor sea el valor, mayor será el desenfoque.

Layout

El diseño le permite colocar y posicionar su nodo en relación con sus hermanos (los del mismo nodo padre).

Ancho

Controla la anchura del nodo.

px**: Establece el ancho del nodo en píxeles.
Define la anchura del nodo como un porcentaje de la anchura de su padre.
fit**: ajusta automáticamente el ancho del nodo según el ancho de su contenido.
grow**: especifica cuánto espacio restante del padre debe asignarse al nodo.

Altura

px**: establece la altura del nodo en píxeles.
%: establece la altura del nodo como un porcentaje de la anchura de su padre.
fit**: determina automáticamente la altura del nodo en función de la anchura de su contenido.
grow**: especifica cuánto espacio restante del padre debe asignarse al nodo.

Top

Controla el margen superior entre el nodo y su vecino.

px** : define el margen en píxeles.
%: establece el margen en porcentaje del ancho de su padre.
auto**: establece automáticamente el margen al espacio restante en su padre. Si hay varios nodos con el margen superior fijado en automático, el espacio restante se divide en partes iguales entre cada nodo.

Right

Controla el margen derecho entre el nodo y su vecino.

px** : define el margen en píxeles.
%: establece el margen en porcentaje a la anchura de su padre.
auto**: establece automáticamente el margen al espacio restante en su padre. Si hay más nodos cuyo margen superior está configurado como automático, el espacio restante se divide en partes iguales entre cada nodo.

Bottom

Controla el margen inferior entre el nodo y su vecino.

px**: establece el margen en píxeles.
%: establece el margen como un porcentaje del ancho de su padre.
auto**: establece automáticamente el margen al espacio restante de su padre. Si hay más nodos con un margen mayor que auto, el espacio restante se divide en partes iguales entre cada nodo.

Left

Controla el margen izquierdo entre el nodo y su vecino.

px**: establece el margen en píxeles.
Define el margen como un porcentaje del ancho de su padre.
auto**: establece automáticamente el margen al espacio restante en su padre. Si hay más nodos con un margen más alto establecido en auto, el espacio restante se divide en partes iguales entre cada nodo.

Shrinkage

Factor de encogimiento de los hijos del nodo. Si se establece en 0, el nodo no puede encogerse.