@capgo/capacitor-navigation native

Chrome natif

Dessinez la barre de navigation supérieure et la barre de boutons inférieure avec l'interface utilisateur du système au lieu de composants web.

Routes détenues par le web

Le navigateur natif émet des événements d'intention utilisateur, puis votre routeur existant change le contenu de la fenêtre WebView.

Icônes sérialisées

Configurer les onglets et les boutons avec des icônes SVG, SF Symbol, des images embarquées ou des déscripteurs Android drawable.

Shell de transition native

Capturer la WebView actuelle, mettre à jour le contenu en JavaScript, puis terminer avec une animation de snapshot à WebView native.

Zoom des routes

Ouvrir les routes de carte, grille et détails de média avec une géométrie de zoom native de style partagé.

Demo

Shell native	Flux de clic

Noeud API

• configure(options?) active le hôte chrome natif et contrôle les marges de contenu.
• setNavbar(options) met à jour le titre, le sous-titre, le bouton Retour, les boutons, les couleurs, la transparence et la visibilité.
• setTabbar(options) met à jour les onglets, l'onglet sélectionné, les badges, les étiquettes, les icônes, les couleurs et la visibilité.
• beginTransition(options?) captures la vue WebView en sortie avant le changement de route JavaScript.
• finishTransition(options?) anime à partir du snapshot capturé vers la vue WebView en direct après que le contenu de la route soit prêt.
• beginZoomTransition(target, options?) et finishZoomTransition(target?, options?) sont des aides JavaScript pour les transitions de zoom à partir d'éléments ou de rectangles.
• getPluginVersion() renvoie la marque de version de l'implémentation native.

Événements

• navbarBack se déclenche lorsque l'affordance de retour natif est tapée.
• navbarItemTap se déclenche lorsque l'on appuie sur un bouton d'action de la barre de navigation native.
• tabSelect se déclenche lorsque l'on sélectionne une barre de navigation native.
• safeAreaChanged signale les changements dans les barres et les espaces de sécurité de la zone d'écran native.
• transitionStart et transitionEnd signale les limites de transition native.

Modèle de Plateforme

iOS utilise UINavigationBar et UITabBarSur iOS 26 et ultérieur, le plugin permet au système de rendre le comportement de verre liquide ; les versions plus anciennes utilisent des fallbacks translucides/matériels natives.

Android utilise un outil de barre d'outils AppCompat et une navigation matérielle avec un placement bord-à-bord.

The plugin does not create one native WebView per route. Version 1 keeps a single Capacitor WebView for bridge stability and lets native own only the frame, bar visuals, tab selection chrome, safe-area reporting, and transition shell.

Continuez à partir de @capgo/capacitor-navigation-native

Si vous utilisez @capgo/capacitor-navigation-native pour planifier le comportement de médias et d'interface natives, connectez-le avec En utilisant @capgo/capacitor-navigation-native pour la capacité native dans En utilisant @capgo/capacitor-navigation-native En utilisant @capgo/capacitor-activités-en-vivre pour la capacité native dans En utilisant @capgo/capacitor-activités-en-vivre @capgo/capacitor-activités-en-vivre pour le détail d'implémentation dans @capgo/capacitor-activités-en-vivre En utilisant @capgo/capacitor-joueur-de-videos pour la capacité native en utilisant @capgo/capacitor-video-player, et @capgo/capacitor-video-player pour le détail d'implémentation en @capgo/capacitor-video-player.