AYUDA EN LÍNEA
 WINDEVWEBDEV Y WINDEV MOBILE

¡Nueva funcionalidad de WINDEV, WEBDEV y WINDEV Mobile 2024!
Ayuda / Editores / Editor de ventanas y de páginas / Visita guiada
  • Presentación
  • ¿Cómo implementar una visita guiada?
  • Modos de creación de visitas guiadas
  • Asistente de creación de visita guiada
  • Ajustes generales de la visita guiada
  • Ajustes específicos de cada etapa
  • Ajustes de la etapa
  • Sobrescritura de las opciones generales de cada etapa
  • Código generado por el asistente
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
Una visita guiada presenta una serie de características, que se muestran en un tooltip en la ventana o página actual.
Las visitas guiadas permiten que los usuarios descubran novedades o características específicas, o les guía a través de cada etapa de un proceso. En este último caso, una visita guiada puede servir de tutorial.
WINDEV, WEBDEV y WINDEV Mobile ahora incluyen un asistente completo para ayudarle a crear visitas guiadas.
¿Cómo implementar una visita guiada?
Para implementar una visita guiada en su aplicación o sitio web, solo tiene que abrir el asistente.
Para abrir el asistente desde WINDEV o WINDEV Mobile:
  1. En la pestaña "Ventana", en el grupo "Edición", despliegue "Visita guiada" y seleccione uno de los modos de creación de la visita guiada.
  2. El asistente se abre.
Para abrir el asistente desde WEBDEV:
  1. En la pestaña "Página", en el grupo "Edición", despliegue "Visita guiada" y seleccione uno de los modos de creación de la visita guiada.
  2. El asistente se abre.

Modos de creación de visitas guiadas

Hay tres tipos de visitas guiadas:
  • Visita guiada:
    Secuencia de tooltips que se muestran a intervalos predefinidos o tras una acción del usuario: pulsar un botón, ir adelante o atrás, pulsar la barra espaciadora, etc. Las características se presentan una tras otra.
  • Recorrido interactivo:
    Este modo pide al usuario que complete una acción (introducir un código postal, por ejemplo). Una vez completada la acción, se muestra el siguiente tooltip. La transición a la etapa siguiente se activa mediante acciones del usuario en la aplicación.
  • Tooltip persistente:
    El tooltip permanece en la pantalla hasta que el usuario lo cierre. Este modo puede utilizarse para recordar información de seguridad, normas empresariales o presentar una novedad importante.
El código generado por el asistente será diferente según el tipo de visita guiada.
Asistente de creación de visita guiada
Este asistente de creación permite definir las opciones generales de la visita guiada, así como opciones específicas para cada etapa.
En las opciones generales de la visita guiada, puede definir los ajustes de visualización de los tooltips, resaltar controles, etc. Estos ajustes se aplican de forma predeterminada a todos los tooltips.
En los ajustes de cada etapa, puede elegir el control que desea resaltar y el texto del tooltip. También puede personalizar las opciones de los ajustes generales para una etapa específica. Por ejemplo, puede cambiar el color del halo alrededor del control para cada etapa.
En el asistente, puede ver en cualquier momento:
  • la vista previa del tooltip.
  • el código WLanguage de la visita guiada. Este código se construye dinámicamente en función de las opciones seleccionadas.
Puede:
  • Probar la visita guiada directamente desde el asistente (botón "Probar"). En este caso, el código de la visita guiada se inserta automáticamente en el código de inicialización de la ventana actual, y se ejecuta la prueba. Los diferentes tooltips de la visita guiada aparecen.
  • Validar las opciones seleccionadas en el asistente. En este caso, el asistente le pide que integre (o reemplace) el código generado en el evento "Inicialización" de la ventana actual, o que copie el código en el portapapeles.
Ajustes generales de la visita guiada
Los ajustes generales definen las opciones comunes a todas las etapas de la visita guiada.
Las opciones son las siguientes:
Las opciones generales incluyen:
  • el identificador de la visita guiada. Este identificador debe ser único en el proyecto actual.
  • el número de versión de la visita guiada. Este número de versión puede utilizarse para definir las opciones de una segunda versión de la visita guiada si el usuario ya ha visto la primera versión.
