AYUDA EN LÍNEA
 WINDEVWEBDEV Y WINDEV MOBILE

Ayuda / Conceptos WEBDEV / Parte 2 - Desarrollar un sitio
  • Crear una página
  • Crear páginas en blanco
  • Crear páginas predefinidas
  • Crear páginas del proyecto mediante la construcción automática del sitio (RAD)
  • Operaciones simples en una página
  • Características principales de una página
  • Página interna
  • Modelos de páginas
  • Página Popup
  • Actualizar una página en modo Sesión
  • Presentación
  • Implementación
  • Contextos de página
  • Presentación
  • Modo de funcionamiento automático
  • Abrir una página en un sitio WEBDEV
  • Presentación
  • Abrir una página desde la descripción de un control
  • Abrir una página mediante programación
  • Eventos asociados a las páginas
  • Eventos predeterminados
  • Eventos opcionales
  • Menús (principal o contextual)
  • Opciones de menú
  • Presentación
  • Manipular las opciones de menú en el editor
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
12. Páginas en la práctica
Página anteriorTabla de contenidoPágina siguiente
El propósito de una página es mostrar, consultar e introducir información. Esta información puede provenir de los archivos de datos de un análisis, archivos externos, consultas, etc.
WEBDEV propone varias opciones para crear las páginas de un proyecto:
  • Crear una página en blanco con el asistente.
  • Construir todas las páginas del sitio a partir de la descripción del análisis.
  • Crear una página a partir de la descripción del análisis (con o sin código).
  • Crear páginas basadas en un modelo, etc.
Independientemente del método utilizado, la página se puede modificar una vez que ha sido creada: puede agregar, modificar o eliminar controles y modificar las características de la página.
Para obtener más información sobre cómo manipular los controles de una página, consulte Controles en la práctica.
Este capítulo abarca los siguientes temas:
Crear una página

Crear páginas en blanco

Para crear una página en blanco:
  1. Haga clic en en los botones de acceso rápido de WEBDEV. La ventana de creación de nuevos elementos se abre: haga clic en "Página", y luego en "Página". El asistente de creación de páginas se abre automáticamente.
  2. Seleccione "En blanco".
  3. Valide la creación de la página. La página en blanco se crea correctamente.
  4. La ventana para guardar el elemento aparece automáticamente.
  5. Introduzca el título y nombre de la página. La página corresponde a un archivo ".WWH". De forma predeterminada, este archivo se crea en el directorio principal del proyecto. Este nombre se usará para manipular la página.
  6. Valide la ventana.
  7. Cree los controles en la página.
Observaciones:
  • De forma predeterminada, la página creada corresponde al tipo de sitio activo (estático, Sesión, AWP o PHP). El tipo de página se puede modificar en la ventana de descripción de la página. Para obtener más información, consulte Características principales de una página.
  • De forma predeterminada, la nueva página utiliza el modo de edición "Responsive (zoning y layouts)". Este modo de edición permite utilizar layouts para obtener un sitio adaptable a dispositivos móviles. El modo de edición de la página se puede cambiar en la ventana de descripción de la página.
  • Los diferentes tipos de controles se presentan en el capítulo Diferentes tipos de controles estándar.

Crear páginas predefinidas

Para crear una página predefinida:
  1. Haga clic en en los botones de acceso rápido de WEBDEV. La ventana de creación de nuevos elementos se abre: haga clic en "Página", y luego en "Página". El asistente de creación de páginas se abre automáticamente.
  2. En las pestañas, elija el tipo de página que desea crear:
    • la pestaña "Estándar" permite crear:
      • una página en blanco sin ningún control.
      • una página en blanco basada en un modelo de páginas, si el proyecto contiene un modelo de páginas.
      • una página basada en un modelo predefinido.
    • la pestaña "Páginas internas" permite crear páginas internas.
    • la pestaña "Páginas de error" permite crear páginas para personalizar los errores que se muestran en el sitio.
    • la pestaña "RAD" propone crear páginas RAD que permiten mostrar e introducir datos. Este tipo de página puede estar basada en un archivo de datos, en una consulta, etc.
  3. Dependiendo del tipo de página seleccionada, introduzca la información necesaria en las diferentes etapas del asistente.
  4. Valide la creación de la página.
  5. La ventana para guardar el elemento aparece automáticamente. Introduzca un título y nombre para la página, y luego valide.
  6. La nueva página se muestra en el editor. Si es necesario, el modelo de páginas asociado a la página también se genera y se guarda en el proyecto.

