Widget Lista

El widget Lista muestra registros de datos en una vista de lista personalizada. Utiliza un diseño de tarjeta como un contenedor para algunas descripciones cortas de información relacionada, con la opción de incluir un botón para ver detalles adicionales. Puede elegir entre varias plantillas para crear el diseño de tarjeta. Las plantillas incluyen widget de imagen, botón y texto. También puede elegir una plantilla en blanco para diseñar las suyas propias. La fuente de datos para la lista se define mediante una capa de entidades. Cada tarjeta de elemento de la lista representa un registro y los widgets de la tarjeta pueden utilizarse para visualizar los atributos del registro. Para diseñar la lista, puede personalizar los ajustes del estilo y modificar el diseño de la primera tarjeta y actualizar todos los registros de la lista.

Ejemplos

Use este widget para apoyar los requisitos de diseño de la aplicación como por ejemplo los siguientes:

  • Desea crear una aplicación que permita a los usuarios seleccionar un registro de la lista y verlo en el mapa.
  • Desea visualizar registros de una fuente de datos en una vista de lista personalizada. Los registros que se van a visualizar deben cumplir varios criterios.
  • Desea proporcionar una lista con la que interactúen los usuarios, como por ejemplo filtrándola, ordenándola con opciones predefinidas y seleccionando registros de la lista.

Notas de uso

Cuando agregue un widget Lista, elija primero un diseño de plantilla para las tarjetas de elementos de la lista y haga clic en Iniciar. En el lienzo, el primer elemento en el widget Lista se activa y puede modificar el diseño de los widgets que hay en él o agregar más widgets arrastrándolos desde el panel Insertar hasta la primera tarjeta. Actualmente, el widget Lista solo admite los widgets Texto, Botón e Imagen.

El widget Lista requiere una fuente de datos. Puede utilizar el widget Lista en una página con o sin un mapa mostrado. Si incluye un widget Mapa que utiliza la misma capa, si hace clic en una entidad de la lista, resaltará la entidad correspondiente del mapa. Al designar el contenido de las tarjetas de los elementos en la lista, especifique qué quiere mostrar configurando los widgets en el primer elemento y seleccionando el respectivo contenido dinámico para rellenar los registros de la fuente de datos conectada. (De forma predeterminada, los widgets que agrega a la lista heredan los datos de la lista). También puede establecer acciones para que un widget Lista interactúe con otros widgets de su aplicación, como por ejemplo aplicación de zoom a la entidad seleccionada en un mapa de un widget Mapa o visualización de los atributos de la entidad seleccionada en un widget Información de entidades.

Si configura el widget Lista con varios estados (Predeterminado, Mantener el puntero y Seleccionado), aparece un botón Vinculado a Vinculado a cuando selecciona los widgets anidados para diseños personalizados. El botón indica si los ajustes del widget están aislados o sincronizados a través de los estados.

  • Para widgets sincronizados, el contenido del widget y ajustes de estilo (fondo, borde y sombra) son los mismos, y el tamaño y posiciones pueden ser diferentes en función de los estados.
  • Para widgets aislados, puede configurar las propiedades sin que afecte a otros widgets en otro estado.
  • Para usar el mismo widget en otro estado o sincronizar el tamaño y posición del widget, seleccione el widget y aplíquelo al estado del destino.
  • Cuando elimina un widget sincronizado, el mismo widget en diferentes estados también se elimina a menos que aísle el widget primero.

Métodos de búsqueda

La herramienta de búsqueda del widget Lista utiliza diferentes métodos para recuperar sugerencias de búsqueda y resultados de búsqueda.

La herramienta de búsqueda del widget utiliza búsqueda de texto completo para recuperar sugerencias de búsqueda. Búsqueda de texto completo es un método de búsqueda eficiente que utiliza índices de campo de texto completo que dividen registros en unidades pequeñas, como por ejemplo palabras individuales. Por ejemplo, imagine que tiene una capa de ubicaciones de oficinas de correos de Estados Unidos con un campo de nombre que contiene los nombres de cada ubicación de oficina postal. El índice divide el nombre Highland Station Baltimore Post Office en cinco palabras que pueden buscarse individualmente: Highland, Station, Baltimore, Post y Office. Si introduce una frase de búsqueda compuesta por cualquier combinación de dichas palabras (o solo por la primera parte de ellas) como por ejemplo Baltimore Office, Highland Baltimore o Stat Balt Office, obtiene esa oficina en las sugerencias de búsqueda.

Se generan automáticamente índices de campo de texto completo para capas de entidades alojadas cuando las selecciona como campos de búsqueda para el widget Buscar, Lista o Tabla si es el propietario de la capa de entidades alojada o un administrador de la organización.También puede agregar manualmente índices a campos de atributo en la página de detalles de elemento de capas. Si tiene capas sin índices y no tiene permiso para editar las capas, el widget Lista busca sugerencias utilizando START WITH abc%, lo que significa que el widget busca registros que empiezan con la frase de búsqueda. Este es un método de búsqueda menos eficiente.