Las opciones de la visita guiada incluyen:
  • Acción del clic: Puede elegir la acción que se ejecutará cuando el usuario haga clic dentro y fuera del control resaltado. Las diferentes opciones son las siguientes:
    • Pasar a la etapa siguiente: Al hacer clic dentro o fuera del control, el usuario pasa a la etapa siguiente.
    • Clic en el control: Al hacer clic en el control se ejecuta el código de clic del control. La transición a la etapa siguiente debe definirse mediante programación (con la función GuidedTourChangeStep).
    • Clic en el control y pasar a la etapa siguiente: El control tiene un comportamiento estándar. Una vez ejecutado el código del control, la visita guiada pasa automáticamente a la etapa siguiente.
      Esta acción solo está disponible para los siguientes controles: Botón, Casilla de verificación, Botón de opción y Opción de menú. Para los otros controles, solo se ejecutará la transición a la etapa siguiente.
    • Finalizar visita: Fin de la visita guiada.
    • Ninguna acción: El clic no tiene ningún efecto.
  • Tooltip de descripción: Permite definir las características del tooltip que se muestra. Hay dos modos disponibles:
    • Modo opaco: el tooltip se muestra en una ventana emergente con una flecha que apunta a los controles resaltados. La ventana interna predeterminada incluye dos botones para ir a la etapa siguiente/anterior o para finalizar la vista.
    • Modo transparente: el tooltip se muestra con un fondo transparente junto a los controles resaltados. En este modo, el usuario no puede interactuar con los controles de la ventana interna.
    En ambos casos, el tooltip puede corresponder a:
    • la ventana predeterminada.
    • una personalización de la ventana predeterminada.
  • Efecto alrededor de los controles: Además del resaltado, existen otros efectos específicos. Puede:
    • mostrar un halo: Un halo se muestra alrededor del control. Puede definir el color y la opacidad del halo.
    • oscurecer la ventana (OVI): La ventana detrás del control se oscurece para resaltar el control. Puede configurar el color y la opacidad del efecto de oscurecimiento.
  • Resaltar controles: Existen varias opciones para resaltar el control en cada etapa:
    • definir un rectángulo alrededor del control con esquinas redondeadas o cuadradas. Puede definir un radio (en pixeles) para aumentar o disminuir el suavizado de las esquinas.
    • definir un círculo.
    • definir un margen entre el control y el círculo o rectángulo de resaltado.
Ajustes específicos de cada etapa

Ajustes de la etapa

Puede indicar los elementos específicos de cada etapa:
  • el control a resaltar. Para introducir fácilmente el nombre del control:
    1. Utilice el botón que permite seleccionar el control correspondiente en la ventana del proyecto.
    2. Haga clic en el control deseado.
    3. Confirme la selección.
  • el título que se muestra en el tooltip.
  • la descripción que se muestra en el tooltip.
Esta información se mostrará en función de las características del tooltip utilizado.
Observación: Si la aplicación admite varios idiomas, tendrá que convertir el título y la descripción del tooltip en cadenas multilingües para poder traducirlas.

Sobrescritura de las opciones generales de cada etapa

Puede personalizar las opciones generales de cada etapa. Para ello:
  1. Seleccione la categoría que desea personalizar.
  2. Indique los valores específicos de la etapa actual.
Código generado por el asistente
El código generado utiliza todas las funciones WLanguage necesarias para manipular las visitas guiadas:
Este código puede editarse. Puede agregar una etapa, cambiar el efecto aplicado al control, etc.
Atención: El código que inicia la visita guiada se inserta al final del código generado. Puede mover estas líneas de código para abrir una visita guiada en cualquier momento.
Para obtener más información sobre las funciones de una visita guiada, consulte Funciones de visitas guiadas.
WEBDEV - Código Navegador Observación: No puede acceder a pestañas, celdas de un control Looper, filas de un control Tabla, etc. Si se utilizan corchetes en el nombre del control ([ ]), aparece un error de compilación.
Versión mínima requerida
  • Versión 2024
Esta página también está disponible para…
Comentarios
Haga clic en [Agregar] para publicar un comentario

Última modificación: 19/01/2024

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