@capgo/capacitor-native-navigation

原生 Chrome

使用原生 UI 绘制顶部导航栏和底部标签栏

使用 web 组件以外的平台 UI 绘制顶部导航栏和底部标签栏

web 所有路由

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

序列化图标

使用 SVG、SF Symbol、捆绑图像或 Android drawable 描述符配置标签和按钮

捕捉当前 WebView，更新内容在 JavaScript 中，然后用原生快照到 WebView 动画结束。

缩放路线

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

演示

原生壳	点击流

核心 API

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

事件

• navbarBack 当原生返回手柄被点击时触发。
• navbarItemTap 当原生导航栏操作按钮被点击时触发。
• tabSelect 当原生选项卡被选中时触发。
• safeAreaChanged 报告本地bar和安全区域内边距的变化。
• transitionStart 并 transitionEnd 报告本地过渡边界。

平台模型

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

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

该插件不创建一个本机WebView per路由。版本1保留一个Capacitor WebView以实现桥梁稳定性，并让本机只拥有框架、bar视觉、标签选择Chrome、安全区域报告和过渡壳。

从@capgo/capacitor-native-navigation继续

如果您正在使用 @capgo/capacitor-native-navigation 连接它与 使用 @capgo/capacitor-native-navigation 为native能力在使用 @capgo/capacitor-native-navigation 使用 @capgo/capacitor-live-activities 为native能力在使用 @capgo/capacitor-live-activities @capgo/capacitor-live-activities 为@capgo/capacitor-live-activities的实现细节 使用 @capgo/capacitor-video-player 为native能力在使用 @capgo/capacitor-video-player 和@capgo/capacitor-video-player 关于在 @capgo/capacitor-video-player 中的实现细节。