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 / Desarrollar una aplicación o un sitio web / Controles, ventanas y páginas / Controles: tipos disponibles / Control Looper
  • Presentación
  • Modo de funcionamiento y parámetros generales (pestaña "General")
  • Modo de funcionamiento
  • Número máximo de filas por página
  • Menú contextual
  • Acceso directo a las propiedades de los controles (sin usar atributos)
  • Modo de visualización y ajustes (pestaña "Detalles")
  • Modo de visualización: Vista de cuadrícula
  • Modo de visualización: Galería en filas
  • Modo de visualización: Galería en columnas
  • Contenido de una control Looper gestionada mediante programación
  • Looper infinito
  • Contenido diferente en cada fila del control Looper
  • Estilo del control (pestaña "Estilo")
  • Elemento "Bordes/Fondo": Grosor del borde
  • Botón izquierda, botón derecha y botón cerrar
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
Para ver las características del control, seleccione la opción "Descripción" en el menú contextual. Hay dos tipos de información:
  • información sobre todo el control Looper (seleccione el nombre del control Looper).
  • información sobre cada atributo del Looper (seleccione el nombre del atributo del Looper). En este caso, solo está disponible la pestaña "Enlace".
En WEBDEV, existen diferentes modos de funcionamiento:
  • Looper estándar.
  • Looper Ajax.
    Observación: Este tipo de Looper evita que se actualice la página cada vez que se realiza una acción en el servidor. También se utiliza para conseguir una interfaz más cercana a la de una aplicación de Windows, proponiendo barras de desplazamiento en lugar de una paginación.
  • Looper Navegador.
    Observación: Este tipo de Looper puede manipularse mediante programación en código Navegador. Puede funcionar de forma independiente, sin acceder al servidor. Este tipo de Looper se recomienda para el modo sin conexión o en sitios WebApp. También puede utilizarse en sitios estáticos.
WEBDEV también incluye diferentes modos de visualización:
  • Vista de cuadrícula: Este modo muestra los diferentes controles del Looper en una vista cuadrícula.
  • Galería en filas: Este modo de visualización crea una galería de imágenes en filas.
  • Galería en columnas: Este modo de visualización crea una galería de imágenes en columnas.
Las diferentes pestañas de la ventana de descripción del control Looper permiten definir:
  • el modo de funcionamiento (pestaña "General").
  • el estado inicial de la control y el modo de selección (pestaña "UI").
  • el modo de visualización y sus ajustes (pestaña "Detalles").
  • el modo de relleno y las rupturas (pestaña "Contenido").
  • el estilo de los diferentes elementos del Looper (pestaña "Estilo").
Modo de funcionamiento y parámetros generales (pestaña "General")

Modo de funcionamiento

Los diferentes modos de funcionamiento son:
Modo de funcionamiento
  • Looper estándar.
    En el modo estándar, toda la página se actualiza cada vez que se realiza una acción en el servidor.
    Este modo de funcionamiento incluye una paginación opcional (para navegar por las diferentes páginas de datos que muestra el control).
    Este modo de funcionamiento es compatible con cualquier modo de visualización: vista de cuadrícula, galería en filas o galería en columnas.
  • Looper Ajax.
    Este tipo de Looper evita que se actualice la página cada vez que se realiza una acción en el servidor. También se utiliza para conseguir una interfaz más cercana a la de una aplicación de Windows, proponiendo barras de desplazamiento en lugar de una paginación.
    Este modo de funcionamiento solo es compatible con una vista de cuadrícula.
  • Looper Navegador.
    Este tipo de Looper puede manipularse mediante programación en código Navegador. Puede funcionar de forma independiente, sin acceder al servidor.
    Este tipo de Looper se recomienda para el modo sin conexión o en sitios WebApp. También puede utilizarse en sitios estáticos.
    Este modo de funcionamiento solo es compatible con una vista de cuadrícula.

Número máximo de filas por página