Crear páginas del proyecto mediante la construcción automática del sitio (RAD)

En el caso de los sitios dinámicos (Session, AWP, o PHP), las páginas del proyecto se pueden crear automáticamente en una sola operación a partir de la descripción del análisis, mediante la construcción automática del sitio (RAD).
Para más información, consulte la ayuda en línea.
Para crear el sitio dinámico utilizando la metodología RAD:
  1. En la pestaña "Proyecto", en el grupo "Generación", haga clic en "RAD Aplicación completa".
    Atención: Para utilizar esta opción, el proyecto debe estar asociado a un análisis que se haya generado al menos una vez.
  2. Seleccione el modelo RAD que desea utilizar.
  3. Seleccione los archivos de datos que desea utilizar para la generación.
  4. Seleccione los principales archivos de datos que serán los puntos de entrada en la aplicación (estos archivos de datos se utilizarán principalmente para establecer las opciones de menú).
  5. Valide la creación del sitio mediante el RAD.
Operaciones simples en una página
El editor de páginas permite realizar las siguientes operaciones en las páginas:
  • Abrir una página en el editor: Simplemente haga doble clic en el nombre de la página que se muestra en el panel "Explorador de proyectos".
  • Guardar y copiar una página.
  • Importar y exportar una página.
  • Cambiar el orden de tabulación.
Características principales de una página
Una página puede aceptar todo tipo de controles. Una página puede:
  • tener una imagen de fondo: esta imagen se muestra en el fondo y los controles se superponen a la imagen.
  • tener un menú: este menú permite a los usuarios acceder rápidamente a las principales características del sitio. Para crear un menú desplegable en una página, utilice un control "Menú". Las dos primeras opciones se muestran en la página. Las opciones se pueden manipular a través del menú contextual. Las opciones de menú también se pueden manipular mediante programación.
  • tener una barra de estado: la barra de estado mostrará los mensajes de ayuda asociados a los diferentes controles de la página. Para más información, consulte la ayuda en línea.
  • ser multilingüe: los idiomas definidos para la página estarán disponibles para todos los controles de la página. Una página puede estar asociada a más idiomas que el proyecto (por ejemplo, páginas compartidas entre varios proyectos). Para obtener más información, consulte Sitios multilingües.
Observación: Las páginas Web para iPhone tienen mejoras especiales: splash screen, modo de pantalla completa, etc. Estas funcionalidades hacen que parezcan aplicaciones reales. WEBDEV permite configurar fácilmente las características específicas manteniendo la compatibilidad con otros navegadores (móviles o no) del mercado.
Página interna
Las páginas internas permiten compartir dinámicamente una sección de la interfaz en uno o más sitios.
La interfaz que se va utilizar varias veces se crea en una "Página interna".
Esta interfaz se utiliza en las diferentes páginas del sitio a través del control "Página interna".
Observación: La página interna a compartir puede provenir de un componente.
Para obtener más información, consulte Control Página interna.
Modelos de páginas
WEBDEV permite crear modelos de páginas. Estos modelos contienen los elementos gráficos y el código común a todas las páginas del sitio.
Los cambios realizados en un modelo de páginas se aplican automáticamente a todas las páginas que utilizan dicho modelo.
Un modelo de páginas permite utilizar el tema gráfico definido para un sitio.
El uso de modelos de páginas en los sitios permite:
  • crear las páginas del sitio fácilmente.
  • definir el diseño de las páginas del sitio.
  • actualizar el tema gráfico del sitio fácilmente.
Un modelo de páginas se puede crear tan fácilmente como una página. Para crear una página utilizando un modelo, simplemente seleccione la opción "basada en un modelo".
De forma predeterminada, los cambios hechos en el modelo se aplican a las páginas que lo utilizan. Sin embargo, se pueden definir casos especiales en una página específica sobrescribiendo los elementos del modelo.
Para obtener más información, consulte Modelos de páginas.
Página Popup
WEBDEV permite crear páginas emergentes (Popup). Estas páginas Popup permiten interactuar fácilmente con los usuarios. Una página Popup se puede utilizar para:
  • solicitar la entrada de información (parámetros SMTP para el envío de correos electrónicos, nueva dirección, etc.),
  • pedir que se confirme una eliminación,
  • etc.
