Native Chrome
使用平台原生 UI 绘制顶部导航栏和底部标签栏,而非 Web Components。
Native Chrome
使用平台原生 UI 绘制顶部导航栏和底部标签栏,而非 Web Components。
Web 端路由
Native 发出用户意图事件,随后由您现有的路由程序更改 WebView 内容。
序列化图标
使用 SVG、SF Symbol、Bundle 资源或 Android drawable 描述符来配置标签页和按钮。
Native 过渡外壳
捕获当前的 WebView,在 JavaScript 中更新内容,最后通过 Native snapshot-to-WebView 动画完成过渡。
缩放路由
通过共享元素风格的 Native 缩放几何效果,打开卡片、网格和媒体详情路由。
| 原生 Shell | 点按流程 | 多级导航栏 (iOS) | 多级导航栏(Android) |
|---|---|---|---|
![]() | ![]() | ![]() | ![]() |
configure(options?) 启用原生界面外壳宿主并控制内容内边距(insets)。setNavbar(options) 更新原生标题、副标题、返回按钮、操作按钮、颜色、透明度、可见性以及栏下方的多级分段行(segments).setTabbar(options) 更新标签页、选中标签页、角标、标签、图标、颜色和可见性。beginTransition(options?) 在 JavaScript 路由发生变化前捕获即将退出的 WebView。finishTransition(options?) 在路由内容就绪后,从捕获的快照动画过渡到实时 WebView。beginZoomTransition(target, options?) 以及 finishZoomTransition(target?, options?) 是用于元素或矩形缩放过渡的 JavaScript 辅助函数。getPluginVersion() 返回原生实现的版本标记。navbarBack 当点击原生返回控件时触发。navbarItemTap 当点击原生导航栏操作按钮时触发。navbarSegmentSelect 当选中导航栏分段行中的某一项时触发。tabSelect 当选中原生标签页时触发。safeAreaChanged 报告原生栏与安全区域内边距的变化。transitionStart 以及 transitionEnd 报告原生过渡边界。iOS 使用 UINavigationBar 以及 UITabBar。在 iOS 26 及更高版本中,该插件允许系统渲染 Liquid Glass 效果;旧版本则使用原生的半透明/材质回退方案。
Android 使用 AppCompat toolbar 和 Material 底部导航,并采用全屏(edge-to-edge)布局。
该插件不会为每个路由创建一个原生的 WebView。Version 1 保留单个 Capacitor WebView 以确保 bridge 稳定性,并仅让原生层负责外框、状态栏视觉效果、标签栏选择 UI、安全区域(safe-area)报告以及过渡外壳。
如果你正在使用 @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. 中的实现细节