@capgo/native-navigation

Fahren Sie iOS- und Android-Navigation Chrome nativ aus, während JavaScript Routen, Inhalte, Icons, Beschriftungen und Statusleisten behält.

Loslegen GitHub

Native Chrome

Zeichnen Sie die oberen Navigationsleiste und die unteren Tab-Leiste mit Plattform-UI anstatt mit Web-Komponenten.

Web-eigene Routen

Native sendet Ereignisse für Benutzerabsicht, dann ändert Ihr bestehender Router den WebView-Inhalt.

Serialisierte Icons

Konfigurieren Sie Tabs und Schaltflächen mit SVG, SF Symbol, eingebetteter Bilddatei oder Android-Drawable-Deskriptoren.

Native Übergangsschale

Fangen Sie den aktuellen WebView ein, aktualisieren Sie den Inhalt in JavaScript und beenden Sie mit einer nativen Snapshot-to-WebView-Animation.

Core API

configure(options?) ermöglicht den native Chrome-Host und steuert die Inhalte-Einrückungen.
setNavbar(options) aktualisiert native Titel, Untertitel, Zurück-Button, Schaltflächen, Farben, Transparenz und Sichtbarkeit.
setTabbar(options) aktualisiert Tabs, ausgewählter Tab, Badges, Beschriftungen, Icons, Farben und Sichtbarkeit.
beginTransition(options?) fängt das ausgehende WebView vor der JavaScript Routenänderung ein.
finishTransition(options?) animiert von dem aufgenommenen Snapshot zum lebenden WebView nachdem die Routeninhalt bereit ist.
getPluginVersion() gibt die native Implementierungsversionssymbol zurück.

Events

navbarBack Wird ausgelöst, wenn ein native Navbar-Action-Button getippt wird.
navbarItemTap Wird ausgelöst, wenn ein native Tab ausgewählt wird.
tabSelect Meldet native Bar- und Safe-Area-Einsetzungen.
safeAreaChanged und
transitionStart und transitionEnd nativ-übergreifende Übergangsgrenzen melden.

Plattformmodell

iOS verwendet UINavigationBar und UITabBar. Bei iOS 26 und neuer lässt das Plugin dem System Liquid Glass-Verhalten rendern; ältere Versionen verwenden native durchsichtige/Material-Überläufe.

Android verwendet einen AppCompat-Toolbar und eine Material-Unter-Navigation mit Rand-zu-Rand-Anordnung.

Das Plugin erstellt keine einzelnen native WebView pro Route. Version 1 hält ein einzelnes Capacitor WebView für Brücke-Stabilität und lässt native nur den Rahmen, die Leiste, die Tab-Selektions-Chrome, die sichere Bereichs-Berichterstattung und die Übergangshülle besitzen.