Esta opción permite especificar el número máximo de filas permitidas en la página.
Si el número de filas en el control Looper es mayor que este valor:
  • para un control Looper estándar, se puede utilizar un control Paginación para ver las filas adicionales.
  • para un control Looper Ajax, aparece una barra de desplazamiento que permite ver las filas adicionales.
Si el número de filas en el control Looper es menor que este valor:
  • para un control Looper estándar en una página que no utiliza el modo Zoning, se conserva el espacio para las filas.
  • para un control Looper estándar en una página que utiliza el modo Zoning y con anclajes ajustados al contenido, no se conserva el espacio para las filas. Los controles que se encuentran debajo del control Looper se ajustan automáticamente.
  • para un control Looper de tipo Ajax, se conserva el espacio para las filas.
Esta opción está disponible para controles Looper estándar y Ajax.
Observaciones:
  • El número máximo de filas por página se puede cambiar dinámicamente con la propiedad NbLinesPerPage.
  • Si al crear un control Looper basado en un archivo de datos, el número de filas es superior al máximo especificado, una paginación se asocia automáticamente al control. La paginación permite ver todos los registros del control Looper.

Menú contextual

Se puede mostrar un menú contextual en un control Looper. Este menú contextual permite a los usuarios exportar el contenido del control Looper a Word, Excel, OpenOffice, XML, etc.
Para habilitar este menú contextual, seleccione la opción "Con menú contextual de exportación". También puede elegir la imagen que se utilizará para el menú contextual. Le recomendamos utilizar una imagen con las siguientes dimensiones: 15 x 15 pixeles.
El menú contextual solo está disponible para controles Looper estándar y Ajax.

Acceso directo a las propiedades de los controles (sin usar atributos)

Esta opción permite cambiar dinámicamente las propiedades de los controles en el Looper sin declarar atributos.
Por ejemplo, la siguiente sintaxis cambia el color de fondo de un control Estático en un control Looper:
LOOP_MyLooper[nRow].STC_MyStatic.ColorBackground = MyColor
Modo de visualización y ajustes (pestaña "Detalles")

Modo de visualización: Vista de cuadrícula

Hay varios modos de visualización disponibles si el control Looper muestra los datos en una vista de cuadrícula:
  • En modo Zoning:
    • Número de columnas fijo/Rellenar por filas.
      Solo necesita especificar el número de columnas a mostrar. El Looper se rellenará horizontalmente hasta alcanzar el número de columnas especificado y continuará rellenándose en una nueva fila. El número de columnas no cambia cuando el usuario cambia el ancho de la página.
      Este modo de visualización está disponible para Loopers estándar, Ajax y Navegación.
    • Número de columnas variable/Rellenar por filas.
      El número de columnas depende del ancho de la página. El número de columnas aumenta o disminuye cuando el usuario cambia el ancho de la página.
      Puede definir el número mínimo de columnas.
      Este modo de visualización está disponible para Loopers estándar y Navegación.
    • Número fijo de columnas/Rellenar por columnas.
      Especifique el número de columnas a mostrar (superior a 1). El Looper se rellenará verticalmente hasta alcanzar el número de filas especificado y continuará rellenándose en una nueva columna. El número de columnas no cambia cuando el usuario cambia el ancho de la página.
      Este modo de visualización está disponible para Loopers estándar.
  • En modo Responsive Web Design:
    • Ancho de columnas variable .
      Solo necesita especificar el número de columnas a mostrar. El Looper se rellenará horizontalmente hasta alcanzar el número de columnas especificado y continuará rellenándose en una nueva fila. El número de columnas no cambia cuando el usuario cambia el ancho de la página.
      Este modo de visualización está disponible para Loopers estándar, Ajax y Navegación.
    • Ancho de columnas fijo.
      El número de columnas depende del ancho de la página. El número de columnas aumenta o disminuye cuando el usuario cambia el ancho de la página.
      Se debe especificar el número mínimo de columnas. El ícono indica que el valor es específico de cada rango de resolución. Por lo tanto, el valor debe definirse por cada rango de resolución de la página.
      Haga clic en el ícono para definir directamente los valores de cada rango de resolución en la siguiente ventana:

      Este modo de visualización está disponible para Loopers estándar.
    • Número de columnas por rango de resolución. En una página en modo Responsive Web Design, el número de columnas puede cambiar en función del rango de resolución. Cada rango de resolución tiene un ancho diferente.
      Este modo de visualización solo está disponible para Loopers estándar.
      Esto permite adaptar el número de columnas según el ancho del rango de resolución (es decir, según el tamaño del navegador).
      Cuando se selecciona esta opción, aparece un ícono a la derecha del número de columnas especificado: . Este ícono indica que el valor introducido es específico de cada rango de resolución. Por lo tanto, el valor debe definirse por cada rango de resolución de la página.
      Haga clic en el ícono para definir directamente los valores de cada rango de resolución en la siguiente ventana:

      Este modo de visualización está disponible para Loopers estándar y Navegación.