Para abrir una página Popup desde otra página, puede utilizar la función Navegador PopupDisplay.
Observación: También es posible mostrar una página como una ventana emergente (popup). En este caso, la ventana emergente se mostrará utilizando la función PopupDisplayPage.
Para obtener más información, consulte Control Popup.
Actualizar una página en modo Sesión

Presentación

Actualizar una página consiste en volver a mostrar una página que ya está abierta en el navegador. Esta acción es la misma que la del botón "Actualizar" en el navegador.
Cuando se actualiza una página, los datos dinámicos de la página se actualizan según el contexto de página en el servidor. Solo se vuelven a mostrar los datos modificados.
Por ejemplo, al realizar un pedido en una aplicación de ventas, la página que muestra el resumen del pedido (el carrito) se actualiza cada vez que se pide un nuevo artículo.

Implementación

Para actualizar una página, simplemente utilice la función WLanguage PageRefresh.
Las siguientes operaciones se realizan automáticamente al actualizar una página:
  1. Se verifica la existencia del contexto de la página en el servidor.
  2. La página se vuelve a mostrar según el contexto en el servidor.
    No se recomienda utilizar la función PageDisplay para actualizar una página porque toma más tiempo cargar la página.
Contextos de página

Presentación

En una aplicación Windows, la información relativa a una ventana se conserva con la ventana.
En un sitio WEBDEV en modo Sesión, existe un contexto de página en el servidor por cada página que se muestra en el navegador del usuario.
El contexto de página contiene toda la información relacionada con la misma:
  • contenido de los controles,
  • variables locales,
  • variables globales,
  • código WLanguage "servidor", etc.

Modo de funcionamiento automático

De forma predeterminada, WEBDEV gestiona automáticamente los contextos de páginas en modo Sesión:
  • Un contexto de página se abre cuando se muestra la página en modo Sesión en el navegador.
  • El contexto de una página se actualiza según la información que introduce el usuario en el navegador. El contexto se actualiza cuando el usuario valida la página (mediante un botón "Enviar" o con la función PageSubmit).
  • Los contextos de página existentes se cierran cuando se utiliza la función PageUse. En seguida, se abre el contexto de página que corresponde a la página que se va a mostrar con esta función.
Observación: WEBDEV permite realizar una gestión avanzada de los contextos con las funciones ContextXXX. Para obtener más información, consulte Funciones de gestión de páginas.
Abrir una página en un sitio WEBDEV

Presentación

Existen varios métodos para abrir una nueva página en un sitio WEBDEV:
  • desde la descripción del control que va a abrir la página (botón, enlace, menú, etc.),
  • mediante programación en WLanguage.

Abrir una página desde la descripción de un control

Es posible definir una acción y el destino de dicha acción en la descripción de los controles Botón, Enlace e Imagen (con área de clic).
Para abrir directamente una página "xxx" desde un control Botón, Enlace o Imagen:
  1. Abra la descripción del elemento (opción "Descripción" del menú contextual del elemento).
  2. En la sección "Acción", seleccione el tipo de acción: "Mostrar una página del sitio".
  3. Seleccione la página que desea mostrar.
  4. Seleccione el destino de la acción: página actual, navegador actual, etc. La acción seleccionada previamente se realizará en este destino.
  5. Por último, indique si el contenido de los controles debe enviarse al servidor durante la acción.
  6. Valide.

Abrir una página mediante programación

Se pueden utilizar varias funciones WLanguage para abrir una página.
  • PageRefresh: Actualiza la página que se muestra según su contexto.
  • PageDisplay: Abre y muestra una nueva página en el navegador del usuario.
  • PageDisplayDialog: Abre y muestra una nueva página de forma modal en el navegador del usuario.
  • PageUse: Cierra las páginas actuales (y sus contextos) y abre una nueva página.
  • PopupDisplay: Muestra una popup en la página.
  • PopupDisplayPage: Muestra una página como una ventana emergente en la página.
Cuando se abre una página, se le pueden pasar parámetros. Para más información, consulte la ayuda en línea.
Observación: De forma predeterminada, cuando se abre una página mediante programación, el destino seleccionado es:
  • el destino definido en la descripción del objeto que abre la página (control Botón, Enlace, etc.).
  • el destino establecido para la página actual.
Eventos asociados a las páginas

