From 935f63ce57c37b3d81f955b14984a237bf331238 Mon Sep 17 00:00:00 2001 From: liang_tao001 Date: Fri, 23 Jan 2026 15:56:13 +0800 Subject: [PATCH 1/2] =?UTF-8?q?docs:=20=E4=BF=AE=E6=94=B9react-native-orie?= =?UTF-8?q?ntation-locker=20=E5=BA=93=E7=9A=84=E4=BD=BF=E7=94=A8=E6=96=87?= =?UTF-8?q?=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: liang_tao001 --- en/react-native-orientation-locker.md | 167 +++++++++-------------- zh-cn/react-native-orientation-locker.md | 147 ++++++++------------ 2 files changed, 126 insertions(+), 188 deletions(-) diff --git a/en/react-native-orientation-locker.md b/en/react-native-orientation-locker.md index ef8e2aab..283a378a 100644 --- a/en/react-native-orientation-locker.md +++ b/en/react-native-orientation-locker.md @@ -1,34 +1,23 @@ -> Template version: v0.2.1 +> Template version: v0.4.0

react-native-orientation-locker

-

- - Supported platforms - - - License - -

- -> [!TIP] [GitHub address](https://github.com/react-native-oh-library/react-native-orientation-locker) -This third-party library has been migrated to Gitcode and is now available for direct download from npm, the new package name is: `@react-native-ohos/react-native-orientation-locker`, After introducing the new version of the third-party library, The version correspondence details are as follows: +This project is based on [react-native-orientation-locker](https://github.com/wonday/react-native-orientation-locker) 。 -| Version | Package Name | Repository | Release | -| ------------------------------ | --------------------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | -| <= 1.7.0-0.0.7@deprecated | @react-native-oh-tpl/react-native-orientation-locker | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-orientation-locker) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-orientation-locker/releases) | -| > 1.7.0 | @react-native-ohos/react-native-orientation-locker | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | +This third-party library has been migrated to Gitcode and is now available for direct download from npm, the new package name is：`@react-native-ohos/react-native-orientation-locker` The version correspondence details are as follows： +| Name | Version | Release Information | Supported RN Version | Supported Autolink | Compile API Version | Community Baseline Version | npm Address | +| ------------ | ------------ | ------------------------------ | ------------- | ------------- |------------------------ | ------------- | ------------- | +| @react-native-ohos/react-native-orientation-locker | 1.8.0 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | 0.77 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-orientation-locker) | +| @react-native-ohos/react-native-orientation-locker | 1.7.1 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | 0.72 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-orientation-locker) | +| @react-native-oh-tpl/react-native-orientation-locker | <= 1.7.0-0.0.7@deprecated | [Gitcode Releases](https://github.com/react-native-oh-library/react-native-orientation-locker/releases) | 0.72 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-orientation-locker) | -## Installation and Usage -Find the matching version information in the release address of a third-party library: [@react-native-oh-library/react-native-orientation-locker Releases](https://github.com/react-native-oh-library/react-native-orientation-locker/releases). For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package. +## 1. Installation and Usage Go to the project directory and execute the following instruction: - - #### npm @@ -50,6 +39,7 @@ The following code shows the basic use scenario of the repository: > [!WARNING] The name of the imported repository remains unchanged. ```tsx + import { Alert, Button, @@ -216,36 +206,43 @@ const styles = StyleSheet.create({ }); ``` -## Link +## 2. Manual Link + +| | Supported Autolink | Supported RN Version | +|--------------------------------------|--------------|--------| +| ~1.8.0 | No | 0.77 | +| ~1.7.1 | Yes | 0.72 | +| <= 1.7.0-0.0.7@deprecated | No | 0.72 | -| | Is supported autolink | Supported RN Version | -|--------------------------------------|-----------------------|----------------------| -| ~1.7.1 | Yes | 0.72 | -| <= 1.7.0-0.0.7@deprecated | No | 0.72 | +Projects using AutoLink need to be configured according to this document, AutoLink framework guide.：https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md -Using AutoLink need to be configured according to this document, Autolink Framework Guide Documentation: https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md +If the version you are using supports Autolink and the project has integrated Autolink, you can skip the ManualLink configuration. -If the version you use supports Autolink and the project has been connected to Autolink, skip the ManualLink configuration.
- ManualLink: this step is a guide to manually configure native dependencies. + ManualLink: This step provides guidance for manually configuring native dependencies. Open the `harmony` directory of the HarmonyOS project in DevEco Studio. -### 1. Adding the overrides Field to oh-package.json5 File in the Root Directory of the Project +### 2.1. Overrides RN SDK +To ensure the project relies on the same version of the RN SDK, you need to add an `overrides` field in the project's root `oh-package.json5` file, specifying the RN SDK version to be used. The replacement version can be a specific version number, a semver range, or a locally available HAR package or source directory. + +For more information about the purpose of this field, please refer to the [official documentation](https://developer.huawei.com/consumer/en/doc/harmonyos-guides-V5/ide-oh-package-json5-V5#en-us_topic_0000001792256137_overrides). ```json { - ... "overrides": { - "@rnoh/react-native-openharmony" : "./react_native_openharmony" + "@rnoh/react-native-openharmony": "file:../react_native_openharmony" } } ``` -### 2. Introducing Native Code +### 2.2. Introducing Native Code Currently, two methods are available: +- Use the HAR file. +- Directly link to the source code。 + Method 1 (recommended): Use the HAR file. > [!TIP] The HAR file is stored in the `harmony` directory in the installation path of the third-party library. @@ -256,7 +253,7 @@ Open `entry/oh-package.json5` file and add the following dependencies: "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", "@react-native-ohos/react-native-orientation-locker":"file:../../node_modules/@react-native-ohos/react-native-orientation-locker/harmony/orientation_locker.har" - } +} ``` Click the `sync` button in the upper right corner. @@ -272,44 +269,20 @@ Method 2: Directly link to the source code. > [!TIP] For details, see [Directly Linking Source Code](/en/link-source-code.md). -### 3. Configuring CMakeLists and Introducing OrientationLockerPackage +### 2.3. Configuring CMakeLists and Introducing OrientationLockerPackage > If you are using version <= 1.7.0-0.0.7, please skip this chapter. Open `entry/src/main/cpp/CMakeLists.txt` and add the following code: ```diff -project(rnapp) -cmake_minimum_required(VERSION 3.4.1) -set(CMAKE_SKIP_BUILD_RPATH TRUE) -set(RNOH_APP_DIR "${CMAKE_CURRENT_SOURCE_DIR}") -set(NODE_MODULES "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../node_modules") + set(OH_MODULES "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules") -set(RNOH_CPP_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../../react-native-harmony/harmony/cpp") -set(LOG_VERBOSITY_LEVEL 1) -set(CMAKE_ASM_FLAGS "-Wno-error=unused-command-line-argument -Qunused-arguments") -set(CMAKE_CXX_FLAGS "-fstack-protector-strong -Wl,-z,relro,-z,now,-z,noexecstack -s -fPIE -pie") -set(WITH_HITRACE_SYSTRACE 1) # for other CMakeLists.txt files to use -add_compile_definitions(WITH_HITRACE_SYSTRACE) - -add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 -add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-orientation-locker/src/main/cpp" ./orientation_locker) # RNOH_END: manual_package_linking_1 -file(GLOB GENERATED_CPP_FILES "./generated/*.cpp") - -add_library(rnoh_app SHARED - ${GENERATED_CPP_FILES} - "./PackageProvider.cpp" - "${RNOH_CPP_DIR}/RNOHAppNapiBridge.cpp" -) -target_link_libraries(rnoh_app PUBLIC rnoh) - # RNOH_BEGIN: manual_package_linking_2 -target_link_libraries(rnoh_app PUBLIC rnoh_sample_package) + target_link_libraries(rnoh_app PUBLIC rnoh_orientation_locker) # RNOH_END: manual_package_linking_2 ``` @@ -319,7 +292,6 @@ Open `entry/src/main/cpp/PackageProvider.cpp` and add the following code: ```diff #include "RNOH/PackageProvider.h" #include "generated/RNOHGeneratedPackage.h" -#include "SamplePackage.h" + #include "OrientationLockerPackage.h" using namespace rnoh; @@ -327,29 +299,28 @@ using namespace rnoh; std::vector> PackageProvider::getPackages(Package::Context ctx) { return { std::make_shared(ctx), - std::make_shared(ctx), + std::make_shared(ctx), }; } ``` -### 4. Introducing RNOrientationLockerPackage to ArkTS +### 2.4. Introducing RNOrientationLockerPackage to ArkTS Open the `entry/src/main/ets/RNPackagesFactory.ts` file and add the following code: ```diff ... -+ import { RNOrientationLockerPackage } from '@react-native-ohos/react-native-orientation-locker/ts'; ++ import { RNOrientationLockerPackage } from '@react-native-ohos/react-native-orientation-locker/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ - new SamplePackage(ctx), + new RNOrientationLockerPackage(ctx) ]; } ```
-### Running +### 2.5. Running Click the `sync` button in the upper right corner. @@ -362,20 +333,19 @@ ohpm install Then build and run the code. -## Constraints +## 3. Constraints -### Compatibility +### 3.1. Compatibility -To use this repository, you need to use the correct React-Native and RNOH versions. In addition, you need to use DevEco Studio and the ROM on your phone. - -Verified in the following versions. +This document is verified based on the following versions: 1. RNOH: 0.72.96; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112; 2. RNOH: 0.72.33; SDK: HarmonyOS NEXT B1; IDE: DevEco Studio: 5.0.3.900; ROM: Next.0.0.71; 3. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112; -### Permission Requirements -Due to the fact that this library obtains data from acceleration sensors, corresponding permissions need to be configured when using it. +### 3.2. Permission Requirements + +Due to the fact that this library obtains data from acceleration sensors, corresponding permissions need to be configured when using it. The permissions need to be configured in the entry/src/main directory and added to module.json5 as follows:: ```diff @@ -388,44 +358,43 @@ The permissions need to be configured in the entry/src/main directory and added ] ``` -## API +## 4. API -> [!tip] The **Platform** column indicates the platform where the properties are supported in the original third-party library. +> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. -> [!tip] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. +> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -For details, see [react-native-orientation-locker](https://github.com/wonday/react-native-orientation-locker) +| Name | Description | Type | Required | Platform | HarmonyOS Support | +| -------------- | ---------------------------------------- | ------ | ------------------------ | ---------------- | ----------------- | +| lockToPortrait | Lock the orientation of the application to portrait (portrait) | function | No | IOS/Android | yes | +| lockToLandscape | Lock the orientation of the application to landscape (landscape) | function | No | IOS/Android | yes | +| lockToLandscapeLeft | Lock the orientation of the app to landscape and rotated to the left | function | No | IOS/Android | yes | +| lockToLandscapeRight | Lock the orientation of the app to landscape and rotated to the right | function | No | IOS/Android | yes | +| unlockAllOrientations | Unlocks the orientation of the app, allowing the device to rotate freely | function | No | IOS/Android | yes | +| getOrientation | Get the direction of the current device | callback | No | IOS/Android | yes | +| getDeviceOrientation | Obtains the direction of the current device | callback | No | IOS/Android | yes | -| Name | Description | Type | Required | Platform | HarmonyOS Support | -| --------------------- | ------------------------------------------------------------ | -------- | -------- | ----------- | ----------------- | -| lockToPortrait | Lock the orientation of the application to portrait (portrait) | function | No | iOS/Android| yes | -| lockToLandscape | Lock the orientation of the application to landscape (landscape) | function | No | iOS/Android| yes | -| lockToLandscapeLeft | Lock the orientation of the app to landscape and rotated to the left | function | No | iOS/Android| yes | -| lockToLandscapeRight | Lock the orientation of the app to landscape and rotated to the right | function | No | iOS/Android| yes | -| unlockAllOrientations | Unlocks the orientation of the app, allowing the device to rotate freely | function | No | iOS/Android| yes | -| getOrientation | Get the direction of the current device | callback | No | iOS/Android| yes | -| getDeviceOrientation | Obtains the direction of the current device | callback | No | iOS/Android| yes | +## 5. Events -## Events +> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library. -> [!tip] The **Platform** column indicates the platform where the properties are supported in the original third-party library. +> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. -> [!tip] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android. +| Name | Description | Type | Required | Platform | HarmonyOS Support | +| -------------- | ---------------------------------------- | ------ | -------- | ----------- | ----------------- | +| addOrientationListener | When UI orientation changed, callback function will be called. But if lockToXXX is called , callback function will be not called untill unlockAllOrientations. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT PORTRAIT-UPSIDEDOWN UNKNOWN When lockToXXX/unlockAllOrientations, it will force resend UI orientation changed event.| callback | No | IOS/Android | yes | +| addDeviceOrientationListener | When device orientation changed, callback function will be called. When lockToXXX is called, callback function also can be called. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT PORTRAIT-UPSIDEDOWN UNKNOWN | callback | No | IOS/Android | yes | +| removeOrientationListener | Remove a previously added screen orientation change listener | callback | No | IOS/Android | yes | +| removeDeviceOrientationListener | Remove the event that monitors physical directional changes of the device | callback | No | IOS/Android | yes | +| addLockListener | When call lockToXXX/unlockAllOrientations, callback function will be called. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT UNKNOWN UNKNOWN means not be locked. | callback | No | IOS/Android | yes | +| removeLockListener | Remove the event that monitors changes in screen orientation lock status | callback | No | IOS/Android | yes | +| removeAllListeners | Remove all listening events | callback | No | IOS/Android | yes | -For details, see [react-native-orientation-locker](https://github.com/wonday/react-native-orientation-locker) -| Name | Description | Type | Required | Platform | HarmonyOS Support | -| ------------------------------- | ------------------------------------------------------------ | -------- | -------- | ----------- | ----------------- | -| addOrientationListener | When UI orientation changed, callback function will be called. But if lockToXXX is called , callback function will be not called untill unlockAllOrientations. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT PORTRAIT-UPSIDEDOWN UNKNOWN When lockToXXX/unlockAllOrientations, it will force resend UI orientation changed event. | callback | No | iOS/Android| yes | -| addDeviceOrientationListener | When device orientation changed, callback function will be called. When lockToXXX is called, callback function also can be called. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT PORTRAIT-UPSIDEDOWN UNKNOWN | callback | No | iOS/Android| yes | -| removeOrientationListener | | callback | No | iOS/Android| yes | -| removeDeviceOrientationListener | | callback | No | iOS/Android| yes | -| addLockListener | When call lockToXXX/unlockAllOrientations, callback function will be called. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT UNKNOWN UNKNOWN means not be locked. | callback | No | iOS/Android| yes | -| removeLockListener | | callback | No | iOS/Android| yes | -| removeAllListeners | | callback | No | iOS/Android| yes | +## 6. Known Issues -## Others +## 7. Others -## License +## 8. License This project is licensed under [The MIT License (MIT)](https://github.com/wonday/react-native-orientation-locker/blob/master/LICENSE). diff --git a/zh-cn/react-native-orientation-locker.md b/zh-cn/react-native-orientation-locker.md index 734ad759..335d7954 100644 --- a/zh-cn/react-native-orientation-locker.md +++ b/zh-cn/react-native-orientation-locker.md @@ -1,36 +1,26 @@ -> 模板版本：v0.2.1 +> 模板版本：v0.4.0

react-native-orientation-locker

-

- - Supported platforms - - - License - -

- -> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-orientation-locker) -该第三方库的仓库已迁移至 Gitcode，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/react-native-orientation-locker`，具体版本所属关系如下： +本项目基于 [react-native-orientation-locker](https://github.com/wonday/react-native-orientation-locker) 开发。 -| Version | Package Name | Repository | Release | -| ------------------------------ | --------------------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | -| <= 1.7.0-0.0.7@deprecated | @react-native-oh-tpl/react-native-orientation-locker | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-orientation-locker) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-orientation-locker/releases) | -| > 1.7.0 | @react-native-ohos/react-native-orientation-locker | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | +该第三方库的仓库已迁移至 Gitcode，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/react-native-orientation-locker` 版本所属关系如下： +| 三方库名称 | 三方库版本 | 发布信息 | 支持RN版本 | Autolink | 编译API版本 | 社区基线版本 | npm地址 | +| ------------ | ------------ | ------------------------------ | ------------- | ------------- |------------------------ | ------------- | ------------- | +| @react-native-ohos/react-native-orientation-locker | 1.8.0 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | 0.77 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-orientation-locker) | +| @react-native-ohos/react-native-orientation-locker | 1.7.1 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | 0.72 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-orientation-locker) | +| @react-native-oh-tpl/react-native-orientation-locker | <= 1.7.0-0.0.7@deprecated | [Gitcode Releases](https://github.com/react-native-oh-library/react-native-orientation-locker/releases) | 0.72 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-orientation-locker) | -## 安装与使用 - -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-library/react-native-orientation-locker Releases](https://github.com/react-native-oh-library/react-native-orientation-locker/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 + +## 1. 安装与使用 进入到工程目录并输入以下命令： - -#### npm +#### npm ```bash npm install @react-native-ohos/react-native-orientation-locker @@ -46,7 +36,7 @@ yarn add @react-native-ohos/react-native-orientation-locker 下面的代码展示了这个库的基本使用场景： ->[!WARNING] 使用时 import 的库名不变。 +> [!WARNING] 使用时 import 的库名不变。 ```tsx @@ -214,16 +204,15 @@ const styles = StyleSheet.create({ backgroundColor: 'grey', }, }); - - ``` -## Link +## 2. Link -| | 是否支持autolink | RN框架版本 | -|--------------------------------------|-----------------|------------| -| ~1.7.1 | Yes | 0.72 | -| <= 1.7.0-0.0.7@deprecated | No | 0.72 | +| | 是否支持autolink | RN框架版本 | +|---------------------------|--------------|--------| +| ~1.8.0 | No | 0.77 | +| ~1.7.1 | Yes | 0.72 | +| <= 1.7.0-0.0.7@deprecated | No | 0.72 | 使用AutoLink的工程需要根据该文档配置，Autolink框架指导文档：https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md @@ -231,27 +220,34 @@ const styles = StyleSheet.create({
ManualLink: 此步骤为手动配置原生依赖项的指导 -首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony` +首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony`。 + +此步骤为手动配置原生依赖项的指导。 + +首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony`。 -### 1.在工程根目录的 `oh-package.json5` 添加 overrides 字段 +### 2.1. Overrides RN SDK + +为了让工程依赖同一个版本的 RN SDK，需要在工程根目录的 `oh-package.json5` 添加 overrides 字段，指向工程需要使用的 RN SDK 版本。替换的版本既可以是一个具体的版本号，也可以是一个模糊版本，还可以是本地存在的 HAR 包或源码目录。 + +关于该字段的作用请阅读[官方说明](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/ide-oh-package-json5-V5#zh-cn_topic_0000001792256137_overrides) ```json { - ... "overrides": { - "@rnoh/react-native-openharmony" : "./react_native_openharmony" + "@rnoh/react-native-openharmony": "file:../react_native_openharmony" } } ``` -### 2.引入原生端代码 +### 2.2. 引入原生端代码 目前有两种方法： -1. 通过 har 包引入（在 IDE 完善相关功能后该方法会被遗弃，目前首选此方法）； -2. 直接链接源码。 +- 通过 har 包引入； +- 直接链接源码。 -方法一：通过 har 包引入 +方法一：通过 har 包引入（推荐） > [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。 @@ -261,12 +257,12 @@ const styles = StyleSheet.create({ "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", "@react-native-ohos/react-native-orientation-locker":"file:../../node_modules/@react-native-ohos/react-native-orientation-locker/harmony/orientation_locker.har" - } +} ``` 点击右上角的 `sync` 按钮 -或者在终端执行： +或者在命令行终端执行： ```bash cd entry @@ -277,44 +273,20 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md) -### 3.配置 CMakeLists 和引入 OrientationLockerPackage +### 2.3. 配置 CMakeLists 和引入 OrientationLockerPackage > 若使用的是 <= 1.7.0-0.0.7 版本，请跳过本章。 打开 `entry/src/main/cpp/CMakeLists.txt`，添加： ```diff -project(rnapp) -cmake_minimum_required(VERSION 3.4.1) -set(CMAKE_SKIP_BUILD_RPATH TRUE) -set(RNOH_APP_DIR "${CMAKE_CURRENT_SOURCE_DIR}") -set(NODE_MODULES "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../node_modules") + set(OH_MODULES "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules") -set(RNOH_CPP_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../../react-native-harmony/harmony/cpp") -set(LOG_VERBOSITY_LEVEL 1) -set(CMAKE_ASM_FLAGS "-Wno-error=unused-command-line-argument -Qunused-arguments") -set(CMAKE_CXX_FLAGS "-fstack-protector-strong -Wl,-z,relro,-z,now,-z,noexecstack -s -fPIE -pie") -set(WITH_HITRACE_SYSTRACE 1) # for other CMakeLists.txt files to use -add_compile_definitions(WITH_HITRACE_SYSTRACE) - -add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 -add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-orientation-locker/src/main/cpp" ./orientation_locker) # RNOH_END: manual_package_linking_1 -file(GLOB GENERATED_CPP_FILES "./generated/*.cpp") - -add_library(rnoh_app SHARED - ${GENERATED_CPP_FILES} - "./PackageProvider.cpp" - "${RNOH_CPP_DIR}/RNOHAppNapiBridge.cpp" -) -target_link_libraries(rnoh_app PUBLIC rnoh) - # RNOH_BEGIN: manual_package_linking_2 -target_link_libraries(rnoh_app PUBLIC rnoh_sample_package) + target_link_libraries(rnoh_app PUBLIC rnoh_orientation_locker) # RNOH_END: manual_package_linking_2 ``` @@ -324,7 +296,6 @@ target_link_libraries(rnoh_app PUBLIC rnoh_sample_package) ```diff #include "RNOH/PackageProvider.h" #include "generated/RNOHGeneratedPackage.h" -#include "SamplePackage.h" + #include "OrientationLockerPackage.h" using namespace rnoh; @@ -332,33 +303,32 @@ using namespace rnoh; std::vector> PackageProvider::getPackages(Package::Context ctx) { return { std::make_shared(ctx), - std::make_shared(ctx), + std::make_shared(ctx), }; } ``` -### 4.在 ArkTs 侧引入 RNOrientationLockerPackage +### 2.4. 在 ArkTs 侧引入 RNOrientationLockerPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... -+ import { RNOrientationLockerPackage } from '@react-native-ohos/react-native-orientation-locker/ts'; ++ import { RNOrientationLockerPackage } from '@react-native-ohos/react-native-orientation-locker/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ - new SamplePackage(ctx), + new RNOrientationLockerPackage(ctx) ]; } ```
-### 运行 +### 2.5. 运行 点击右上角的 `sync` 按钮 -或者在终端执行： +或者在命令行终端执行： ```bash cd entry @@ -367,19 +337,18 @@ ohpm install 然后编译、运行即可。 -## 约束与限制 +## 3. 约束与限制 -### 兼容性 +### 3.1. 兼容性 -要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 - -在以下版本验证通过： +本文档内容基于以下版本验证通过： 1. RNOH: 0.72.96; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112; 2. RNOH: 0.72.33; SDK: HarmonyOS NEXT B1; IDE: DevEco Studio: 5.0.3.900; ROM: Next.0.0.71; 3. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.858; ROM: 6.0.0.112; -### 权限要求 +### 3.2. 权限要求 + 由于此库获取加速度传感器的数据，使用时需要配置对应的权限，权限需配置在entry/src/main目录下module.json5 中添加如下权限: ```diff @@ -392,14 +361,12 @@ ohpm install ] ``` -## API +## 4. API > [!TIP] "Platform"列表示该属性在原三方库上支持的平台。 > [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。 -详情请见[react-native-orientation-locker](https://github.com/wonday/react-native-orientation-locker) - | Name | Description | Type | Required | Platform | HarmonyOS Support | | -------------- | ---------------------------------------- | ------ | ------------------------ | ---------------- | ----------------- | | lockToPortrait | Lock the orientation of the application to portrait (portrait) | function | No | IOS/Android | yes | @@ -410,26 +377,28 @@ ohpm install | getOrientation | Get the direction of the current device | callback | No | IOS/Android | yes | | getDeviceOrientation | Obtains the direction of the current device | callback | No | IOS/Android | yes | -## Events +## 5. Events > [!TIP] "Platform"列表示该属性在原三方库上支持的平台。 > [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。 -详情请见[react-native-orientation-locker](https://github.com/wonday/react-native-orientation-locker) | Name | Description | Type | Required | Platform | HarmonyOS Support | | -------------- | ---------------------------------------- | ------ | -------- | ----------- | ----------------- | | addOrientationListener | When UI orientation changed, callback function will be called. But if lockToXXX is called , callback function will be not called untill unlockAllOrientations. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT PORTRAIT-UPSIDEDOWN UNKNOWN When lockToXXX/unlockAllOrientations, it will force resend UI orientation changed event.| callback | No | IOS/Android | yes | | addDeviceOrientationListener | When device orientation changed, callback function will be called. When lockToXXX is called, callback function also can be called. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT PORTRAIT-UPSIDEDOWN UNKNOWN | callback | No | IOS/Android | yes | -| removeOrientationListener | | callback | No | IOS/Android | yes | -| removeDeviceOrientationListener | | callback | No | IOS/Android | yes | +| removeOrientationListener | Remove a previously added screen orientation change listener | callback | No | IOS/Android | yes | +| removeDeviceOrientationListener | Remove the event that monitors physical directional changes of the device | callback | No | IOS/Android | yes | | addLockListener | When call lockToXXX/unlockAllOrientations, callback function will be called. It can return either PORTRAIT LANDSCAPE-LEFT LANDSCAPE-RIGHT UNKNOWN UNKNOWN means not be locked. | callback | No | IOS/Android | yes | -| removeLockListener | | callback | No | IOS/Android | yes | -| removeAllListeners | | callback | No | IOS/Android | yes | +| removeLockListener | Remove the event that monitors changes in screen orientation lock status | callback | No | IOS/Android | yes | +| removeAllListeners | Remove all listening events | callback | No | IOS/Android | yes | + + +## 6. 遗留问题 -## 其他 +## 7. 其他 -## 开源协议 +## 8. 开源协议 -本项目基于 [The MIT License (MIT)](https://github.com/wonday/react-native-orientation-locker/blob/master/LICENSE) ，请自由地享受和参与开源。 \ No newline at end of file +本项目基于 [The MIT License (MIT)](https://github.com/wonday/react-native-orientation-locker/blob/master/LICENSE) ，请自由地享受和参与开源。 -- Gitee From 91ad65947f00304d834920ececd7fb6227792a2e Mon Sep 17 00:00:00 2001 From: liang_tao001 Date: Mon, 26 Jan 2026 09:38:16 +0800 Subject: [PATCH 2/2] =?UTF-8?q?docs:=20=E4=BF=AE=E6=94=B9react-native-orie?= =?UTF-8?q?ntation-locker=E5=BA=93=E7=9A=84=E4=BD=BF=E7=94=A8=E6=96=87?= =?UTF-8?q?=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: liang_tao001 --- en/react-native-orientation-locker.md | 6 +++--- zh-cn/react-native-orientation-locker.md | 4 ---- 2 files changed, 3 insertions(+), 7 deletions(-) diff --git a/en/react-native-orientation-locker.md b/en/react-native-orientation-locker.md index 283a378a..8f8dba5b 100644 --- a/en/react-native-orientation-locker.md +++ b/en/react-native-orientation-locker.md @@ -9,9 +9,9 @@ This project is based on [react-native-orientation-locker](https://github.com/wo This third-party library has been migrated to Gitcode and is now available for direct download from npm, the new package name is：`@react-native-ohos/react-native-orientation-locker` The version correspondence details are as follows： | Name | Version | Release Information | Supported RN Version | Supported Autolink | Compile API Version | Community Baseline Version | npm Address | | ------------ | ------------ | ------------------------------ | ------------- | ------------- |------------------------ | ------------- | ------------- | -| @react-native-ohos/react-native-orientation-locker | 1.8.0 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | 0.77 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-orientation-locker) | -| @react-native-ohos/react-native-orientation-locker | 1.7.1 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | 0.72 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-orientation-locker) | -| @react-native-oh-tpl/react-native-orientation-locker | <= 1.7.0-0.0.7@deprecated | [Gitcode Releases](https://github.com/react-native-oh-library/react-native-orientation-locker/releases) | 0.72 | 否 | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-orientation-locker) | +| @react-native-ohos/react-native-orientation-locker | 1.8.0 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | 0.77 | No | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-orientation-locker) | +| @react-native-ohos/react-native-orientation-locker | 1.7.1 | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-orientation-locker/releases) | 0.72 | No | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-ohos/react-native-orientation-locker) | +| @react-native-oh-tpl/react-native-orientation-locker | <= 1.7.0-0.0.7@deprecated | [Gitcode Releases](https://github.com/react-native-oh-library/react-native-orientation-locker/releases) | 0.72 | No | API12+ | 1.7.0 | [Npm Address](https://www.npmjs.com/package/@react-native-oh-tpl/react-native-orientation-locker) | ## 1. Installation and Usage diff --git a/zh-cn/react-native-orientation-locker.md b/zh-cn/react-native-orientation-locker.md index 335d7954..5d1f4d30 100644 --- a/zh-cn/react-native-orientation-locker.md +++ b/zh-cn/react-native-orientation-locker.md @@ -222,10 +222,6 @@ const styles = StyleSheet.create({ 首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony`。 -此步骤为手动配置原生依赖项的指导。 - -首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony`。 - ### 2.1. Overrides RN SDK 为了让工程依赖同一个版本的 RN SDK，需要在工程根目录的 `oh-package.json5` 添加 overrides 字段，指向工程需要使用的 RN SDK 版本。替换的版本既可以是一个具体的版本号，也可以是一个模糊版本，还可以是本地存在的 HAR 包或源码目录。 -- Gitee