Modo de visualización: Galería en filas

Si el control Looper muestra los datos como una galería en filas, puede definir varias opciones:
  • Control de referencia para la altura: Permite definir el control del control Looper que se utilizará como referencia para el ancho de las imágenes que se muestran en la fila. Este control puede ser un control Imagen o Miniatura. Si la imagen de origen es más pequeña que las dimensiones definidas en el editor, las dimensiones del control de referencia se aplicarán a la imagen en tiempo de ejecución.
  • Al hacer clic, abrir una popup de desplazamiento automático: Abre una ventana emergente automáticamente para desplazarse por los diferentes elementos de la galería. Esta ventana emergente contiene:
    • los elementos de la fila.
    • un botón "Cerrar" y las flechas Siguiente y Anterior. Estos elementos se pueden configurar en la pestaña "Estilo" de la ventana de descripción del control Looper (elementos "Botón izquierda", "Botón derecha" y "Botón cerrar").
  • Animar durante la reorganización de las celdas al redimensionarlas: Aplica un efecto cuando se redimensiona el navegador y se reorganizan las filas. La duración de la animación se puede especificar. Este valor se puede modificar usando la propiedad AnimationDuration.
Para obtener más información sobre los Loopers en modo de galería, consulte Looper de tipo galería.

Modo de visualización: Galería en columnas

Si el control Looper muestra los datos como una galería en columnas, puede definir varias opciones:
  • Número de columnas fijo/Ancho variable.
    El Looper se rellenará horizontalmente hasta alcanzar el número de columnas especificado y continuará rellenándose en una nueva fila. El número de columnas no cambia cuando el usuario cambia el ancho de la página.
    Este modo de visualización está disponible para Loopers estándar.
    Se debe especificar el número de columnas a mostrar.
  • Número de columnas variable/Ancho variable.
    El número de columnas depende del ancho de la página. El número de columnas aumenta o disminuye cuando el usuario cambia el ancho de la página.
    Este modo de visualización está disponible para Loopers estándar.
  • Número de columnas variable/Ancho fijo.
    El Looper se rellenará horizontalmente, y luego verticalmente. El número de columnas y el ancho de cada fila cambia cuando el usuario cambia el ancho de la página.
    Este modo de visualización está disponible para Loopers estándar. En el modo Responsive Web Design, el ícono indica que el valor es específico de cada rango de resolución. Por lo tanto, el valor debe definirse por cada rango de resolución de la página. Haga clic en el ícono para definir directamente los valores de cada rango de resolución en la siguiente ventana:
También hay opciones específicas de la galería en columnas:
  • Control de referencia para la altura: Permite definir el control del control Looper que se utilizará como referencia para la altura de las imágenes que se muestran en la fila. Este control puede ser un control Imagen o Miniatura. Si la imagen de origen es más pequeña que las dimensiones definidas en el editor, las dimensiones del control de referencia se aplicarán a la imagen en tiempo de ejecución.
  • Abrir una popup de desplazamiento automático al hacer clic: Abre una ventana emergente automáticamente para desplazarse por los diferentes elementos de la galería. Esta ventana emergente contiene:
    • los elementos de la fila.
    • un botón "Cerrar" y las flechas Siguiente y Anterior. Estos elementos se pueden configurar en la pestaña "Estilo" de la ventana de descripción del control Looper (elementos "Botón izquierda", "Botón derecha" y "Botón cerrar").
  • Animar celdas al organizarlas y redimensionarlas: Aplica un efecto cuando se redimensiona el navegador y se reorganizan las filas. La duración de la animación se puede especificar.
Para obtener más información sobre los Loopers en modo de galería, consulte Looper de tipo galería.
Contenido de una control Looper gestionada mediante programación

Looper infinito

Los controles Looper se pueden poblar "si es necesario": sólo se cargan en memoria los datos Visible al usuario. Los datos adicionales se cargan a petición (cuando se utiliza la barra de desplazamiento, por ejemplo).
Ventaja: Baja utilización de memoria, menor tiempo de carga y menor consumo de ancho de banda..
Inconveniente: No hay que ordenar ni buscar hasta que todos los datos estén disponibles.
Para obtener más información, consulte Controles de la Mesa y del Looper Infinite.

Contenido diferente en cada fila del control Looper

Los controles del Looper permiten personalizar la apariencia de las filas: diseño, contenido, etc.. Esto permite colocar controles Looper dentro de otros controles Looper.
Para crear una control Looper con contenido de Variable:
  1. Crear una población de control Looper de forma programada. Esta control debe ser una control Looper vertical que contenga una sola columna.
  2. Abrir la ventana control Looper description.
  3. En la pestaña "Contenido" del control description, marque "Utilizar una página interna por fila (función LooperAddIP)"..
  4. Valide la ventana de descripción del control.
  5. Crear las diferentes páginas internas para las filas de la control Looper.
  6. Añada las páginas internas a la control Looper utilizando las siguientes funciones:
    LooperAddIPAgrega una fila como página interna al final de un control Looper rellenado mediante programación.
    LooperInsertIPInserta una fila como página interna en un control Looper rellenado mediante programación.
    LooperModifyIPModifica una fila que corresponde a una página interna en un control Looper rellenado mediante programación.
Características de las páginas internas
Las siguientes reglas se aplican a la anchura y altura de las páginas internas:
  • Altura: La altura de la fila que contiene una Page interna corresponde exactamente a la altura de la Page interna definida en modo edición. El Page interno no puede ser superior al control Looper.
  • anchura:
    • Si la anchura de la Page interna es inferior a la anchura de la control Looper, la Page interna aumenta automáticamente y se aplican anclajes.
    • Si la anchura del Page interno supera la anchura del control Looper, el Page interno se trunca automáticamente.
    Como norma general, se recomienda crear la Page interna con la menor anchura posible y utilizar anclajes.
Observación: Si la Page interna incluye controles adaptados al contenido, la altura de la fila aumentará o disminuirá en función del contenido.
Estilo del control (pestaña "Estilo")

Elemento "Bordes/Fondo": Grosor del borde

Dependiendo del navegador utilizado, el grosor de los bordes de las diferentes filas del Looper puede ser diferente.
Por ejemplo, si el grosor del borde es inferior a 3 pixeles, esta característica:
  • no se aplicará correctamente en Internet Explorer.
  • se aplicará correctamente en Firefox.

Botón izquierda, botón derecha y botón cerrar

Los elementos "Botón izquierda", "Botón derecha" y "Botón cerrar" permiten personalizar los elementos de la ventana emergente que muestra la imagen al desplazarse por las imágenes automáticamente (galería de imágenes en filas o en columnas).
Versión mínima requerida
  • Versión 9
Comentarios
Haga clic en [Agregar] para publicar un comentario

Última modificación: 30/06/2023

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