Eventos predeterminados

Los siguientes eventos aparecen de forma predeterminada en el editor de código de WEBDEV:
  • Declaraciones globales (código Servidor):
    Declaración de variables globales a la página. Este es el primer código que se ejecuta cuando se abre la página.
  • Inicialización (código Servidor):
    Se ejecuta al abrir la página. El evento de inicialización de los controles de la página se ejecuta antes de este código.
  • Declaraciones globales (código Navegador):
    Declaración de variables globales a la página en código Navegador.
  • Carga (onload) de la página (código Navegador):
    Este código Navegador se ejecuta cuando se muestra la página en el navegador.
  • Descarga (onunload) de la página (código Navegador):
    Este código Navegador se ejecuta cuando se muestra una nueva página en el navegador.
  • Cada vez que cambia el layout (código sever):
    Se ejecuta cuando cambia el layout de la página.
  • Solicitud para actualizar la visualización:
    Se utiliza para agrupar el código de actualización de los controles de la página: contenido de los controles, estado (visible, en gris, etc.), título a actualizar, etc.
    Este evento se ejecuta mediante solicitud previa con las siguientes funciones:
  • Cierre de la página (código Servidor):
    Se ejecuta al cerrar la página.
  • Sincronización de la página (código Servidor):
    Este código Servidor permite gestionar la sincronización de la página al hacer clic en el botón "Atrás" del navegador.
  • Asignación de la propiedad Value (página interna únicamente):
    Se ejecuta al asignar un valor a la propiedad Value en el control Página Interna.
  • Obtención de la propiedad Value (página interna únicamente):
    Se ejecuta al utilizar la propiedad Value en modo de lectura en el control Página interna.

Eventos opcionales

Se pueden utilizar varios eventos opcionales.
Para utilizar un evento opcional, realice las siguientes acciones:
  1. Abra la ventana de código de la página.
  2. Haga clic en "Agregar otros eventos a la página", al final de la lista de eventos. La ventana de eventos opcionales se abre.
  3. Seleccione el evento opcional que desea agregar y valide.
  4. El evento seleccionado se agrega automáticamente después de los eventos predeterminados.
Se puede gestionar, por ejemplo:
  • el desplazamiento del cursor por encima del control,
  • el botón izquierdo del ratón presionado, liberado, doble clic,
  • el botón derecho del ratón presionado, liberado, doble clic,
  • la rueda del ratón, etc.
Menús (principal o contextual)
WEBDEV permite crear un menú y/o un menú contextual en las páginas HTML. Estos menús corresponden a controles específicos.
Los menús principales o contextuales pueden ser verticales u horizontales. Las diferentes opciones de un menú permiten:
  • mostrar páginas,
  • ejecutar el código de los controles Botón de la página,
  • etc.
WEBDEV permite:
  • Crear menús principales o contextuales,
  • Editar menús principales o contextuales,
  • Eliminar menús principales o contextuales.
Para más información, consulte la ayuda en línea.
Opciones de menú

Presentación

Los menús principales y contextuales constan de una o varias opciones y subopciones. Cada opción ejecuta un código WLanguage.
Para manipular las opciones de menú, simplemente edite el menú correspondiente.
Para editar (o mostrar en el editor) el menú principal de una página:
  1. Abra la página correspondiente en WEBDEV.
  2. Haga doble clic en el menú: un marco amarillo aparece alrededor.

Manipular las opciones de menú en el editor

El editor de páginas permite realizar fácilmente las siguientes operaciones:
  • Agregar una opción de menú,
  • Agregar un separador,
  • Agregar un submenú,
  • Eliminar una opción de menú.
Las opciones de menú también pueden definirse en el editor de páginas, y sus características pueden modificarse mediante una ventana de descripción.
La ventana de descripción de las opciones de menú permite:
  • modificar el texto de la opción,
  • seleccionar o deseleccionar una opción de menú,
  • asociar una imagen a una opción de menú,
  • asociar un método abreviado de teclado a una opción de menú.
También es posible asociar un código WLanguage a una opción de menú. Solo las opciones de menú sin submenús pueden iniciar un proceso WLanguage.
Para obtener más información, consulte Manipular las opciones de menú.
Página anteriorTabla de contenidoPágina siguiente
Comentarios
Haga clic en [Agregar] para publicar un comentario

Última modificación: 25/08/2023

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