@capgo/capacitor-navigation native

Native chrome

Dessinez la barre de navigation supérieure et la barre de boutons inférieure à l'aide de l'interface utilisateur de la plateforme au lieu de composants web.

Routes détenues par le web

La navigation native émet des événements d'intention de l'utilisateur, puis votre routeur existant modifie le contenu de la vue WebView.

Icônes sérialisées

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

Shell de transition native

Capturez la vue actuelle, mettez à jour le contenu en JavaScript puis terminez par une animation de snapshot à la vue native.

Zoom des routes

Ouvrez les routes carte, grille et détails médias avec une géométrie de zoom native partagée.

Demo

Shell native	Flux de clic

Core API

• configure(options?) active le hôte de 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 L'événement est déclenché lorsque l'utilisateur clique sur un bouton d'action de la barre de navigation native.
• tabSelect L'événement est déclenché lorsqu'une onglet natif est sélectionné.
• safeAreaChanged Les rapports de changements des barres natives et des espaces de sécurité de l'aire sécurisée.
• transitionStart et transitionEnd signaler les limites de transition native.

Modèle de plateforme

iOS utilise UINavigationBar et UITabBarSur iOS 26 et versions ultérieures, le plugin laisse le système rendre le comportement de Liquid Glass ; les versions plus anciennes utilisent des fallbacks translucides/matériels natifs.

L'Android utilise un barre d'outils AppCompat et une navigation en bas matérielle avec un placement bord à bord.

Le plugin ne crée pas une WebView native par route. La version 1 conserve une seule Capacitor WebView pour la stabilité de la passerelle et laisse la navigation native gérer uniquement la barre d'adresse, la sélection de la page, la zone de sécurité et le shell de transition.

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

Si vous utilisez @capgo/capacitor-navigation-native pour planifier le comportement de médias et d'interface natives, connectez-l’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 dans l'utilisation de @capgo/capacitor-video-player, et @capgo/capacitor-video-player pour le détail d'implémentation dans @capgo/capacitor-video-player.