{"_id":"@cordova-ohos/cordova-plugin-navigationbar-color","_rev":"3-d7831f91082eaa05db7a3ed7f2655b35","name":"@cordova-ohos/cordova-plugin-navigationbar-color","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.0":{"name":"@cordova-ohos/cordova-plugin-navigationbar-color","version":"0.1.0","keywords":["cordova","navigationbar-color","ecosystem:cordova","cordova-openharmony"],"author":{"name":"Huawei Device, Inc. Ltd. and","email":"马弓手"},"license":"Apache-2.0","_id":"@cordova-ohos/cordova-plugin-navigationbar-color@0.1.0","maintainers":[{"name":"luqi_tan","email":"295099422@qq.com"},{"name":"wanpengsz","email":"wanpengsz@163.com"},{"name":"xkh111","email":"xukaihui11@163.com"}],"bugs":{"url":"https://gitcode.com/OpenHarmony-Cordova/cordova-plugin-navigationbar-color/issues"},"dist":{"shasum":"09dba36059b4d2dd18f6a02895ca5949a31511f0","tarball":"https://registry.npmjs.org/@cordova-ohos/cordova-plugin-navigationbar-color/-/cordova-plugin-navigationbar-color-0.1.0.tgz","fileCount":9,"integrity":"sha512-MTfEpVL4Z0XoTEBfjE3n9AvwQZIR8HWDJCQQu1zk3Ix/6MVJ9qJ1ywTAuvYVNDvEj7uach5G5bJAmoLu5fRWUg==","signatures":[{"sig":"MEQCIBuJVDNAXS2P7paiperCN3w13OlUO0CdXS0jpsec7Kr0AiAFQatG2UK4cc/TQyyGXW/gDb7aisldBhnrfFDCl2w/qg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":36880},"cordova":{"id":"cordova-plugin-navigationbar-color","platforms":["ohos"]},"engines":{"cordovaDependencies":{"0.1.0":{"hcordova":">=1.0.0","@cordova-ohos/ohos":">=2.0.0"}}},"gitHead":"fd548f66914dd8c4014923cb4d4a84fe35bf522b","_npmUser":{"name":"wanpengsz","email":"wanpengsz@163.com"},"repository":{"url":"gitcode:OpenHarmony-Cordova/cordova-plugin-navigationbar-color","type":"git"},"_npmVersion":"9.6.2","description":"Cordova Navigationbar Plugin","directories":{},"_nodeVersion":"20.16.0","_hasShrinkwrap":false,"_npmOperationalInternal":{"tmp":"tmp/cordova-plugin-navigationbar-color_0.1.0_1773997266998_0.7179689678705512","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@cordova-ohos/cordova-plugin-navigationbar-color","version":"0.1.1","description":"Cordova Navigationbar Plugin","cordova":{"id":"cordova-plugin-navigationbar-color","platforms":["ohos"]},"repository":{"type":"git","url":"gitcode:CPF-Cordova/cordova-plugin-navigationbar-color"},"bugs":{"url":"https://gitcode.com/CPF-Cordova/cordova-plugin-navigationbar-color/issues"},"keywords":["cordova","navigationbar-color","ecosystem:cordova","cordova-openharmony"],"engines":{"cordovaDependencies":{"0.1.1":{"@cordova-ohos/ohos":">=2.0.0","hcordova":">=1.0.0"}}},"author":{"name":"Huawei Device, Inc. Ltd. and","email":"马弓手"},"license":"Apache-2.0","_id":"@cordova-ohos/cordova-plugin-navigationbar-color@0.1.1","gitHead":"6a627f96fb05c0dd885868767d78c0d2e74c3ba0","_nodeVersion":"22.0.0","_npmVersion":"10.5.1","dist":{"integrity":"sha512-mG+9N97GlB9uo74BqLakPqX/G2KOdNJhBfYd5/h9hCNEeLyoKp8zBn63hTbtDsNBH1KHG0RNVPgr7V9ohUrMAA==","shasum":"f59928cb4f2bfcf63212dd7ef4590b25e6adbc67","tarball":"https://registry.npmjs.org/@cordova-ohos/cordova-plugin-navigationbar-color/-/cordova-plugin-navigationbar-color-0.1.1.tgz","fileCount":10,"unpackedSize":53075,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIFC0tfl+M3pHl20ynrvXtw3N1JKwVIqatx+5z9dNfDwmAiBRugWOfj5d4OsfsqgPpIWp7q04Cpbd/CV6zbboKCZing=="}]},"_npmUser":{"name":"luqi_tan","email":"295099422@qq.com"},"directories":{},"maintainers":[{"name":"luqi_tan","email":"295099422@qq.com"},{"name":"wanpengsz","email":"wanpengsz@163.com"},{"name":"xkh111","email":"xukaihui11@163.com"},{"name":"hcordova","email":"chenlihuiabc@163.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/cordova-plugin-navigationbar-color_0.1.1_1785162279501_0.964901435590588"},"_hasShrinkwrap":false}},"time":{"created":"2026-03-20T09:01:06.819Z","modified":"2026-07-27T14:24:39.841Z","0.1.0":"2026-03-20T09:01:07.121Z","0.1.1":"2026-07-27T14:24:39.641Z"},"bugs":{"url":"https://gitcode.com/CPF-Cordova/cordova-plugin-navigationbar-color/issues"},"author":{"name":"Huawei Device, Inc. Ltd. and","email":"马弓手"},"license":"Apache-2.0","keywords":["cordova","navigationbar-color","ecosystem:cordova","cordova-openharmony"],"repository":{"type":"git","url":"gitcode:CPF-Cordova/cordova-plugin-navigationbar-color"},"description":"Cordova Navigationbar Plugin","maintainers":[{"name":"luqi_tan","email":"295099422@qq.com"},{"name":"wanpengsz","email":"wanpengsz@163.com"},{"name":"xkh111","email":"xukaihui11@163.com"},{"name":"hcordova","email":"chenlihuiabc@163.com"}],"readme":"# <center>cordova-plugin-navigationbar-color</center>\r\n\r\n[![zh-CN](https://img.shields.io/badge/lang-中文-blue.svg)](README.md)\r\n[![en](https://img.shields.io/badge/lang-English-blue.svg)](README.en.md)\r\n\r\n本项目基于 [cordova-plugin-navigationbar-color@0.1.0](https://www.npmjs.com/package/cordova-plugin-navigationbar-color/v/0.1.0) 开发，本文档重点阐述其在 OpenHarmony（OHOS）系统中的具体应用。\r\n\r\n- [cordova-plugin-navigationbar-color](#cordova-plugin-navigationbar-color)\r\n  - [简介](#简介)\r\n  - [支持平台](#支持平台)\r\n  - [下载安装](#下载安装)\r\n    - [从 npm 安装（推荐）](#从-npm-安装推荐)\r\n    - [指定平台安装 ohos](#指定平台安装-ohos)\r\n    - [从 GitCode 仓库安装](#从-gitcode-仓库安装)\r\n    - [离线安装（本地包）](#离线安装本地包)\r\n    - [安装后验证](#安装后验证)\r\n    - [卸载](#卸载)\r\n  - [约束与限制](#约束与限制)\r\n    - [兼容性](#兼容性)\r\n  - [使用示例](#使用示例)\r\n    - [1. 显示导航栏](#1-显示导航栏)\r\n    - [2. 隐藏导航栏](#2-隐藏导航栏)\r\n    - [3. 设置导航栏颜色](#3-设置导航栏颜色)\r\n  - [使用说明](#使用说明)\r\n    - [核心说明](#核心说明)\r\n  - [目录结构](#目录结构)\r\n  - [贡献代码](#贡献代码)\r\n  - [许可证](#许可证)\r\n  - [官方资源](#官方资源)\r\n\r\n\r\n## 简介\r\n\r\ncordova-plugin-navigationbar-color 是一款专为 Cordova 混合移动应用打造的导航栏控制插件，支持跨平台自定义设备导航栏的显示和隐藏等核心属性，助力开发者实现与应用风格统一的导航栏视觉效果，提升用户体验。\r\n\r\n- 灵活显示控制：支持导航栏的显示/隐藏切换，可设置临时隐藏或永久隐藏（需适配系统规则）\r\n\r\n- 无依赖轻量设计：不依赖第三方 UI 库，插件体积小巧，对应用性能影响极小\r\n\r\n## 支持平台\r\n\r\n- **Android**：API 19 及以上（Android 4.4+）\r\n\r\n- **iOS**：10.0 及以上\r\n\r\n- **OHOS**：5.0+\r\n\r\n## 下载安装\r\n\r\n通过 hcordova CLI 即可快速安装插件，支持从 npm 仓库或 GitCode 仓库获取。\r\n\r\n### 从 npm 安装（推荐）\r\n\r\n```bash\r\n# 使用 hcordova CLI 安装\r\n\r\n# 安装 hcordova 命令化工具\r\nnpm install -g hcordova\r\n\r\n# 全平台安装插件\r\nhcordova plugin add cordova-plugin-navigationbar-color\r\n```\r\n\r\n### 指定平台安装 ohos\r\n\r\n仅为 OHOS 平台安装插件：\r\n\r\n```bash\r\n# 仅安装到 OHOS 平台\r\nhcordova plugin add cordova-plugin-navigationbar-color --platform ohos\r\n\r\n# 指定版本安装\r\nhcordova plugin add cordova-plugin-navigationbar-color@1.0.0 --platform ohos\r\n```\r\n\r\n### 从 GitCode 仓库安装\r\n\r\n仅为 OHOS 平台安装插件：\r\n\r\n```bash\r\n# 仅安装到 OHOS 平台\r\n\r\n# 默认分支安装\r\nhcordova plugin add https://gitcode.com/CPF-Cordova/cordova-plugin-navigationbar-color.git --platform ohos\r\n\r\n# 指定标签/分支安装\r\nhcordova plugin add https://gitcode.com/CPF-Cordova/cordova-plugin-navigationbar-color.git@develop --platform ohos\r\n```\r\n\r\n### 离线安装（本地包）\r\n\r\n适用于无网络环境，先下载插件包到本地，再执行离线安装：\r\n\r\n```bash\r\n# 下载插件包到本地（示例路径：~/Downloads/cordova-plugin-navigationbar-color）\r\n# 执行离线安装\r\nhcordova plugin add ~/Downloads/cordova-plugin-navigationbar-color --platform ohos\r\n```\r\n\r\n### 安装后验证\r\n\r\n安装完成后，可通过以下命令验证插件是否成功添加到项目中：\r\n\r\n```bash\r\n# 查看已安装的插件列表，若包含本插件 ID 则表示插件已成功安装\r\nhcordova plugin list\r\n```\r\n\r\n### 卸载\r\n\r\n```bash\r\n# Cordova CLI 全平台卸载\r\nhcordova plugin remove cordova-plugin-navigationbar-color \r\n\r\n# 指定平台卸载\r\nhcordova plugin remove cordova-plugin-navigationbar-color --platform ohos\r\n```\r\n\r\n## 约束与限制\r\n### 兼容性\r\n\r\n支持：\r\n\r\n| 项目 | 版本/信息 |\r\n|-----|--------|\r\n| SDK | API12+ |\r\n| IDE | DevEco Studio: 5.0+ |\r\n| ROM | 5.1+ |\r\n| Emulator | OpenHarmony 6.0+ |\r\n\r\n在以下版本中已测试通过：\r\n\r\n| 项目 | 版本/信息 |\r\n|-----|--------|\r\n| @cordova-ohos/ohos | 14.0.1-ohos-14.0.1 |\r\n| SDK | 5.0.0(12) |\r\n| IDE | DevEco Studio: 6.0.13.200 |\r\n| ROM | 5.1.0.120 SP3 |\r\n| Emulator | OpenHarmony 6.0.1(21) |\r\n\r\n## 使用示例\r\n\r\n插件暴露全局对象 `window.NavigationBar`，所有方法均支持回调函数语法，以下为核心功能的使用示例，可直接复制到项目中使用。\r\n\r\n### 1. 显示导航栏\r\n\r\n显示隐藏的导航栏，若导航栏已显示则无效果。\r\n\r\n```javascript\r\nNavigationBar.show();\r\n```\r\n\r\n### 2. 隐藏导航栏\r\n\r\n隐藏当前显示的导航栏，实现沉浸式全屏效果。\r\n\r\n```javascript\r\nNavigationBar.hide();\r\n```\r\n\r\n### 3. 设置导航栏颜色\r\n\r\n支持通过颜色名称或十六进制颜色字符串设置导航栏颜色，可指定是否高亮显示导航栏。\r\n\r\n参数说明：\r\n\r\n- **colorname**：颜色名称（支持常见标准颜色）\r\n\r\n- **hexString**：十六进制颜色字符串（如 #000000）\r\n\r\n- **lightNavigationBar**：是否高亮显示导航栏（布尔值）\r\n\r\n支持的颜色名称及对应十六进制值：\r\n\r\n| 名称 | 颜色 |\r\n|---|---|\r\n| \"black\" | \"#000000\" |\r\n| \"darkGray\" | \"#A9A9A9\" |\r\n| \"lightGray\" | \"#D3D3D3\" |\r\n| \"white\" | \"#FFFFFF\" |\r\n| \"gray\" | \"#808080\" |\r\n| \"red\" | \"#FF0000\" |\r\n| \"green\" | \"#00FF00\" |\r\n| \"blue\" | \"#0000FF\" |\r\n| \"cyan\" | \"#00FFFF\" |\r\n| \"yellow\" | \"#FFFF00\" |\r\n| \"magenta\" | \"#FF00FF\" |\r\n| \"orange\" | \"#FFA500\" |\r\n| \"purple\" | \"#800080\" |\r\n| \"brown\" | \"#A52A2A\" |\r\n\r\n```javascript\r\n// 通过名称设置导航栏颜色\r\nNavigationBar.backgroundColorByName(\"blue\", false);\r\n\r\n// 通过十六进制字符串设置导航栏颜色\r\nNavigationBar.backgroundColorByHexString(\"#000000\", false);\r\n```\r\n\r\n## 使用说明\r\n\r\n### 核心说明\r\n\r\n1. 插件调用：所有 API 均通过全局对象 `window.NavigationBar` 调用，无需额外引入，直接调用对应方法即可。\r\n2. 功能说明：show() 用于显示导航栏，hide() 用于隐藏导航栏；backgroundColorByName() 和 backgroundColorByHexString() 用于设置导航栏颜色，适配系统原生导航栏规则，临时隐藏后切换页面可能恢复显示，永久隐藏需遵循对应系统规则。\r\n3. 颜色设置说明：颜色名称需严格匹配支持的列表，十六进制颜色字符串需规范（以 # 开头，后跟 6 位字符）；lightNavigationBar 参数设为 true 时导航栏高亮显示，false 时为默认显示效果。\r\n4. 权限说明：插件无需额外申请权限，自动适配系统导航栏控制权限，无需手动编写权限申请代码。\r\n5. 错误处理：API 调用失败时，可通过回调函数查看错误信息，便于问题排查；颜色设置不生效时，需检查颜色名称/十六进制字符串是否正确、平台是否适配。\r\n\r\n## 目录结构\r\n\r\n```\r\ncordova-plugin-navigationbar-color # [根目录] 导航栏颜色插件项目根目录\r\n├── src                            # [源码目录] 存放原生平台代码\r\n│   └── main                       # [主目录] 主代码目录\r\n│       ├── cpp                    # [C++ 目录] C++ 原生代码目录\r\n│       │   └── NavigationBar      # [C++ 模块] 导航栏 C++ 模块文件夹\r\n│       │       ├── NavigationBar.cpp # [C++ 实现] C++ 源文件，实现底层逻辑\r\n│       │       └── NavigationBar.h   # [C++ 声明] C++ 头文件，定义接口\r\n│       └── ets                    # [ArkTS 目录] ArkTS/ETS 代码目录\r\n│           └── components         # [组件目录] 存放 UI 组件\r\n│               └── NavigationBar  # [TS 模块] 导航栏 TS 模块文件夹\r\n│                   └── NavigationBar.ets # [ETS 文件] ArkTS 界面组件实现\r\n├── www                            # [前端目录] 存放供 Web 端调用的 JS 接口文件\r\n│   └── navigationbar.js           # [JS 文件] 导航栏操作的 JS 接口逻辑\r\n├── .gitignore                     # [配置文件] Git 版本控制忽略列表\r\n├── LICENSE                        # [文本文件] 项目开源许可证\r\n├── OAT.xml                        # [配置文件] 门禁审查文件\r\n├── package.json                   # [配置文件] NPM 包管理及依赖配置\r\n├── plugin.xml                     # [配置文件] Cordova 插件核心配置文件\r\n└── README.md                      # [说明文档] 项目的使用说明文档\r\n```\r\n\r\n## 贡献代码\r\n\r\n使用过程中发现任何问题都可以提 [Issue](https://gitcode.com/CPF-Cordova/cordova-plugin-navigationbar-color/issues) ，当然也非常欢迎发 [PR](https://gitcode.com/CPF-Cordova/cordova-plugin-navigationbar-color/pulls) 共建。\r\n\r\n## 许可证\r\n\r\n本插件基于 **Apache License 2.0** 开源，详见 [LICENSE](LICENSE) 文件。\r\n\r\n## 官方资源\r\n\r\nOHOS Cordova [https://gitcode.com/CPF-Cordova/cordova-plugin-navigationbar-color](https://gitcode.com/CPF-Cordova/cordova-plugin-navigationbar-color)\r\n\r\nAndroid/iOS：[https://npmjs.com/cordova-plugin-navigationbar-color](https://npmjs.com/cordova-plugin-navigationbar-color)\r\n","readmeFilename":"README.md"}