|
|
|
|
- Presentación del control Disposición
- Crear un control Disposición
- Crear control
- Crear un control Disposición por refactorización
- Control Disposición en un control Looper
- Características del control Disposición
- Pestaña General
- Pestaña Detalles
- Ejemplo de diferentes tipos de desbordamiento
- Control Disposición y Responsive Web Design
Presentación del control Disposición El control Disposición simplifica la implementación de interfaces dinámicas en las que se muestran u ocultan controles mediante programación. Cuando se oculta un control (por ejemplo, mediante la propiedad Visible), el control Disposición reposiciona automáticamente los demás controles para mantener la interfaz ordenada y evitar los "espacios". Los controles Disposición están disponibles en modo vertical y horizontal. El control Disposición está compuesto por celdas. Las celdas contienen los controles que se encuentran en el control Disposición. Cada celda puede contener cualquier tipo de control, incluyendo otro control Disposición. Los controles se pueden mostrar u ocultar. Las celdas se pueden crear en la pestaña "General" de la descripción del control o en el menú contextual del control Disposición. Crear un control Disposición Crear control Para crear un control Disposición: - En la pestaña "Creación", en el grupo "Contenedores", despliegue "Disposición " y elija la orientación: horizontal o vertical.
- Haga clic en la ventana o página en la ubicación en la que desea crear el control. El control aparece en el editor.
Observación: Las dimensiones del control que se creó se optimizan para ocupar el espacio disponible en la ubicación indicada. Si es necesario, cambie el tamaño del control usando los controladores de tamaño. - Agregue celdas en el control Disposición. Las celdas se pueden agregar:
- mediante el menú contextual del control (opción "Insertar una celda").
- en la pestaña "General" de la descripción del control (botón "Agregar").
- Agregue controles en las celdas del control Disposición.
- Configure los anclajes de los controles que están dentro del control Disposición y especifique cómo se adaptan al contenido. Para obtener más información, consulte:
Para ver las características del control, seleccione la opción "Descripción" en el menú contextual. Crear un control Disposición por refactorización Un control Disposición también se puede crear a partir de los controles existentes: - Seleccione los controles que desea incluir en el control Disposición.
- En la pestaña "Modificación", en el grupo "Transformaciones", despliegue "Refactorización y permutaciones" y seleccione "Crear una disposición a partir de la selección".
- Un control Disposición se crea automáticamente, y también se crea una celda por cada control ubicado en una fila diferente.
Control Disposición en un control Looper Características del control Disposición Las características del control Disposición se encuentran en las pestañas "General" y "Detalles" de la ventana de descripción del control. Pestaña General La pestaña "General" permite gestionar las diferentes celdas del control Disposición. Es posible: - agregar, duplicar o eliminar celdas.
- modificar el orden de las celdas usando las flechas.
- modificar los parámetros de la celda actual. Es posible:
- Hacer que la celda se muestre o no (estado inicial).
- Definir el alto y alto máximo de la celda:
- El alto corresponde al tamaño mínimo de la celda.
- Si se especifica el alto máximo de la celda, este no se podrá exceder.
- Ocupar todo el espacio disponible. Esta opción está disponible si no se seleccionó la opción "En caso de desbordamiento: "Ampliar control y desplazar los controles que están alrededor" (en la pestaña "Detalles" de la ventana de descripción del control).
Pestaña Detalles La pestaña "Detalles" permite definir los parámetros de presentación del control Disposición. Las opciones disponibles son: - Disposición: Permite especificar si el control Disposición gestiona la disposición de los controles vertical u horizontalmente.
- Horizontal: Las celdas se muestran en una sola fila y ocupan todo el alto del control. Solo se puede modificar el ancho.
- Vertical: Las celdas se muestran en una sola columna y ocupan todo el ancho del control. Solo se puede modificar el alto.
- Fijar celdas: Permite especificar la alineación de las celdas en el control de acuerdo con la disposición seleccionada.
- Si la disposición es vertical, las celdas se pueden alinear arriba o abajo.
- Si la disposición es horizontal, las celdas se pueden alinear a la izquierda o a la derecha.
- Gestionar desbordamiento:
- Ampliar control y desplazar los controles que están alrededor: el control se amplía para mostrar todas las celdas.
- Si hay controles abajo o a la derecha, estos se desplazan.
- Si se reduce el tamaño de una o más celdas, el control Disposición se adapta sin reducirse más allá de su tamaño inicial.
- Los controles que se encuentran abajo o a la derecha se mueven para adaptarse al nuevo tamaño.
- La ventana nunca se reduce.
- Mostrar una barra de desplazamiento automáticamente: el área cliente del control se amplía y se agregan barras de desplazamiento para desplazarse por el control.
- Truncar contenido: No se aplica ninguna adaptación, las celdas se truncan.
- La opción "Reducir padre" permite reducir el padre si es necesario. Si la ventana es el padre, se reducirá la próxima vez que se abra.
Observación: Cuando esta opción está habilitada, se deben ocultar las celdas o los controles de las celdas en el evento "Declaraciones globales" de la ventana, o en el evento "Inicialización" de los controles.
- Margen entre celdas: Espacio entre las celdas del control Disposición. Este espacio se expresa en pixeles. Puede cambiarse mediante programación con la propiedad MarginInterCell.
Ejemplo de diferentes tipos de desbordamiento Ejemplo: Control Disposición creado en el editor de ventanas. Este control Disposición contiene: - Varias celdas que permiten mostrar los diferentes controles de un formulario.
- Un control Disposición horizontal con 2 botones, que se muestran u ocultan dependiendo de si hay un número de teléfono y/o dirección de correo electrónico.
Ejemplo 1: Ampliar control y desplazar los controles que están alrededor - Durante una prueba (Go), todos los controles se muestran en la ventana.
- Al borrar el número de teléfono y la dirección de correo electrónico, el control Disposición se reduce, pero la ventana conserva el mismo tamaño.
- Al ingresar el número de teléfono, la dirección de correo electrónico y un comentario, tanto el control Disposición como la ventana se amplían.
Ejemplo 2: Mostrar una barra de desplazamiento automáticamente - Durante una prueba (Go), todos los controles se muestran en la ventana.
- Al agregar un comentario, una barra de desplazamiento se añade automáticamente en el control Disposición para desplazarse por los diferentes elementos.
Ejemplo 3: Truncar contenido - Durante una prueba (Go), todos los controles se muestran en la ventana.
- Al agregar un comentario, el contenido que desborda el control Disposición no se muestra.
Esta página también está disponible para…
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|