Pular al contenido
Capgo - Live Updates for Capacitor Apps Capgo

@capgo/capacitor-navegación nativa

Render navegación de iOS y Android nativamente mientras JavaScript mantiene el control de rutas, contenido, iconos, etiquetas y estado de la barra.
Empezar @GitHub

Chrome nativo

Dibuja la barra de navegación superior y la pestaña inferior con la interfaz de plataforma en lugar de componentes web.

Rutas propiedad de la web

Native emite eventos de intención del usuario, luego tu router existente cambia el contenido de la WebView.

Iconos serializados

Configura pestañas y botones con SVG, SF Symbol, imagen embutida o descripciones de recursos de Android drawable.

Transición nativa de shell

Capturar la WebView actual, actualizar contenido en JavaScript, y finalizar con una animación de snapshot nativo a WebView.

Zoom de rutas

Abra rutas de tarjeta, malla y detalles de medios con geometría de zoom nativa estilo compartido-elemento.

Demo

Título de sección “Demo”
Concha nativaToca el flujo
Demo de caja de navegación nativa animada que muestra un menú de navegación, pestañas y contenido de WebViewDemo animada de concha de navegación nativa que muestra una barra de navegación nativa, pestañas y contenido de WebView

Core API

Section titled “Core API”
  • configure(options?) habilita el host de Chrome nativo y controla los márgenes de contenido.
  • setNavbar(options) actualiza el título, subtítulo, botón de atrás, botones, colores, transparencia y visibilidad.
  • setTabbar(options) actualiza las pestañas, pestaña seleccionada, etiquetas, iconos, colores y visibilidad.
  • beginTransition(options?) captura el WebView saliente antes del cambio de ruta en JavaScript.
  • finishTransition(options?) anima desde la captura de instantáneo hasta la WebView en vivo después de que el contenido de la ruta esté disponible.
  • beginZoomTransition(target, options?) y finishZoomTransition(target?, options?) son ayudantes de JavaScript para transiciones de zoom desde elementos o rectángulos.
  • getPluginVersion() devuelve el marcador de versión de la implementación nativa.

Eventos

Sección titulada “Eventos”
  • navbarBack se dispara cuando se presiona el botón de atrás nativo.
  • navbarItemTap fires when a native navbar action button is tapped.
  • tabSelect se dispara cuando se selecciona una pestaña nativa.
  • safeAreaChanged reporta cambios en la barra nativa y el área de seguridad.
  • transitionStart y transitionEnd informa los límites de transición nativa.

Modelo de plataforma

Sección titulada “Modelo de plataforma”

iOS utiliza UINavigationBar y UITabBariOS 26 y posteriores utilizan el sistema para renderizar el comportamiento de vidrio líquido; las versiones anteriores utilizan fallbacks de transparencia material nativa.

Usa un toolbar de AppCompat y navegación inferior Material con colocación de borde a borde en Android.

El plugin no crea un WebView nativo por ruta. La versión 1 mantiene un solo WebView Capacitor para estabilidad de puente y deja que la nativa tenga solo el marco, la barra de visualización, la selección de pestañas, la informe de seguridad de área y la caja de transición.

Sigue adelante desde @capgo/capacitor-native-navigation

Sección titulada “Sigue adelante desde @capgo/capacitor-navegación-nativa”

Si estás utilizando @capgo/capacitor-navegación-nativa para planificar el comportamiento de medios y interfaz nativa, conecta con Usando @capgo/capacitor-navegación-nativa para la capacidad nativa en Usando @capgo/capacitor-navegación-nativa, Usando @capgo/capacitor-actividades-en-vivo para la capacidad nativa en Usando @capgo/capacitor-actividades-en-vivo, @capgo/capacitor-actividades-en-vivo para el detalle de implementación en @capgo/capacitor-actividades-en-vivo, Usando @capgo/capacitor-reproductor-de-video para la capacidad nativa en Usando @capgo/capacitor-reproductor-de-video, y @capgo/capacitor-reproductor-de-videos para el detalle de implementación en @capgo/capacitor-reproductor-de-videos.