Para recuperar resultados de búsqueda, el widget utiliza CONTAIN %abc%, lo que significa que la frase de búsqueda puede estar en cualquier lugar del registro. Por ejemplo, puede buscar alt para obtener Baltimore, Salt Lake City y Alton en los resultados de búsqueda.

Precaución:

La búsqueda de texto completo es nueva con la versión de octubre de 2023 de Experience Builder y es un cambio innovador. Antes de esta versión, el widget utilizaba CONTAIN %abc% para recuperar sugerencias y resultados. A diferencia de las consultas CONTAIN %abc%, la búsqueda de texto completo no puede encontrar frases de búsqueda situadas en la mitad de las palabras. En el ejemplo anterior, la búsqueda de altimor o ighlan no devolverá la oficina de correos esperada en sugerencias de búsqueda. Obtenga más información sobre la búsqueda de entidades en mapas y aplicaciones.

Configuración

El widget Lista incluye estos ajustes:

  • Seleccionar una plantilla: elija entre diseños de lista predefinidos o empiece con una plantilla de lista vacía. (Si elige una plantilla, puede personalizar su apariencia posteriormente.)
  • Datos: especifique los datos que se incluirán en la lista.
    • Seleccionar datos: seleccione la fuente de datos para una capa de entidades con entidades que se van a mostrar en el widget. Solo puede seleccionar una vista de datos para una capa de entidades. En la configuración de la vista de datos, puede filtrar los datos para restringir lo que aparece en el widget, ordenar los datos para mostrar los elementos de la lista en un orden concreto o especificar las limitaciones de registro.
    • Ningún mensaje de datos: decida qué mensaje mostrar cuando el widget no contiene datos, por ejemplo, cuando el usuario aplica un filtro.
    • Texto de última actualización: cuando la fuente de datos tiene activada la actualización automática , excluya opcionalmente la última etiqueta de actualización que indica cuándo se actualizaron los datos en la aplicación.
  • Disposición: defina cómo mostrar los elementos en la lista.
    • Diseño: muestra los elementos en una lista de filas, columnas o cuadrícula.
    • Altura o ancho del elemento: especifique el tamaño de los elementos de la lista.
      • Para una lista de filas, defina el ancho del elemento de la lista escribiendo un número preciso de píxeles en este ajuste o arrastrando la barra de redimensionamiento en el lienzo. La altura del elemento se define con la altura del widget.
      • Para una lista de columnas, defina la altura del elemento de la lista escribiendo un número preciso de píxeles en este ajuste o arrastrando la barra de redimensionamiento en el lienzo. El ancho del elemento se define con el ancho del widget.
      • Para una lista de cuadrícula, defina el ancho y la altura del elemento de la lista escribiendo el número preciso de píxeles de cada ajuste o arrastrando las barras de redimensionamiento en el lienzo. También puede definir el ancho del elemento de la lista por porcentaje del ancho del widget.
      Nota:

      Si la lista utiliza un diseño personalizado para dispositivos de pantalla mediana o pequeña, puede personalizar el tamaño de los elementos de la lista. Los iconos de esta configuración indican a qué tamaño de pantalla (grande, mediano o pequeño) se aplica la configuración.

    • Bloquear relación ancho-altura: bloquee la relación ancho-altura de los elementos de la lista cuando se redimensione el widget.
    • Alineación (disponible para listas de cuadrículas): alinee los elementos de la lista a la derecha, al centro o a la izquierda.
    • Espaciado horizontal o vertical: defina el espaciado entre elementos de la lista en píxeles. Para listas de cuadrícula, defina ambas opciones.
    • Estilo de paginación: defina cómo cargar elementos de la lista que no encajan en la primera página:
      • Desplazamiento: cargue más elementos cuando los usuarios se desplacen hacia abajo en la lista.
        • Barra de desplazamiento: muestre una barra de desplazamiento.
        • Navegador: incluya controles de navegación hacia arriba y hacia abajo o hacia la izquierda y hacia la derecha para el desplazamiento por la lista. Para Paso, defina el número de elementos o filas en los que desplazarse cada vez que se haga clic en el control del navegador.
      • Varias páginas: divida una lista larga en varias páginas usando paginación. Para Elementos por página, defina el número de elementos que se visualizarán en una página.
  • Estados: proporcione una representación visual para comunicar los tres estados de los elementos de la lista: Predeterminado (estado predeterminado para el elemento sin interacción con el usuario), Mantener el puntero (el usuario inicia este estado señalando un elemento de la lista) y Seleccionado (el usuario selecciona el elemento de la lista).
    Sugerencia:

    Si cambia los estados correspondientes para widgets anidados, puede aislar los cambios para que no se apliquen a todos los estados. Seleccione el widget Lista y haga clic en el botón del estado que desee cambiar. En el ajuste Diseño , seleccione Personalizado. Haga clic en un widget anidado, haga clic en el botón Vinculado a Vinculado a que aparece, elija Aislar y configure los ajustes del widget anidado. (Si primero configura ajustes y posteriormente hace clic en Aislar, los cambios ya se habrán aplicado a los demás estados).

    • Fondo: defina el fondo para los elementos de la lista en su estado predeterminado (sin interacción actual del usuario). Seleccione un color o imagen de relleno. Si elige una imagen, puede colocarla dentro del borde del elemento de la lista usando AjustarRellenarCentroTeselaExtender. Si elige Ajustar, el color de relleno de fondo aparece alrededor de la imagen.
    • Borde: defina el borde de los elementos de la lista en su estado predeterminado eligiendo el color, el estilo (por ejemplo, con guiones o puntos) y el ancho en píxeles del borde.
    • Radio del borde: cambie el tamaño del radio (en píxeles o porcentaje) para dar forma a las esquinas de los elementos de la lista en su estado predeterminado. Bloquee los ajustes para sincronizar el radio de las cuatro esquinas.
    • Cursor: especifique si la apariencia de un elemento de la lista cambia cuando los usuarios sitúan el cursor sobre él. Cuando el estado Mantener el puntero está habilitado, sus ajustes aparecen en el panel de configuración con opciones para cambiar el fondo, borde y radio del borde del elemento de la lista con cursor.
      • Aparece una pestaña Mantener el puntero junto al primer elemento de la lista del lienzo, que se actualiza para mostrar cómo va a aparecer el elemento cuando los usuarios sitúen el cursor sobre él. También puede agregar widgets o eliminar, redimensionar y recolocar widgets existentes solo para el estado Mantener el puntero.
    • Seleccionado: especifique si la tarjeta de elemento de la lista puede seleccionarse y cómo cambia su apariencia cuando los usuarios hacen clic para seleccionarla. Cuando el estado seleccionado está habilitado, sus ajustes aparecen en el panel de configuración con opciones para permitir realizar varias selecciones y cambiar el fondo, borde y radio del borde del elemento de la lista seleccionado. Con Modo de selección puede limitar las selecciones a solo un elemento a la vez (si se hace clic en otro elemento se elimina la selección actual) o permitir que los usuarios seleccionen varios elementos a la vez (si se hace clic en otro elemento, este se agrega al conjunto de selección actual).
      • Aparece una pestaña Seleccionado junto al primer elemento de la lista del lienzo, que se actualiza para mostrar cómo va a aparecer el elemento cuando los usuarios lo seleccionen. También puede agregar widgets o eliminar, redimensionar y recolocar widgets existentes solo para el estado seleccionado.
  • Herramientas: proporcione herramientas para que los usuarios interactúen con la lista.
    • Buscar: proporcione un cuadro de búsqueda en la lista.
      • Seleccionar los campos de búsqueda: elija uno o más campos de búsqueda.
      • Coincidencia exacta: limite los resultados de búsqueda a solo registros que coincidan con la frase de búsqueda.
      • Sugerencia: proporcione una sugerencia que aparezca como texto del marcado de posición en el cuadro de búsqueda para ayudar a los usuarios a buscar valores relevantes.
    • Ordenar: proporcione un menú para que los usuarios ordenen la lista mediante campos y una secuencia específicos. Escriba un nombre común para cada opción de menú.
    • Filtro: agregue filtros para que los usuarios interactúen con la lista. Al definir filtros, el widget incluye un botón de restablecimiento que restablece los filtros a sus estados originales.
    • Mostrar selección: proporcione la opción para que los usuarios actualicen la lista para visualizar únicamente los elementos seleccionados.
    • Borrar selección: proporcione la opción para que los usuarios borren la selección de todos los elementos seleccionados.
    • Mostrar recuento de registros: muestre recuentos de registros totales y seleccionados.
    Nota:

    Las herramientas Mostrar selección y Borrar selección solo aparecen cuando el estado Seleccionado está habilitado.

Opciones de interacción

El widget admite acciones, que puede configurar en la pestaña Acción de la configuración del widget.

Puede configurar acciones de mensaje para crear interacciones automáticas entre los widgets. Por ejemplo, para hacer que un widget Mapa se acerque automáticamente a una entidad cuando el usuario la selecciona con el widget Lista, puede agregar el desencadenador Cambios de selección de registros, seleccionar un widget Mapa como objetivo y agregar la acción Acercar a.

Active las acciones de datos para agregar botones a la interfaz de usuario del widget Lista para realizar tareas de procesamiento de datos, como exportar, acercar a y establecer filtros. Los usuarios pueden ejecutar acciones de datos para todos los datos de la lista o para las entidades seleccionadas.

Nota:

Cuando los usuarios exportan datos con la acción de datos Exportar, solo se incluyen en la exportación los campos que están siendo utilizados activamente por el widget Lista. Esto incluye los campos que se utilizan para texto dinámico, imágenes dinámicas, etc.