@capgo/capacitor-native-navigation

原生导航栏

使用平台 UI 代替 Web 组件绘制顶部导航栏和底部选项卡栏。

Web 所有路由

原生发送用户意图事件，然后您的现有路由器改变 WebView 内容。

序列化图标

使用 SVG、SF Symbol、捆绑图像或 Android drawable 描述符配置选项卡和按钮。

原生过渡壳

捕获当前 WebView，更新内容在 JavaScript 中，然后使用原生快照到 WebView 动画完成。

缩放路由

打开卡片、网格和媒体详细路由，使用共享元素样式的原生缩放几何。

演示

原生 shell	点击流

核心 API

• configure(options?) 使原生 Chrome 主机启用并控制内容边距。
• setNavbar(options) 更新原生标题、副标题、后退按钮、按钮、颜色、透明度和可见性。
• setTabbar(options) 更新标签、选中标签、徽章、标签、图标、颜色和可见性。
• beginTransition(options?) __CAPGO_KEEP_0__捕获 WebView 之前 JavaScript 路由更改。
• finishTransition(options?) __CAPGO_KEEP_0__从捕获的快照中动画到 live WebView 后路由内容准备好。
• beginZoomTransition(target, options?) 并且 finishZoomTransition(target?, options?) 用于元素或矩形的 JavaScript zoom 过渡帮助。
• getPluginVersion() 返回原生实现版本标记。

事件

• navbarBack 当原生后退操作按钮被点击时触发。
• navbarItemTap 当原生导航栏操作按钮被点击时触发。
• tabSelect 当原生选项卡被选中时触发。
• safeAreaChanged 报告原生栏和安全区域内边距的变化。
• transitionStart 并且 transitionEnd 报告原生转换边界。

平台模型

iOS 使用 UINavigationBar 和 UITabBar在 iOS 26 和更高版本中，插件让系统渲染 Liquid Glass 行为；旧版本使用原生透明/材料 fallbacks。

Android 使用 AppCompat 工具栏和 Material 底部导航栏，边缘到边缘放置。

插件不创建一个原生 WebView per 路由。版本 1 保持一个单独的 Capacitor WebView 以便桥梁稳定，让原生拥有仅仅是框架，条形视觉，标签选择 Chrome，安全区域报告和转换壳。

继续从 @capgo/capacitor-native-navigation

如果您正在使用 @capgo/capacitor-native-navigation 为原生媒体和界面行为制定计划，连接它 使用@capgo/capacitor-native-navigation 原生能力在使用@capgo/capacitor-native-navigation 使用@capgo/capacitor-live-activities 原生能力在使用@capgo/capacitor-live-activities @capgo/capacitor-live-activities 原生能力在@capgo/capacitor-live-activities 使用@capgo/capacitor-video-player 原生能力在使用@capgo/capacitor-video-player @capgo/capacitor-video-player 原生能力在@capgo/capacitor-video-player