Sobre el proyecto
react-native-spotlight-tour es una biblioteca de React Native para crear recorridos de producto guiados y tutoriales introductorios con un efecto de foco. Es compatible con Android, iOS y web, y utiliza Floating UI para posicionar el contenido de los tooltips alrededor de los elementos resaltados.
Los desarrolladores definen los pasos del recorrido como un arreglo de TourStep y envuelven el contenido de la aplicación en SpotlightTourProvider. El componente AttachStep vincula elementos de la interfaz de usuario con índices de pasos, mientras que el hook useSpotlightTour expone controles como iniciar, detener, avanzar al siguiente paso y volver al paso anterior. El middleware de Floating UI, incluidos offset, shift y flip, se puede configurar globalmente para el recorrido o sobrescribirse en pasos individuales.
La biblioteca admite personalización del color y la opacidad de la superposición, movimiento del foco como rebote, desvanecimiento y deslizamiento, y el comportamiento de presión del fondo. El componente integrado TourBox proporciona un contenedor de tooltip configurable con título, etiquetas de navegación y opciones de estilo. Los pasos también pueden ejecutar una acción antes de renderizar y usar funciones de renderizado completamente personalizadas.
La instalación está disponible a través de npm o yarn. Los requisitos documentados son React 16.8.0 o superior, React Native 0.50.0 o superior y react-native-svg 12.1.0 o superior. La versión 3 renombró el paquete de @stackbuilders/react-native-spotlight-tour a react-native-spotlight-tour y reemplazó las propiedades de posicionamiento antiguas con la configuración de Floating UI. El proyecto tiene licencia MIT e incluye documentación de API y una aplicación de ejemplo.
Comments
0 people shared their preference · Deer Point appears after 10 participants
Sign in to join the discussion.