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