diff --git a/en/react-native-community-slider.md b/en/react-native-community-slider.md index f4a81f99792391ea817e7850ae1f3841e973e64d..bbcef89697d576e6add6a341abc6fcc1d5e9947e 100644 --- a/en/react-native-community-slider.md +++ b/en/react-native-community-slider.md @@ -14,14 +14,17 @@ > [!TIP] [GitHub address](https://github.com/react-native-oh-library/react-native-slider) -| Library Version | Release Information | Supported RN Version | -| ---------- | ------------------------------------------------------------ | ---------- | -| 4.4.3 | [@react-native-oh-tpl/slider Releases](https://github.com/react-native-oh-library/react-native-slider/releases) | 0.72 | -| 5.0.1 | [@react-native-ohos/slider Releases]() | 0.77 | +## Installation and Usage -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. +Please refer to the Releases page of the third-party library for the corresponding version information -## Installation and Usage +| Third-party Library Version | Release Information | Supported RN Version | +|-----------------------------| ------------------------------------------------------------ | ---------- | +| <= 4.4.3-0.3.4@deprecated | [@react-native-oh-tpl/slider Releases(deprecated)](https://github.com/react-native-oh-library/react-native-slider/releases) | 0.72 | +| 4.4.4 | [@react-native-ohos/slider Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-slider/releases) | 0.72 | +| 5.0.1 | [@react-native-ohos/slider Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-slider/releases) | 0.77 | + +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. Go to the project directory and execute the following instruction: @@ -30,18 +33,12 @@ Go to the project directory and execute the following instruction: #### **npm** ```bash -# 0.72 -npm install @react-native-oh-tpl/slider -# 0.77 npm install @react-native-ohos/slider ``` #### **yarn** ```bash -# 0.72 -yarn add @react-native-oh-tpl/slider -# 0.77 yarn add @react-native-ohos/slider ``` @@ -51,7 +48,7 @@ The following code shows the basic use scenario of the repository: > [!WARNING] The name of the imported repository remains unchanged. -> [!TIP] 使用thumbImage属性时请确保引入的图片路径地址正确,可检查harmony/entry/src/main/resources/rawfile/assets目录下是否被打包至静态资源目录,如若不存在则图片放置文件目录不对 +> [!TIP] When using the thumbImage attribute, please ensure that the imported image path is correct. You can check whether the image has been packaged into the static resource directory under the path harmony/entry/src/main/resources/rawfile/assets. If it does not exist, the file directory where the image is placed is incorrect. ```js import Slider from "@react-native-community/slider" @@ -74,7 +71,9 @@ export default function SliderExample() { ## Link -Currently, HarmonyOS does not support AutoLink. Therefore, you need to manually configure the linking. +Version >= @react-native-ohos/slider@4.4.4 now supports Autolink without requiring manual configuration, currently only supports 72 frameworks. Autolink Framework Guide Documentation: https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +This step provides guidance for manually configuring native dependencies. Open the `harmony` directory of the HarmonyOS project in DevEco Studio. @@ -100,18 +99,6 @@ Method 1 (recommended): Use the HAR file. Open `entry/oh-package.json5` file and add the following dependencies: -* 0.72 - -```json -"dependencies": { - "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - - "@react-native-oh-tpl/slider": "file:../../node_modules/@react-native-oh-tpl/slider/harmony/slider.har" - } -``` - -* 0.77 - ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -135,6 +122,8 @@ Method 2: Directly link to the source code. ### 3. Configuring CMakeLists and Introducing SliderPackge +> If you are using version <= 4.4.3-0.3.4, please skip this chapter. + Open `entry/src/main/cpp/CMakeLists.txt` and add the following code: ```diff @@ -148,9 +137,6 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: add_package_subdirectories add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -# 0.72 -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/slider/src/main/cpp" ./slider) -# 0.77 + add_subdirectory("${OH_MODULES}/@react-native-ohos/slider/src/main/cpp" ./slider) # RNOH_END: add_package_subdirectories @@ -190,9 +176,6 @@ Find `function buildCustomRNComponent()`, which is usually located in `entry/src ```diff ... - # 0.72 -+ import { RNCSlider, SLIDER_TYPE } from "@react-native-oh-tpl/slider" - # 0.77 + import { RNCSlider, SLIDER_TYPE } from "@react-native-ohos/slider" @Builder @@ -239,10 +222,13 @@ Then build and run the code. ### Compatibility -This document is verified based on the following versions: +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 successfully in the following versions: -1. RNOH:0.72.33; SDK:OpenHarmony 5.0.0.71(API Version 12 Release); IDE:DevEco Studio 5.0.3.900; ROM:NEXT.0.0.71; -2. RNOH:0.77.18; SDK:HarmonyOS 6.0.0 Release SDK; IDE:DevEco Studio 6.0.0.868; ROM:6.0.0.112; +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; ## Properties diff --git a/en/react-native-pager-view.md b/en/react-native-pager-view.md index 9f8ba6d44e5673cdce2ba90abea8078a864304f7..23f05ac3bf99214435507aa1ae8546a286910d3d 100644 --- a/en/react-native-pager-view.md +++ b/en/react-native-pager-view.md @@ -16,24 +16,30 @@ ## Installation and Usage -Find the matching version information in the release address of a third-party library: [@react-native-oh-tpl/react-native-pager-view Releases](https://github.com/react-native-oh-library/react-native-pager-view/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. +Please refer to the Releases page of the third-party library for the corresponding version information -Go to the project directory and execute the following instruction: +| Third-party Library Version | Release Information | Supported RN Version | +|-----------------------------| ------------------------------------------------------------ | ---------- | +| <= 6.2.4@deprecated | [@react-native-oh-tpl/react-native-pager-view Releases(deprecated)](https://github.com/react-native-oh-library/react-native-pager-view/releases) | 0.72 | +| 6.2.5 | [@react-native-ohos/react-native-pager-view Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-pager-view/releases) | 0.72 | +| 6.7.2 | [@react-native-ohos/react-native-pager-view Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-pager-view/releases) | 0.77 | +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. +Go to the project directory and execute the following instruction: #### **npm** ```bash -npm install @react-native-oh-tpl/react-native-pager-view +npm install @react-native-ohos/react-native-pager-view ``` #### **yarn** ```bash -yarn add @react-native-oh-tpl/react-native-pager-view +yarn add @react-native-ohos/react-native-pager-view ``` @@ -69,11 +75,14 @@ const styles = StyleSheet.create({ ## Link -Currently, HarmonyOS does not support AutoLink. Therefore, you need to manually configure the linking. +Version >= @react-native-ohos/react-native-pager-view@6.2.5 now supports Autolink without requiring manual configuration, currently only supports 72 frameworks. Autolink Framework Guide Documentation: https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +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 + ```json { ... @@ -87,7 +96,6 @@ Open the `harmony` directory of the HarmonyOS project in DevEco Studio. Currently, two methods are available: - 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. @@ -98,7 +106,7 @@ Open `entry/oh-package.json5` file and add the following dependencies: "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - "@react-native-oh-tpl/react-native-pager-view": "file:../../node_modules/@react-native-oh-tpl/react-native-pager-view/harmony/pager_view.har" + "@react-native-ohos/react-native-pager-view": "file:../../node_modules/@react-native-ohos/react-native-pager-view/harmony/pager_view.har" } ``` @@ -117,6 +125,8 @@ Method 2: Directly link to the source code. ### 3. Configuring CMakeLists and Introducing ViewPagerPackage +> If you are using version <= 6.2.4, please skip this chapter. + Open `entry/src/main/cpp/CMakeLists.txt` and add the following code: ```diff @@ -137,7 +147,7 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: add_package_subdirectories add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-pager-view/src/main/cpp" ./pager_view) ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-pager-view/src/main/cpp" ./pager_view) # RNOH_END: add_package_subdirectories add_library(rnoh_app SHARED @@ -176,7 +186,7 @@ Open the `entry/src/main/ets/RNPackagesFactory.ts` file and add the following co ```diff ... -+ import { ViewPagerPackage } from '@react-native-oh-tpl/react-native-pager-view/ts'; ++ import { ViewPagerPackage } from '@react-native-ohos/react-native-pager-view/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ @@ -207,7 +217,11 @@ Then build and run the code. 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. -Check the release version information in the release address of the third-party library:[@react-native-oh-tpl/react-native-pager-view Releases](https://github.com/react-native-oh-library/react-native-pager-view/releases) +Verified successfully in 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; ## Properties diff --git a/en/react-native-reanimated.md b/en/react-native-reanimated.md index 0a2af8ff2d35f50739d56cca1ca3d652d791c51b..cb659bd54a3fab07ceb8ca9208dd5ecf0109ec18 100644 --- a/en/react-native-reanimated.md +++ b/en/react-native-reanimated.md @@ -12,22 +12,21 @@

-> [!Tip] [Github address](https://github.com/react-native-oh-library/react-native-harmony-reanimated/tree/sig) - -The repository of this third-party library has been migrated to Gitcode and supports direct download from npm. The new package name is: @react-native-ohos/react-native-reanimated. The specific version ownership relationship is as follows: - -| Version | Package Name | Repository | Release | Support RN version | -| ---------- | ------------------------------------------------------------ | ---------- | ---------- | ---------- | -| 3.6.0 | @react-native-oh-tpl/react-native-reanimated | [Github](https://github.com/react-native-oh-library/react-native-harmony-reanimated)|[Github Releases](https://github.com/react-native-oh-library/react-native-harmony-reanimated/releases)|0.72 | -| 3.18.0 | @react-native-ohos/react-native-reanimated | [Gitcode](https://gitcode.com/openharmony-sig/rntpc_react-native-reanimated/tree/br_rnoh0.77) |[Gitcode Releases]() | 0.77 | - +> [!Tip] [Github address](https://github.com/react-native-oh-library/react-native-harmony-reanimated) ## Installation and Usage +Please refer to the Releases page of the third-party library for the corresponding version information -Go to the project directory and execute the following instruction: +| Third-party Library Version | Release Information | Supported RN Version | +|-----------------------------| ------------------------------------------------------------ | ---------- | +| <= 3.6.4@deprecated | [@react-native-oh-tpl/react-native-reanimated Releases(deprecated)](https://github.com/react-native-oh-library/react-native-harmony-reanimated/releases) | 0.72 | +| 3.6.5 | [@react-native-ohos/react-native-reanimated Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-reanimated/releases) | 0.72 | +| 3.18.1 | [@react-native-ohos/react-native-reanimated Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-reanimated/releases) | 0.77 | +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. +Go to the project directory and execute the following instruction: @@ -36,7 +35,7 @@ Go to the project directory and execute the following instruction: ```bash # 0.72 npm install react-native-reanimated@3.6.0 -npm install @react-native-oh-tpl/react-native-reanimated +npm install @react-native-ohos/react-native-reanimated # 0.77 npm install react-native-reanimated@3.18.0 @@ -48,7 +47,7 @@ npm install @react-native-ohos/react-native-reanimated ```bash # 0.72 yarn add react-native-reanimated@3.6.0 -yarn add @react-native-oh-tpl/react-native-reanimated +yarn add @react-native-ohos/react-native-reanimated # 0.77 yarn add react-native-reanimated@3.18.0 @@ -123,7 +122,9 @@ export default function App() { ## Link -Currently, HarmonyOS does not support AutoLink. Therefore, you need to manually configure the linking. +Version >= @react-native-ohos/react-native-reanimated@3.6.5 now supports Autolink without requiring manual configuration, currently only supports 72 frameworks. Autolink Framework Guide Documentation: https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +This step provides guidance for manually configuring native dependencies. Open the `harmony` directory of the HarmonyOS project in DevEco Studio. @@ -142,25 +143,12 @@ Open the `harmony` directory of the HarmonyOS project in DevEco Studio. Currently, two methods are available: - 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. Open `entry/oh-package.json5` file and add the following dependencies: -- 0.72 - -```json -"dependencies": { - "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - - "@react-native-oh-tpl/react-native-reanimated": "file:../../node_modules/@react-native-oh-tpl/react-native-reanimated/harmony/reanimated.har" - } -``` - -- 0.77 - ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -184,6 +172,8 @@ For details, see [Directly Linking Source Code](/en/link-source-code.md). ### 3. Configuring CMakeLists and Introducing ReanimatedPackage +> If you are using version <= 3.6.4, please skip this chapter. + Open `entry/src/main/cpp/CMakeLists.txt` and add the following code: ```diff @@ -198,10 +188,7 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_END: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -# 0.72 -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-reanimated/src/main/cpp" ./reanimated) -# 0.77 + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-reanimated/src/main/cpp" ./reanimated) # RNOH_END: manual_package_linking_1 @@ -242,10 +229,6 @@ Open`entry/src/main/ets/RNPackagesFactory.ts` file and add the following code: ```diff ... -// 0.72 -+ import { ReanimatedPackage} from '@react-native-oh-tpl/react-native-reanimated/ts'; - -// 0.77 + import { ReanimatedPackage} from '@react-native-ohos/react-native-reanimated/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { @@ -273,11 +256,13 @@ Then build and run the code. ### 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. -The content of this document has been verified based on the following version: +Verified successfully in the following versions: -1、RNOH: 0.72.38; SDK: HarmonyOS-5.0.0(API12); IDE: DevEco Studio 5.1.1.830; ROM: 6.0.0.112 SP12; -2、RNOH: 0.77.18; SDK: HarmonyOS-5.1.1.208(API19); IDE: DevEco Studio 5.1.1.830; ROM: 6.0.0.112 SP12; +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; ## API diff --git a/en/react-native-safe-area-context.md b/en/react-native-safe-area-context.md index b1088569caca6fae916a65e018bddd6138880156..4bcfa193bf9a593eb8aea269e47ded53428f9b35 100644 --- a/en/react-native-safe-area-context.md +++ b/en/react-native-safe-area-context.md @@ -12,40 +12,33 @@

-> [!TIP] [Github Address](https://gitcode.com/openharmony-sig/rntpc_react-native-safe-area-context) +> [!TIP] [Github Address](https://github.com/react-native-oh-library/react-native-safe-area-context) -The repository for this third-party library has been migrated to Gitcode, and it now supports direct download from npm. The new package name is: `@react-native-ohos/react-native-safe-area-context`. The specific version relationships are as follows: +## Installation and Usage -| Version | Package Name | Repository | Release |Supported RN Version | -| ------------------------------ | ---------------- | ------------------- | ------------------- | -------------------- | -| 4.7.4 | @react-native-oh-tpl/react-native-safe-area-context | [Github](https://github.com/react-native-oh-library/react-native-safe-area-context) | [Github Releases](https://github.com/react-native-oh-library/react-native-safe-area-context/releases) | 0.72 | -| 5.1.1 | @react-native-ohos/react-native-safe-area-context | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-safe-area-context) | [GitCode Releases]() | 0.77 | +Please refer to the Releases page of the third-party library for the corresponding version information -## Installation and Usage +| Third-party Library Version | Release Information | Supported RN Version | +|-----------------------------| ------------------------------------------------------------ | ---------- | +| <= 4.7.4-0.2.1@deprecated | [@react-native-oh-tpl/react-native-safe-area-context Releases(deprecated)](https://github.com/react-native-oh-library/react-native-safe-area-context/releases) | 0.72 | +| 4.7.5 | [@react-native-ohos/react-native-safe-area-context Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-safe-area-context/releases) | 0.72 | +| 5.1.1 | [@react-native-ohos/react-native-safe-area-context Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-safe-area-context/releases) | 0.77 | -For older versions not published to npm, please refer to the [Installation Guide](/en/tgz-usage.md) to install the tgz package. +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. -Navigate to your project directory and enter the following commands: +Go to the project directory and execute the following instruction: #### **npm** ```bash -# V4.7.4 -npm install @react-native-oh-tpl/react-native-safe-area-context - -# V5.1.1 npm install @react-native-ohos/react-native-safe-area-context ``` #### **yarn** ```bash -# V4.7.4 -yarn add @react-native-oh-tpl/react-native-safe-area-context - -# V5.1.1 yarn add @react-native-ohos/react-native-safe-area-context ``` @@ -81,9 +74,11 @@ export default App; ## Link -Currently, HarmonyOS does not support AutoLink, so the Link step requires manual configuration. +Version >= @react-native-ohos/react-native-safe-area-context@4.7.5 now supports Autolink without requiring manual configuration, currently only supports 72 frameworks. Autolink Framework Guide Documentation: https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +This step provides guidance for manually configuring native dependencies. -First, you need to open the HarmonyOS project `harmony` within your project using DevEco Studio. +Open the `harmony` directory of the HarmonyOS project in DevEco Studio. ### 1. Add the overrides field to the root `oh-package.json5` of the project @@ -109,18 +104,6 @@ Method 1: Import via har package Open `entry/oh-package.json5` and add the following dependencies: -- V4.7.4 - -```json -"dependencies": { - "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - - "@react-native-oh-tpl/react-native-safe-area-context": "file:../../node_modules/@react-native-oh-tpl/react-native-safe-area-context/harmony/safe_area.har" - } -``` - -- V5.1.1 - ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -144,6 +127,8 @@ Method 2: Link Source Code Directly ### 3. Configure CMakeLists and Import SafeAreaViewPackage +> If you are using version <= 4.7.4-0.2.1, please skip this chapter. + Open `entry/src/main/cpp/CMakeLists.txt` and add: ```diff @@ -165,10 +150,6 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -# V4.7.4 -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-safe-area-context/src/main/cpp" ./safe-area) - -# V5.1.1 + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-safe-area-context/src/main/cpp" ./safe-area) # RNOH_END: manual_package_linking_1 @@ -213,10 +194,6 @@ Open `entry/src/main/ets/RNPackagesFactory.ts` and add: ```diff ... -// V4.7.4 -+ import {SafeAreaViewPackage} from '@react-native-oh-tpl/react-native-safe-area-context/ts'; - -// V5.1.1 + import {SafeAreaViewPackage} from '@react-native-ohos/react-native-safe-area-context/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { @@ -242,12 +219,13 @@ Then compile and run. ## Compatibility -To use this library, you need to use the correct React-Native and RNOH versions. Additionally, you need to use the matching DevEco Studio and phone ROM. +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. -This document is verified based on the following versions: -1. RNOH:0.72.96; SDK:HarmonyOS 5.1.1 Release SDK; IDE:DevEco Studio 5.1.1.840; ROM:6.0.0; -2. RNOH:0.77.18; SDK:HarmonyOS 5.1.1 Release SDK; IDE:DevEco Studio 5.1.1.840; ROM:6.0.0; +Verified successfully in 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; ## Props diff --git a/en/react-native-text-gradient.md b/en/react-native-text-gradient.md index fce166e198b1be644ee774620092a810fa89decc..f5b5788b166bdc8cd2c8856c4283202104cfe794 100644 --- a/en/react-native-text-gradient.md +++ b/en/react-native-text-gradient.md @@ -14,15 +14,17 @@ > [!TIP] [Github address](https://github.com/react-native-oh-library/react-native-text-gradient) -| Version | Package Name | Repository | Release | Support RN version | -| ------- | ------------ | ----------- |----------|--------------------| -| 0.1.7 | @react-native-oh-tpl/react-native-text-gradient |[GitHub ](https://github.com/react-native-oh-library/react-native-text-gradient)| [GitHub Release ](https://github.com/react-native-oh-library/react-native-text-gradient/releases)| 0.72 | -| 0.2.0 | @react-native-ohos/react-native-text-gradient | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient) | [GitCode Release](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient/releases)| 0.77 | +## Installation and Usage +Please refer to the Releases page of the third-party library for the corresponding version information -## Installation and Usage +| Third-party Library Version | Release Information | Supported RN Version | +|-----------------------------| ------------------------------------------------------------ | ---------- | +| <= 0.1.7-0.0.4@deprecated | [@react-native-oh-tpl/react-native-text-gradient Releases(deprecated)](https://github.com/react-native-oh-library/react-native-text-gradient/releases) | 0.72 | +| 0.1.8 | [@react-native-ohos/react-native-text-gradient Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient/releases) | 0.72 | +| 0.2.0 | [@react-native-ohos/react-native-text-gradient Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient/releases) | 0.77 | -Please go to the corresponding Release release address of the third-party library to view the version information of the Release package: +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. Go to the project directory and execute the following instruction: @@ -31,20 +33,12 @@ Go to the project directory and execute the following instruction: #### **npm** ```bash -# 0.72 -npm install @react-native-oh-tpl/react-native-text-gradient - -# 0.77 npm install @react-native-ohos/react-native-text-gradient ``` #### **yarn** ```bash -# 0.72 -yarn install @react-native-oh-tpl/react-native-text-gradient - -# 0.77 yarn install @react-native-ohos/react-native-text-gradient ``` @@ -102,7 +96,9 @@ const styles = StyleSheet.create({ ## Link -Currently, HarmonyOS does not support AutoLink. Therefore, you need to manually configure the linking. +Version >= @react-native-ohos/react-native-text-gradient@0.1.8 now supports Autolink without requiring manual configuration, currently only supports 72 frameworks. Autolink Framework Guide Documentation: https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +This step provides guidance for manually configuring native dependencies. Open the `harmony` directory of the HarmonyOS project in DevEco Studio. @@ -121,20 +117,11 @@ Open the `harmony` directory of the HarmonyOS project in DevEco Studio. Currently, two methods are available: - 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. Open `entry/oh-package.json5` file and add the following dependencies: -- V0.72 -```json -"dependencies": { - "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - "@react-native-oh-tpl/react-native-text-gradient": "file:../../node_modules/@react-native-oh-tpl/react-native-text-gradient/harmony/text_gradient.har" - } -``` -- V0.77 ```json "dependencies": { @@ -159,6 +146,8 @@ Method 2: Directly link to the source code. ### 3. Configuring CMakeLists and Introducing LinearTextGradientPackge +> If you are using version <= 0.1.7-0.0.4, please skip this chapter. + Open `entry/src/main/cpp/CMakeLists.txt` and add the following code: ```diff @@ -179,10 +168,7 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -# V0.72 -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-text-gradient/src/main/cpp" ./text_gradient) -# V0.77 + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-text-gradient/src/main/cpp" ./text_gradient) # RNOH_END: manual_package_linking_1 @@ -226,9 +212,6 @@ Open the `entry/src/main/ets/RNPackagesFactory.ts` file and add the following co ```diff ... -// V0.72 -+ import {LinearTextGradientPackage} from '@react-native-oh-tpl/react-native-text-gradient/ts'; -// V0.77 + import {LinearTextGradientPackage} from '@react-native-ohos/react-native-text-gradient/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ @@ -255,14 +238,13 @@ Then build and run the code. ### 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. -Please go to the corresponding Release release address of the third-party library to view the version information of the Release package: - -1. RNOH: 0.72.33; SDK: Openharmony 5.0.0.71(API Version 12 Release); IDE: DevEco Studio: 5.0.3.900; ROM: Next.0.0.71; -2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12; +Verified successfully in 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; ## Properties diff --git a/zh-cn/react-native-community-slider.md b/zh-cn/react-native-community-slider.md index 1646235ea57c810bdbf6040aa3031da3ecfadf1b..a0569d87743058bf6848122b42b19e91630edba6 100644 --- a/zh-cn/react-native-community-slider.md +++ b/zh-cn/react-native-community-slider.md @@ -14,17 +14,18 @@ > [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-slider) +## 安装与使用 + 请到三方库的 Releases 发布地址查看配套的版本信息: -| 三方库版本 | 发布信息 | 支持RN版本 | -| ---------- | ------------------------------------------------------------ | ---------- | -| 4.4.3 | [@react-native-oh-tpl/slider Releases](https://github.com/react-native-oh-library/react-native-slider/releases) | 0.72 | -| 5.0.1 | [@react-native-ohos/slider Releases]() | 0.77 | +| 三方库版本 | 发布信息 | 支持RN版本 | +|---------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------| ---------- | +| <= 4.4.3-0.3.4@deprecated | [@react-native-oh-tpl/slider Releases(deprecated)](https://github.com/react-native-oh-library/react-native-slider/releases) | 0.72 | +| 4.4.4 | [@react-native-ohos/slider Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-slider/releases) | 0.72 | +| 5.0.1 | [@react-native-ohos/slider Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-slider/releases) | 0.77 | 对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 -## 安装与使用 - 进入到工程目录并输入以下命令: @@ -32,18 +33,12 @@ #### **npm** ```bash -# 0.72 -npm install @react-native-oh-tpl/slider -# 0.77 npm install @react-native-ohos/slider ``` #### **yarn** ```bash -# 0.72 -yarn add @react-native-oh-tpl/slider -# 0.77 yarn add @react-native-ohos/slider ``` @@ -77,7 +72,9 @@ export default function SliderExample() { ## Link -目前 HarmonyOS 暂不支持 AutoLink,所以 Link 步骤需要手动配置。 +Version >= @react-native-ohos/slider@4.4.4,已支持 Autolink,无需手动配置,目前只支持72框架。 Autolink框架指导文档:https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +此步骤为手动配置原生依赖项的指导。 首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony` @@ -90,7 +87,6 @@ export default function SliderExample() { "@rnoh/react-native-openharmony" : "./react_native_openharmony" } } - ``` ### 2.引入原生端代码 @@ -106,18 +102,6 @@ export default function SliderExample() { 打开 `entry/oh-package.json5`,添加以下依赖 -* 0.72 - -```json -"dependencies": { - "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - - "@react-native-oh-tpl/slider": "file:../../node_modules/@react-native-oh-tpl/slider/harmony/slider.har" - } -``` - -* 0.77 - ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -141,6 +125,8 @@ ohpm install ### 3.配置 CMakeLists 和引入 SliderPackge +> 若使用的是 <= 4.4.3-0.3.4 版本,请跳过本章 + 打开 `entry/src/main/cpp/CMakeLists.txt`,添加: ```diff @@ -154,9 +140,6 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: add_package_subdirectories add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -# 0.72 -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/slider/src/main/cpp" ./slider) -# 0.77 + add_subdirectory("${OH_MODULES}/@react-native-ohos/slider/src/main/cpp" ./slider) # RNOH_END: add_package_subdirectories @@ -196,9 +179,6 @@ std::vector> PackageProvider::getPackages(Package::Cont ```diff ... - # 0.72 -+ import { RNCSlider, SLIDER_TYPE } from "@react-native-oh-tpl/slider" - # 0.77 + import { RNCSlider, SLIDER_TYPE } from "@react-native-ohos/slider" @Builder @@ -242,10 +222,13 @@ ohpm install ## 兼容性 -本文档内容基于以下版本验证通过: +要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。 + +在以下版本验证通过: -1. RNOH:0.72.33; SDK:OpenHarmony 5.0.0.71(API Version 12 Release); IDE:DevEco Studio 5.0.3.900; ROM:NEXT.0.0.71; -2. RNOH:0.77.18; SDK:HarmonyOS 6.0.0 Release SDK; IDE:DevEco Studio 6.0.0.868; ROM:6.0.0.112; +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; ## 属性 diff --git a/zh-cn/react-native-pager-view.md b/zh-cn/react-native-pager-view.md index 96607fa8c6b3b10ee2924997914d28280ba91049..154a80daf8f62655920e548845b078dbb49e44bd 100644 --- a/zh-cn/react-native-pager-view.md +++ b/zh-cn/react-native-pager-view.md @@ -16,7 +16,15 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-pager-view Releases](https://github.com/react-native-oh-library/react-native-pager-view/releases) 。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息: + +| 三方库版本 | 发布信息 | 支持RN版本 | +|---------------------|-------------------------------------------------------------------------------------------------------------------------------------------------| ---------- | +| <= 6.2.4@deprecated | [@react-native-oh-tpl/react-native-pager-view Releases(deprecated)](https://github.com/react-native-oh-library/react-native-pager-view/releases) | 0.72 | +| 6.2.5 | [@react-native-ohos/react-native-pager-view Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-pager-view/releases) | 0.72 | +| 6.7.2 | [@react-native-ohos/react-native-pager-view Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-pager-view/releases) | 0.77 | + +对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令: @@ -25,13 +33,13 @@ #### **npm** ```bash -npm install @react-native-oh-tpl/react-native-pager-view +npm install @react-native-ohos/react-native-pager-view ``` #### **yarn** ```bash -yarn add @react-native-oh-tpl/react-native-pager-view +yarn add @react-native-ohos/react-native-pager-view ``` @@ -67,7 +75,9 @@ const styles = StyleSheet.create({ ## Link -目前 HarmonyOS 暂不支持 AutoLink,所以 Link 步骤需要手动配置。 +Version >= @react-native-ohos/react-native-pager-view@6.2.5,已支持 Autolink,无需手动配置,目前只支持72框架。 Autolink框架指导文档:https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +此步骤为手动配置原生依赖项的指导。 首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony` @@ -98,7 +108,7 @@ const styles = StyleSheet.create({ "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - "@react-native-oh-tpl/react-native-pager-view": "file:../../node_modules/@react-native-oh-tpl/react-native-pager-view/harmony/pager_view.har" + "@react-native-ohos/react-native-pager-view": "file:../../node_modules/@react-native-ohos/react-native-pager-view/harmony/pager_view.har" } ``` @@ -117,6 +127,8 @@ ohpm install ### 3.配置 CMakeLists 和引入 ViewPagerPackage +> 若使用的是 <= 6.2.4 版本,请跳过本章 + 打开 `entry/src/main/cpp/CMakeLists.txt`,添加: ```diff @@ -137,7 +149,7 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: add_package_subdirectories add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-pager-view/src/main/cpp" ./pager_view) ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-pager-view/src/main/cpp" ./pager_view) # RNOH_END: add_package_subdirectories add_library(rnoh_app SHARED @@ -176,7 +188,7 @@ std::vector> PackageProvider::getPackages(Package::Cont ```diff ... -+ import { ViewPagerPackage } from '@react-native-oh-tpl/react-native-pager-view/ts'; ++ import { ViewPagerPackage } from '@react-native-ohos/react-native-pager-view/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ @@ -207,7 +219,11 @@ ohpm install 要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息:[@react-native-oh-tpl/react-native-pager-view Releases](https://github.com/react-native-oh-library/react-native-pager-view/releases) +在以下版本验证通过: + +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; ## 属性 diff --git a/zh-cn/react-native-reanimated.md b/zh-cn/react-native-reanimated.md index 19b3c861ce0285bcf172496aa44ab96c69bbcc70..cc260301e2e61c940b34f8217bfdb25175a7e4be 100644 --- a/zh-cn/react-native-reanimated.md +++ b/zh-cn/react-native-reanimated.md @@ -12,18 +12,19 @@

-> [!Tip] [Github 地址](https://github.com/react-native-oh-library/react-native-harmony-reanimated/tree/sig) +> [!Tip] [Github 地址](https://github.com/react-native-oh-library/react-native-harmony-reanimated) +## 安装与使用 -该第三方库的仓库已迁移至 Gitcode,且支持直接从 npm 下载,新的包名为:@react-native-ohos/react-native-reanimated,具体版本所属关系如下: - +请到三方库的 Releases 发布地址查看配套的版本信息: -| 三方库版本 | 包名 | 仓库地址 | 发布(Release) | 支持RN版本 | -| ---------- | ------------------------------------------------------------ | ---------- | ---------- | ---------- | -| 3.6.0 | @react-native-oh-tpl/react-native-reanimated | [Github](https://github.com/react-native-oh-library/react-native-harmony-reanimated)|[Github Releases](https://github.com/react-native-oh-library/react-native-harmony-reanimated/releases)|0.72 | -| 3.18.0 | @react-native-ohos/react-native-reanimated | [Gitcode](https://gitcode.com/openharmony-sig/rntpc_react-native-reanimated/tree/br_rnoh0.77) |[Gitcode Releases]() | 0.77 | +| 三方库版本 | 发布信息 | 支持RN版本 | +|-------|-------------------------------------------------------------------------------------------------------------------------------------------------| ---------- | +| <= 3.6.4@deprecated | [@react-native-oh-tpl/react-native-reanimated Releases(deprecated)](https://github.com/react-native-oh-library/react-native-harmony-reanimated/releases) | 0.72 | +| 3.6.5 | [@react-native-ohos/react-native-reanimated Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-reanimated/releases) | 0.72 | +| 3.18.1 | [@react-native-ohos/react-native-reanimated Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-reanimated/releases) | 0.77 | -## 安装与使用 +对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令: @@ -34,7 +35,7 @@ ```bash # 0.72 npm install react-native-reanimated@3.6.0 -npm install @react-native-oh-tpl/react-native-reanimated +npm install @react-native-ohos/react-native-reanimated # 0.77 npm install react-native-reanimated@3.18.0 @@ -46,7 +47,7 @@ npm install @react-native-ohos/react-native-reanimated ```bash # 0.72 yarn add react-native-reanimated@3.6.0 -yarn add @react-native-oh-tpl/react-native-reanimated +yarn add @react-native-ohos/react-native-reanimated # 0.77 yarn add react-native-reanimated@3.18.0 @@ -121,7 +122,9 @@ export default function App() { ## Link -目前 HarmonyOS 暂不支持 AutoLink,所以 Link 步骤需要手动配置。 +Version >= @react-native-ohos/react-native-reanimated@3.6.5,已支持 Autolink,无需手动配置,目前只支持72框架。 Autolink框架指导文档:https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +此步骤为手动配置原生依赖项的指导。 首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony` @@ -149,18 +152,6 @@ export default function App() { 打开 `entry/oh-package.json5`,添加以下依赖 -- 0.72 - -```json -"dependencies": { - "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - - "@react-native-oh-tpl/react-native-reanimated": "file:../../node_modules/@react-native-oh-tpl/react-native-reanimated/harmony/reanimated.har" - } -``` - -- 0.77 - ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -184,6 +175,8 @@ ohpm install ### 3.配置 CMakeLists 和引入 ReanimatedPackage +> 若使用的是 <= 3.6.4 版本,请跳过本章 + 打开 `entry/src/main/cpp/CMakeLists.txt`,添加: ```diff @@ -198,10 +191,7 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_END: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -# 0.72 -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-reanimated/src/main/cpp" ./reanimated) -# 0.77 + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-reanimated/src/main/cpp" ./reanimated) # RNOH_END: manual_package_linking_1 @@ -242,10 +232,6 @@ std::vector> PackageProvider::getPackages(Package::Cont ```diff ... -// 0.72 -+ import { ReanimatedPackage} from '@react-native-oh-tpl/react-native-reanimated/ts'; - -// 0.77 + import { ReanimatedPackage} from '@react-native-ohos/react-native-reanimated/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { @@ -273,10 +259,13 @@ ohpm install ### 兼容性 -本文档内容基于以下版本验证通过: +要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。 + +在以下版本验证通过: -1、RNOH: 0.72.38; SDK: HarmonyOS-5.0.0(API12); IDE: DevEco Studio 5.1.1.830; ROM: 6.0.0.112 SP12; -2、RNOH: 0.77.18; SDK: HarmonyOS-5.1.1.208(API19); IDE: DevEco Studio 5.1.1.830; ROM: 6.0.0.112 SP12; +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; ## API diff --git a/zh-cn/react-native-safe-area-context.md b/zh-cn/react-native-safe-area-context.md index 4998f1bd24af4d72679361e6da2c9ee39d22ec9d..453c22efb015e22988687cd3e742fbb63ccacbed 100644 --- a/zh-cn/react-native-safe-area-context.md +++ b/zh-cn/react-native-safe-area-context.md @@ -12,16 +12,17 @@

-> [!TIP] [Github 地址](https://gitcode.com/openharmony-sig/rntpc_react-native-safe-area-context) +> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-safe-area-context) -该第三方库的仓库已迁移至 Gitcode,且支持直接从 npm 下载,新的包名为:`@react-native-ohos/react-native-safe-area-context`,具体版本所属关系如下: +## 安装与使用 -| Version | Package Name | Repository | Release |Supported RN Version | -| ------------------------------ | ---------------- | ------------------- | ------------------- | -------------------- | -| 4.7.4 | @react-native-oh-tpl/react-native-safe-area-context | [Github](https://github.com/react-native-oh-library/react-native-safe-area-context) | [Github Releases](https://github.com/react-native-oh-library/react-native-safe-area-context/releases) | 0.72 | -| 5.1.1 | @react-native-ohos/react-native-safe-area-context | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-safe-area-context) | [GitCode Releases]() | 0.77 | +请到三方库的 Releases 发布地址查看配套的版本信息: -## 安装与使用 +| 三方库版本 | 发布信息 | 支持RN版本 | +|-------|-------------------------------------------------------------------------------------------------------------------------------------------------| ---------- | +| <= 4.7.4-0.2.1@deprecated | [@react-native-oh-tpl/react-native-safe-area-context Releases(deprecated)](https://github.com/react-native-oh-library/react-native-safe-area-context/releases) | 0.72 | +| 4.7.5 | [@react-native-ohos/react-native-safe-area-context Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-safe-area-context/releases) | 0.72 | +| 5.1.1 | [@react-native-ohos/react-native-safe-area-context Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-safe-area-context/releases) | 0.77 | 对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 @@ -32,20 +33,12 @@ #### **npm** ```bash -# V4.7.4 -npm install @react-native-oh-tpl/react-native-safe-area-context - -# V5.1.1 npm install @react-native-ohos/react-native-safe-area-context ``` #### **yarn** ```bash -# V4.7.4 -yarn add @react-native-oh-tpl/react-native-safe-area-context - -# V5.1.1 yarn add @react-native-ohos/react-native-safe-area-context ``` @@ -81,7 +74,9 @@ export default App; ## Link -目前 HarmonyOS 暂不支持 AutoLink,所以 Link 步骤需要手动配置。 +Version >= @react-native-ohos/react-native-safe-area-context@4.7.5,已支持 Autolink,无需手动配置,目前只支持72框架。 Autolink框架指导文档:https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +此步骤为手动配置原生依赖项的指导。 首先需要使用 DevEco Studio 打开项目里的 HarmonyOS 工程 `harmony` @@ -109,18 +104,6 @@ export default App; 打开 `entry/oh-package.json5`,添加以下依赖 -- V4.7.4 - -```json -"dependencies": { - "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - - "@react-native-oh-tpl/react-native-safe-area-context": "file:../../node_modules/@react-native-oh-tpl/react-native-safe-area-context/harmony/safe_area.har" - } -``` - -- V5.1.1 - ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -144,6 +127,8 @@ ohpm install ### 3.配置 CMakeLists 和引入 SafeAreaViewPackage +> 若使用的是 <= 4.7.4-0.2.1 版本,请跳过本章 + 打开 `entry/src/main/cpp/CMakeLists.txt`,添加: ```diff @@ -165,10 +150,6 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -# V4.7.4 -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-safe-area-context/src/main/cpp" ./safe-area) - -# V5.1.1 + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-safe-area-context/src/main/cpp" ./safe-area) # RNOH_END: manual_package_linking_1 @@ -213,10 +194,6 @@ std::vector> PackageProvider::getPackages(Package::Cont ```diff ... -// V4.7.4 -+ import {SafeAreaViewPackage} from '@react-native-oh-tpl/react-native-safe-area-context/ts'; - -// V5.1.1 + import {SafeAreaViewPackage} from '@react-native-ohos/react-native-safe-area-context/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { @@ -246,8 +223,9 @@ ohpm install 在以下版本验证通过: -1. RNOH:0.72.96; SDK:HarmonyOS 5.1.1 Release SDK; IDE:DevEco Studio 5.1.1.840; ROM:6.0.0; -2. RNOH:0.77.18; SDK:HarmonyOS 5.1.1 Release SDK; IDE:DevEco Studio 5.1.1.840; ROM:6.0.0; +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; ## 属性 diff --git a/zh-cn/react-native-text-gradient.md b/zh-cn/react-native-text-gradient.md index 7cff4c4c181595e8f1effea4adea29c3690d4778..ead2436087e82956bbcbb4d4236640ab3a941da6 100644 --- a/zh-cn/react-native-text-gradient.md +++ b/zh-cn/react-native-text-gradient.md @@ -14,15 +14,18 @@ > [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-text-gradient) -| 三方库版本 | 包 名 | 仓库地址 | 发布信息 | 支持RN版本 | -| -------- | -------- | --------- |---------|----------| -| 0.1.7 | @react-native-oh-tpl/react-native-text-gradient |[GitHub ](https://github.com/react-native-oh-library/react-native-text-gradient)| [GitHub Release ](https://github.com/react-native-oh-library/react-native-text-gradient/releases)| 0.72 | -| 0.2.0 | @react-native-ohos/react-native-text-gradient | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient) | [GitCode Release](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient/releases)| 0.77 | - ## 安装与使用 请到三方库的 Releases 发布地址查看配套的版本信息: +| 三方库版本 | 发布信息 | 支持RN版本 | +|---------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------| ---------- | +| <= 0.1.7-0.0.4@deprecated | [@react-native-oh-tpl/react-native-text-gradient Releases(deprecated)](https://github.com/react-native-oh-library/react-native-text-gradient/releases) | 0.72 | +| 0.1.8 | [@react-native-ohos/react-native-text-gradient Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient/releases) | 0.72 | +| 0.2.0 | [@react-native-ohos/react-native-text-gradient Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient/releases) | 0.77 | + +对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 + 进入到工程目录并输入以下命令: @@ -30,20 +33,12 @@ #### **npm** ```bash -# 0.72 -npm install @react-native-oh-tpl/react-native-text-gradient - -# 0.77 npm install @react-native-ohos/react-native-text-gradient ``` #### **yarn** ```bash -# 0.72 -yarn install @react-native-oh-tpl/react-native-text-gradient - -# 0.77 yarn install @react-native-ohos/react-native-text-gradient ``` @@ -101,7 +96,9 @@ const styles = StyleSheet.create({ ## Link -目前HarmonyOS暂不支持 AutoLink,所以 Link 步骤需要手动配置。 +Version >= @react-native-ohos/react-native-text-gradient@0.1.8,已支持 Autolink,无需手动配置,目前只支持72框架。 Autolink框架指导文档:https://gitcode.com/openharmony-sig/ohos_react_native/blob/master/docs/zh-cn/Autolinking.md + +此步骤为手动配置原生依赖项的指导。 首先需要使用 DevEco Studio 打开项目里的HarmonyOS工程 `harmony` @@ -129,15 +126,6 @@ const styles = StyleSheet.create({ 打开 `entry/oh-package.json5`,添加以下依赖 -- V0.72 -```json -"dependencies": { - "@rnoh/react-native-openharmony": "file:../react_native_openharmony", - "@react-native-oh-tpl/react-native-text-gradient": "file:../../node_modules/@react-native-oh-tpl/react-native-text-gradient/harmony/text_gradient.har" - } -``` -- V0.77 - ```json "dependencies": { ... @@ -161,6 +149,8 @@ ohpm install ### 3.配置 CMakeLists 和引入 LinearTextGradientPackge +> 若使用的是 <= 0.1.7-0.0.4 版本,请跳过本章 + 打开 `entry/src/main/cpp/CMakeLists.txt`,添加: ```diff @@ -181,10 +171,7 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) -# V0.72 -+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-text-gradient/src/main/cpp" ./text_gradient) -# V0.77 + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-text-gradient/src/main/cpp" ./text_gradient) # RNOH_END: manual_package_linking_1 @@ -228,9 +215,6 @@ std::vector> PackageProvider::getPackages(Package::Cont ```diff ... -// V0.72 -+ import {LinearTextGradientPackage} from '@react-native-oh-tpl/react-native-text-gradient/ts'; -// V0.77 + import {LinearTextGradientPackage} from '@react-native-ohos/react-native-text-gradient/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { @@ -258,15 +242,13 @@ ohpm install ### 兼容性 - 要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库的 Releases 发布地址查看配套的版本信息: - -1. RNOH: 0.72.33; SDK: Openharmony 5.0.0.71(API Version 12 Release); IDE: DevEco Studio: 5.0.3.900; ROM: Next.0.0.71; -2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12; +在以下版本验证通过: -对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +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; ## 属性