Diseño de contenedor

Un diseño de contenedor te ayuda a crear un diseño complejo de tu elección de una manera simple y fácil. Cuando se añade un control de disposición de contenedores, se dispone por defecto de un único contenedor. Se pueden añadir contenedores adicionales haciendo clic en el icono "+" del lienzo.

Los contenedores dentro de la disposición de contenedores se pueden reposicionar simplemente arrastrándolos y soltándolos en cualquier lugar dentro de la disposición. Los contenedores se pueden redimensionar arrastrando la esquina del contenedor. Los contenedores pueden borrarse seleccionando el contenedor y presionando la tecla de borrar, o alternativamente desde la vista de árbol.

El control de diseño del contenedor tiene 2 conjuntos de propiedades. Una para la disposición de contenedor y otra para cada uno de los contenedores dentro de la disposición.

Nota:

Los diseños de contenedor se utilizan mejor a nivel de página cuando se desea crear un diseño para una página con diferentes secciones. Para alinear y posicionar los controles dentro de una página, sugerimos utilizar contenedores

Importante:

Se recomienda evitar los diseños de contenedor anidados para facilitar el mantenimiento y la coherencia entre el tiempo de diseño y el tiempo de ejecución.

Propiedades del diseño de contenedor

General

• Información sobre herramientas: información de las herramientas que se mostrará en el diseño de contenedor. Utilízalo para proporcionar información adicional sobre el control.
• Hidden- If selected, hides the control in the runtime.
• Deshabilitado: si se selecciona, deshabilita el control en el tiempo de ejecución.

Eventos

No hay eventos.

Estilo

• Color de fondo: establece el color de fondo del diseño del contenedor.
• Fuente: establece la familia de fuentes para el diseño de contenedor. Todos los contenedores dentro del diseño tendrán la misma familia de fuentes que la del diseño.
• Margin- Sets the margin of the layout. By default 0px margin is set. Top/Bottom and Left/Right margin properties are combined. These properties can be unlinked using the unlink button on the right side of the Margin section heading.
• Relleno: establece el relleno del diseño. Por defecto, se establece un relleno de 0 px. Se combinan las propiedades de los rellenos superiores/inferiores e izquierdos/derechos. Estas propiedades pueden desvincularse mediante el icono de desvinculación situado a la derecha del encabezamiento de la sección de relleno si es necesario establecer valores de relleno diferentes para cada lado.
• Tamaño: la anchura y la altura del diseño se pueden establecer en la sección de tamaño. La anchura por defecto es del 100 %. La altura del diseño se ajusta automáticamente en función de los contenedores que hay en su interior, ya que está configurado como "Automático".

Propiedades de contenedor

General

• Hidden- If selected, hides the control in the runtime.
• Deshabilitado: si se selecciona, deshabilita el control en el tiempo de ejecución.

Eventos

• Seleccionado: configura lo que sucede cuando se hace clic en el contenedor.

Estilo

• Diseño: determina cómo se colocan los controles dentro del contenedor:
  • Direction (Horizontal/Vertical) - Controls are arranged one below the other (vertical) or side by side (horizontal).
  • Alignment- Controls alignment within the template ( Left, Center, Right & Stretch for Vertical direction and Top, Middle, Bottom, Stretch for Horizontal direction).
  • Justify- Top, Middle, Bottom & Distribute for Vertical direction and Left, Center, Right & Distribute for Horizontal direction.
  • Permitir ajustar: si se activa, se ajusta al control en el contenedor si no hay suficiente espacio.
• Color de fondo: establece el color de fondo del diseño del contenedor.
• Borde: establece el borde del control. Se puede configurar el grosor, el color y el radio de la esquina del borde.
• Fuente: establece la familia de fuentes para el contenedor. Todos los controles dentro del contenedor tendrán la misma familia de fuentes que la del diseño.