PC SOFT

AYUDA EN LÍNEA
DE WINDEV, WEBDEV Y WINDEV MOBILE

Este contenido proviene de una traducción automática.. Haga clic aquí para ver la versión original en inglés.
  • Resumen de control Disposición
  • Creación de una control Disposición
  • Creando el control
  • Creación de la control Disposición mediante refactorización
  • control Disposición en un control Looper
  • Características de control Disposición
  • Ficha General
  • Ficha Detalles
  • Ejemplo de diferentes tipos de desbordamiento
  • control Disposición y Diseño Web con capacidad de respuesta
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReportes y ConsultasCódigo de Usuario (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Código Navegador
WINDEV Mobile
AndroidWidget Android iPhone/iPadApple WatchUniversal Windows 10 AppWindows Mobile
Otros
Procedimientos almacenados
Resumen de control Disposición
El control Disposición simplifica la implementación de GUIs dinámicas donde los controles son mostrados y/u ocultados por la programación.. Cuando un control se convierte en Invisible (a través de ..Visible por ejemplo), el control Disposición se utiliza para reposicionar automáticamente todos los demás control s para mantener una interfaz armoniosa y evitar "agujeros".
La control Disposición está disponible en modo vertical y horizontal.
El control Disposición incluye celdas que contienen los controles que se encuentran en el control Disposición. Cada celda puede contener cualquier control , incluido otro control Disposición. Estos controles pueden ser Visible o no.
Estas celdas pueden ser creadas a través de la pestaña "General" en la ventana de description de control Disposición o a través de el menú contextual de control.
Creación de una control Disposición

Creando el control

Para crear una control Disposición:
  1. En el panel "Creación", en el grupo "Contenedores", amplíe "Diseño" y elija la orientación: horizontal o vertical.
  2. Haga clic en la ventana o página en la posición en la que desea crear el control.. El control aparece en modo de creación.
    Observación: Las dimensiones del control están optimizadas para ocupar el espacio disponible en la posición especificada. Si el tamaño de la control no te conviene, cambia el tamaño de la control a través de sus asas.
  3. Añade las células a la control Disposición. Estas células pueden ser añadidas:
    • a través de el menú contextual de control (opción "Insertar una celda").
    • a través de la pestaña "General" del control description (botón "Add").
  4. Añade los controles en las diferentes células que se encuentran en la control Disposición.
  5. Configurar el anclaje de los controles que se encuentran en la control Disposición, especialmente la adaptación al contenido.. Para obtener más detalles, consulte:
Para ver las características del control, seleccione la opción "Descripción" en el menú contextual del control.
Para manipular la control Disposición, véase Manejo de una control Disposición por programación.

Creación de la control Disposición mediante refactorización

La control Disposición también se puede crear a partir de los controles existentes:
  1. Seleccione los controles que se incluirán en el control Disposición.
  2. En la pestaña "Modificación", en el grupo "Transformaciones", expanda "Refactorización e intercambio" y seleccione "Crear un diseño a partir de la selección"..
  3. El control Disposición se crea automáticamente y se crea una celda para cada control encontrado en un Line diferente.

control Disposición en un control Looper

WINDEVAndroidiPhone/iPad Una control Disposición se puede utilizar en un control Looper: para ello, utilice un control Looper cuyo contenido corresponda a "Usar una ventana interna por fila". En este caso, la ventana interna contendrá el control Disposición con los controles necesarios. Ver Mostrar un contenido diferente en cada fila para más detalles.
WEBDEV - Código ServidorWEBDEV - Código Navegador La control Disposición no se encuentra en un control Looper.
Características de control Disposición
Las características de control Disposición se agrupan en la pestaña "General" y en la pestaña "Detalles" de la ventana description de control.

Ficha General

La pestaña "General" sirve para gestionar las diferentes celdas que se encuentran en control Disposición. Es posible:
  • añadir, duplicar o eliminar una célula a través de los diferentes botones.
  • modificar el orden de las celdas mediante los botones de flecha.
  • modificar los parámetros de la célula actual. Es posible:
    • Hacer que la celda sea Visible o no (estado inicial).
    • Definir la altura y la altura máxima de la célula:
      • La altura corresponde al tamaño mínimo de la célula.
      • La altura máxima de la célula no puede ser excedida si se especifica.
    • Ocupar todo el espacio disponible. Esta opción está disponible si "En caso de desbordamiento: Ampliar o reducir la control, mover los control s alrededor" no fue seleccionado (pestaña "Detalles" en la ventana description de control).
WEBDEV - Código ServidorPHP La pestaña "General" también se utiliza para definir el estilo CSS de la celda actual.

Ficha Detalles

La pestaña "Detalles" sirve para definir los parámetros de presentación de control Disposición. Las opciones disponibles son:
  • Layout: Se utiliza para especificar si control Disposición gestiona la disposición de los controles vertical u horizontalmente..
    • Horizontal: Las celdas se muestran en una sola fila y ocupan toda la altura de control. Sólo el ancho puede ser modificado.
    • Vertical: Las celdas se muestran en una sola columna y ocupan todo el ancho de control. Sólo la altura puede ser modificada.
  • Fijar celdas: Se usa para especificar la alineación de las celdas en el control acuerdo con el diseño seleccionado.
    • Si la disposición es vertical, las celdas pueden ser alineadas a la parte superior o inferior.
    • Si la disposición es horizontal, las celdas pueden ser alineadas a la izquierda o a la derecha.
  • Gestionar desbordamiento:
    • Ampliar el control mueve los control alrededor de : el control se amplía para mostrar todas las celdas.
      • Si los control se encuentran debajo del control o a la derecha del control, son "empujados".
      • Si una o más celdas son reducidas, la control Disposición es redimensionada sin ser reducida por debajo de su tamaño inicial..
      • Los controles que se encuentran abajo o a la derecha se mueven según el cambio de tamaño aplicado.
      • La ventana nunca se reduce.
    • Dmuestra una barra de desplazamiento automáticamente: el área de clientes de control se amplía y las barras de desplazamiento se muestran para desplazarse en el control.
    • Trunca el contenido: No se realiza ninguna adaptación, la visualización de las células está truncada.
    • WINDEVAndroidiPhone/iPad Ampliar o reducir el control mueve los control alrededor de : El control se amplía o reduce para mostrar todas las celdas.
      • Si los control se encuentran debajo del control o a la derecha del control, son "empujados".
      • Si se reducen una o más celdas, se redimensiona el control Disposición.
      • Los controles que se encuentran abajo o a la derecha se mueven según el cambio de tamaño aplicado.
      • La ventana puede ser ampliada o reducida.
      WINDEVAndroidiPhone/iPad La opción "Reducir padre" permite reducir el valor del padre si es necesario. Si el padre es la ventana, la reducción se aplicará al inicializar la ventana.
      Observación: Cuando esta opción está activada, las celdas o los controles de celdas deben estar ocultos en las "Declaraciones globales" de la ventana de Event, o en la "Inicialización" de Event de los controles.
  • Margen entre celdas: Especulación entre las celdas de la control Disposición. Este espacio se expresa en píxeles. Se puede modificar mediante programación a través de ..MarginInterCell.
WINDEVAndroidiPhone/iPad Observaciones:
  • Atención: un control Disposición no se puede ampliar si la ventana se maximiza sin barra de desplazamiento (porque la ventana no se puede ampliar).
  • Para reducir una ventana después de su apertura (una vez que se han ocultado los controles, por ejemplo), utilice LayoutAdaptSize. Esta función está disponible a partir de la versión 230050.
  • Caso especial: RTF control Estático: En Windows 7 (y anteriores), no se puede calcular el ancho de una control Estático RTF.. Por lo tanto, la adaptación de control en anchura no puede hacerse.

Ejemplo de diferentes tipos de desbordamiento

Ejemplo: Se crea una control Disposición en el editor de ventanas.
Control Disposición: Ejemplo de diferentes tipos de desbordamiento
This control Disposición contiene:
  • Varias celdas utilizadas para mostrar los diferentes controles de forma.
  • Un control Disposición horizontal que contiene 2 botones, mostrados (o no) de acuerdo a la presencia del número de Phone y/o el correo electrónico Address.
Ejemplo 1: Ampliar el control mueve los control alrededor de
  • En Go, la ventana muestra todos los controles.
    La ampliación de la control mueve los control s alrededor
  • Al borrar el número de Phone y el correo electrónico Address, los controles de diseño se reducen pero la ventana mantiene el mismo tamaño.
  • Al añadir el número de teléfono, la dirección de correo electrónico y un comment, el control Disposición se amplía, así como la ventana.
    La ampliación de la control mueve los control s alrededor
Ejemplo 2: Dmuestra una barra de desplazamiento automáticamente
  • En Go, la ventana muestra todos los controles.
  • Cuando se añade una comment, se muestra automáticamente una barra de desplazamiento en la control Disposición para poder desplazar los diferentes elementos mostrados.
    Mostrar una barra de desplazamiento automáticamente
Ejemplo 3: Trunca el contenido
  • En Go, la ventana muestra todos los controles.
  • Cuando se agrega un comment, el contenido que no cabe dentro del control Disposición no se muestra.
WINDEVAndroidiPhone/iPad Ejemplo 4: Ampliar o reducir el control mueve los control alrededor de Ejemplo 4: Ampliar el control mueve los control s alrededor de mientras se gestiona la reducción de la ventana mediante la programación
  • En Go, la ventana muestra todos los controles.
  • Al borrar el número de Phone y el correo electrónico Address, se reducen los controles de diseño, así como la ventana.
    De hecho, al borrar el control, LayoutAdaptSize redimensiona el control Disposición para evitar tener un área vacía. También redimensiona la ventana, permitiéndole volver a su tamaño inicial.
  • Al añadir el número de teléfono, la dirección de correo electrónico y un comment, el control Disposición se amplía, así como la ventana.
Atención: Esta característica debe ser usada con mucho cuidado: En efecto, según el contenido de la ventana, pueden producirse efectos inesperados (ventana reducida mientras que los controles deben ser mostrados en otro plano, ...).
WEBDEV - Código Servidor
control Disposición y Diseño Web con capacidad de respuesta
El diseño control está disponible en el modo de Diseño Web de Respuesta. Puede configurar por rango de resolución:
  • la altura y la máxima altura de las células,
  • la disposición de control Disposición (horizontal o vertical).
Puedes ocultar las celdas al cargar el rango de resolución usando el evento "Siempre cambiando rango de resolución" associated con la página.
Versión mínima requerida
  • Versión 23
Esta página también está disponible para…
Comentarios
Video Layout
https://youtu.be/yf8JnaFicEw

https://windevdesenvolvimento.blogspot.com/2019/05/dicas-2108-windev-webdev-mobile-dicas.html
amarildo
14 05 2019
WINDEV MOBILE
Cuando pones el control en Windev Mobile compilado para IOS, el sistema no hace scroll en el dispositivo final. ¿Alguien sabe si es algún error del control? La opción que no funciona es "Display a scrollbar automatically".
PEDRO REYES
22 02 2019
mostrando string mais de uma Linha com layout
Video mostrando string mais de uma Linha com layout

https://youtu.be/LefbqYuncYs

Grupo Privado Amarildo Mestre Jedi

https://groups.google.com/d/forum/amarildowindev
De matos
18 05 2018
NESSA AULA VOU MOSTRAR Layout
Video mostrando o funcionamento do Layout

https://www.youtube.com/channel/UCQGPHrppG5XKoRbeOIgLJEA

Grupo Privado Amarildo Mestre Jedi

https://groups.google.com/d/forum/amarildowindev
De matos
18 05 2018