AYUDA EN LÍNEA
 WINDEVWEBDEV Y WINDEV MOBILE

Este contenido se ha traducido automáticamente.  Haga clic aquí  para ver la versión en inglés.
Ayuda / Editores / Editor de ventanas y de páginas / Editor de ventanas
  • Presentación
  • Implementación
  • Creación de un nuevo diseño para una ventana WINDEV Mobile
  • Creación de un nuevo diseño para una ventana interna
  • Manejo de layouts
  • Gestión de controles en los layouts
  • Menú contextual de controles específicos de los diseños
  • Caso especial de la Action Bar
  • Menú contextual de diseños
  • Comparación de ventanas con diseños
  • Gestionar los diseños en tiempo de ejecución
  • Modo de funcionamiento Default
  • Programación
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReportes y ConsultasCódigo de Usuario (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Código Navegador
WINDEV Mobile
AndroidWidget Android iPhone/iPadIOS WidgetApple WatchMac CatalystUniversal Windows 10 App
Otros
Procedimientos almacenados
Presentación
Los layouts permiten definir varias vistas de una ventana en el mismo proyecto sin duplicar la ventana.
Así, en una aplicación WINDEV o WINDEV Mobile , se puede definir, por ejemplo:
  • una vista específica para el modo vertical,
  • una vista específica para el modo horizontal,
  • una vista específica para teléfono,
  • una vista específica de la tableta,
  • ...
En tiempo de ejecución, puedes:
Esta página de ayuda presenta:
Observación: También puede crear diseños en proyectos WEBDEV para sitios web aptos para móviles get. Para obtener más información, consulte Layouts WEBDEV.
Implementación
Universal Windows 10 AppAndroidiPhone/iPad

Creación de un nuevo diseño para una ventana WINDEV Mobile

Para crear un nuevo diseño para una ventana:
  1. Abrir la ventana correspondiente en el editor.
  2. En la pestaña "Ventana", en el grupo "Layouts", despliegue "Layouts" y seleccione "Agregar layouts".
    Agregar layouts
  3. La asistente para añadir un diseño comienza. Pasar el paso de presentación si es necesario.
  4. El asistente le pide que seleccione una opción para gestionar las diferencias entre teléfonos y tabletas.
    Diferencias de la tabla/Phone
    Puede:
    • Elija sólo la plataforma actual (sólo Phone o sólo tableta).
    • Crear diseños (porque los controles están organizados de forma diferente en la tableta y en la Phone).
    • Use los anclajes solamente (porque los anclajes son suficientes para reposicionar los controles en la ventana de acuerdo a su tamaño)..
  5. Pase a la etapa siguiente del asistente.
  6. El asistente le pide que seleccione una opción para gestionar la orientación Vertical/Horizontal de la aplicación.
    Vertical / Horizontal
    Puede:
    • Crear diseños (porque los controles están organizados de forma diferente en la tableta y en la Phone).
    • Utilice los anclajes únicamente (porque los anclajes son suficientes para reposicionar los controles en la ventana según su orientación).
  7. Pase a la etapa siguiente del asistente.
  8. asistente propone utilizar una presentación diferente para cada plataforma utilizada (por ejemplo, una presentación para iOS y otra para Android).
    Sistema operativo
  9. Seleccione la opción deseada y vaya al siguiente paso de la asistente.
  10. Finalice el asistente.
  11. Si es necesario, se crean los diferentes layouts.
    Layouts
  12. El editor muestra (a la derecha) los diferentes diseños que se pueden utilizar para la ventana.. Haciendo doble clic en la insignia del diseño deseado se puede abrir en el editor y modificarlo.
Consejo:
  • La creación de una maqueta se basa en la plataforma de edición actual. Es más rápido posicionar gráficamente sobre el layout más cercano para limitar las modificaciones..
  • Para personalizar los controles que se encuentran en los diferentes diseños, le aconsejamos que empiece con el diseño más grande y completo y luego cree los otros diseños reduciendo u ocultando elementos..
WINDEV Mobile

Creación de un nuevo diseño para una ventana interna

En móviles, las ventanas internas son utilizadas por varias características: ventana detallada en un tabla, cita en un control Planificador, ....
El uso de layouts en las ventanas internas le permite proponer una interfaz para el modo vertical y para el modo apaisado..
Para crear un nuevo diseño para una ventana interna:
  1. Abrir la ventana interna correspondiente en el editor.
  2. En la pestaña "Ventana", en el grupo "Layouts", despliegue "Layouts" y seleccione "Agregar layouts".
  3. Aparece la ventana para añadir layouts.
    Haga clic en "Crear" para añadir un nuevo diseño..
  4. Validar la ventana.
  5. El editor muestra (a la derecha) los diferentes diseños que se pueden utilizar para la ventana interna..
    • Haciendo doble clic en la insignia del diseño deseado se puede abrir en el editor y modificarlo.
    • La opción "Descripción" del menú contextual de la barra de título del layout permite definir los parámetros del layout.
Manejo de layouts

Gestión de controles en los layouts

Las maquetas se disocian mediante Default ():
  • Una control creada en una maqueta se crea en todas las maquetas, con las mismas características (tamaño, posición, etc.).
  • Una control desplazada o redimensionada en una presentación sólo se desplaza o redimensiona en esa presentación.
  • La disociación automatic está habilitada por Default para todos los controles. Con este modo, cuando cambia el tamaño o la posición de un control en una de las ventanas del layout, los cambios no se aplican a las demás ventanas.
Si desea que los cambios de tamaño o posición se apliquen en todas las demás maquetas, puede desactivar la disociación automatic (): los próximos cambios de tamaño o posición se aplicarán en todas las maquetas. Puede aparecer un triángulo rojo cuando se selecciona una control. Indica que la control ha sido disociada, y que cualquier cambio realizado en ella se aplicará sólo en la disposición actual.
Consejo: Los mensajes Toast aparecen regularmente para recordarle si los cambios realizados en un control se aplican en otras maquetas, en función de las opciones de disociación control.

Menú contextual de controles específicos de los diseños

El menú contextual "Layouts" también permite disociar características específicas de los controles.
Estas opciones son las siguientes:
  • Disociar posición: Si se selecciona esta opción, la control sólo se desplazará en la disposición actual. Si no se selecciona esta opción, la control se desplazará en todas las disposiciones.
  • Disociar tamaño: Si se selecciona esta opción, la control se redimensionará sólo en la disposición actual. Si no se selecciona esta opción, la control se redimensionará en todas las disposiciones.
  • Disociar anclaje: Si se selecciona esta opción, los anclajes de la control sólo se modificarán en la disposición actual. Si no se selecciona esta opción, los anclajes de la control se modificarán en todas las disposiciones.
  • Disociar la fuente: se usa para disociar la fuente en uno o más diseños. Por ejemplo, puede utilizar una fuente específica para Android y otra para iOS. También es posible especificar un tamaño de fuente para cada diseño.
Observación: Cuando se desactiva el modo de disociación automatic, y se desactiva una disociación específica a través del menú contextual, los cambios realizados en la maqueta actual se automatic aplicarán en todas las maquetas.
El menú contextual "Layouts" incluye otras opciones:
  • Ocultar en este layout: Oculta la control seleccionada en la presentación actual.
  • Mostrar en todos los layouts: Muestra la control actual en todas las disposiciones.
Observación: Este menú contextual está disponible para una selección de controles.
Limitación: Para los controles de Gráfico, las propiedades del título y la leyenda no pueden disociarse entre diseños.
AndroidiPhone/iPad

Caso especial de la Action Bar

El control Action Bar está disponible en Android y en iOS.
Al generar la aplicación, se seleccionará automáticamente el control nativo correspondiente a la plataforma actual.

Menú contextual de diseños

Puede gestionar los diseños a través del menú contextual de las miniaturas:
Es posible:
  • Vea el diseño description y modifíquelo. Para obtener más información, consulte Ajustes de diseño.
  • Activar la maqueta, es decir, mostrarla para modificarla..
  • Activar la presentación en modo de doble vista: los dos diseños pueden visualizarse y editarse simultáneamente.
  • Crear un nuevo diseño a partir del diseño actual.
  • Borrar el layout seleccionado.
  • Mostrar miniaturas proporcionales.
  • Actualizar automáticamente: Se utiliza para actualización la disposición tan pronto como se realiza una modificación en la ventana..
  • Actualizar este layout: Se utiliza para actualización inmediatamente la disposición.
  • Actualizar todo: Utilizado para actualización inmediatamente todos los layouts.

Comparación de ventanas con diseños

WINDEV y WINDEV Mobile permiten comparar dos proyectos, dos elementos de un proyecto, etc.. Para obtener más información, consulte Comparador de proyectos.
Al comparar ventanas que contienen layouts, se listan las diferencias encontradas para cada layout..
Gestionar los diseños en tiempo de ejecución

Modo de funcionamiento Default

La disposición inicial se selecciona automáticamente en función de:
  • el sistema,
  • la orientación,
  • el tamaño de la plataforma,
  • el tamaño de la ventana o Page (en el editor).
WINDEV Mobile La disposición se modifica automáticamente cuando el dispositivo cambia del modo vertical al modo horizontal.
La configuración de la presentación puede definirse para cada plataforma ("description" en el menú contextual de la barra de título de la presentación):
iPhone/iPad La distinción Phone / Tablet sólo se aplica al tamaño de la ventana en el editor. Esta información se ignora en tiempo de ejecución.
Estos parámetros se tienen en cuenta para elegir la disposición en tiempo de ejecución:
  • Tamaño mínimo del dispositivo en el que se puede utilizar el diseño.
  • AndroidiPhone/iPad Sistema operativo. Si se selecciona "Multi OS", el diseño puede utilizarse en todos los sistemas operativos.. Tiene la posibilidad de seleccionar sistemas específicos (los sistemas propuestos corresponden a las plataformas definidas para el proyecto).
  • AndroidiPhone/iPad Orientación de la ventana.
  • AndroidiPhone/iPad Editar plataforma.
AndroidiPhone/iPad El orden de los parámetros que se tienen en cuenta depende del tipo de ejecución de la ventana. Por lo tanto:
  • Si la ventana está destinada a dispositivos móviles (maximizada o no), se tienen en cuenta los siguientes criterios: el sistema, la orientación y el tamaño de la plataforma.
  • Si la ventana está destinada a Windows, se tienen en cuenta los siguientes criterios: el sistema. Se elige la ventana más grande. Si varias ventanas tienen el mismo tamaño, la elección se realiza en función de la orientación..
iPhone/iPad La distinción entre los tamaños de las plataformas (tablet/Phone) se ignora en tiempo de ejecución. Se utiliza la disposición más grande.
Observación: Si la disposición elegida no es adecuada, puede forzar el uso de una disposición determinada mediante programación.

Programación

Es posible:
  • obligar a utilizar la disposición (WinChangeLayout). Simplemente indique el número de la disposición a utilizar como parámetro. Este número se especifica en la barra de título del diseño.
  • get la disposición actual (WinCurrentLayout).
Versión mínima requerida
  • Versión 19
Esta página también está disponible para…
Comentarios
Haga clic en [Agregar] para publicar un comentario

Última modificación: 23/11/2023

Señalar un error o enviar una sugerencia | Ayuda local