diff --git a/zh-cn/openspacelabs-react-native-zoomable-view.md b/zh-cn/openspacelabs-react-native-zoomable-view.md index c1c2f26b2d3d6d05ebfaa77841611208efa4e716..5b82da880990edf4e48870fbdd47c0d3dc692458 100644 --- a/zh-cn/openspacelabs-react-native-zoomable-view.md +++ b/zh-cn/openspacelabs-react-native-zoomable-view.md @@ -24,13 +24,13 @@ #### **npm** ```bash -npm install @openspacelabs/react-native-zoomable-view@2.1.6 +npm install @openspacelabs/react-native-zoomable-view@2.4.2 ``` #### **yarn** ```bash -yarn add @openspacelabs/react-native-zoomable-view@2.1.6 +yarn add @openspacelabs/react-native-zoomable-view@2.4.2 ``` @@ -135,49 +135,55 @@ const styles = StyleSheet.create({ > [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。 -| Name | Type | Description | Required | Platform | HarmonyOS Support | -| -------------------------------- | -------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------- | -------- | ----------------- | -| zoomEnabled | boolean | Can be used to enable or disable the zooming dynamically | no | All | yes | -| panEnabled | boolean | Can be used to enable or disable the panning dynamically | no | All | yes | -| initialZoom | number | Initial zoom level on startup | no | All | yes | -| maxZoom | number | Maximum possible zoom level (zoom in). Can be set to`null` to allow unlimited zooming | no | All | yes | -| minZoom | number | Minimum possible zoom level (zoom out) | no | All | yes | -| disablePanOnInitialZoom | boolean | If true, panning is disabled when zoom level is equal to the initial zoom level | no | All | yes | -| doubleTapDelay | number | How much delay will still be recognized as double press (ms) | no | All | yes | -| doubleTapZoomToCenter | boolean | If true, double tapping will always zoom to center of View instead of the direction it was double tapped in | no | All | yes | -| bindToBorders | boolean | If true, it makes sure the object stays within box borders | no | All | yes | -| zoomStep | number | How much zoom should be applied on double tap | no | All | yes | -| pinchToZoomInSensitivity | number | the level of resistance (sensitivity) to zoom in (0 - 10) - higher is less sensitive | no | All | yes | -| pinchToZoomOutSensitivity | number | the level of resistance (sensitivity) to zoom out (0 - 10) - higher is less sensitive | no | All | yes | -| movementSensibility | number | how resistant should shifting the view around be? (0.5 - 5) - higher is less sensitive | no | All | yes | -| initialOffsetX | number | The horizontal offset the image should start at | no | All | yes | -| initialOffsetY | number | The vertical offset the image should start at | no | All | yes | -| contentHeight | number | Specify if you want to treat the height of the**centered** content inside the zoom subject as the zoom subject's height | no | All | yes | -| contentWidth | number | Specify if you want to treat the width of the**centered** content inside the zoom subject as the zoom subject's width | no | All | yes | -| panBoundaryPadding | number | At certain scales, the edge of the content is bounded too close to the edge of the container, making it difficult to pan to and interact with the edge of the content. To fix this, we'd wanna allow the content to pan just a little further away from the container's edge. Hence, the "pan boundary padding", measured in pixels. | no | All | yes | -| longPressDuration | number | Duration in ms until a press is considered a long press | no | All | yes | -| visualTouchFeedbackEnabled | boolean | Whether to show a touch feedback circle on touch | no | All | yes | -| onTransform | function | Will be called when the transformation configuration (zoom level and offset) changes | no | All | yes | -| onDoubleTapBefore | function | Will be called, at the start of a double tap | no | All | yes | -| onDoubleTapAfter | function | Will be called at the end of a double tap | no | All | yes | -| onShiftingBefore | function | Will be called, when user taps and moves the view, but before our view movement work kicks in (so this is the place to interrupt movement, if you need to) | no | All | yes | -| onShiftingAfter | function | Will be called, when user taps and moves the view, but after the values have changed already | no | All | yes | -| onShiftingEnd | function | Will be called, when user stops a tap and move gesture | no | All | yes | -| onZoomBefore | function | Will be called, while the user pinches the screen, but before our zoom work kicks in (so this is the place to interrupt zooming, if you need to) | no | All | yes | -| onZoomAfter | function | Will be called, while the user pinches the screen, but after the values have changed already | no | All | yes | -| onZoomEnd | function | Will be called after pinchzooming has ended | no | All | yes | -| onLongPress | function | Will be called after the user pressed on the image for a while | no | All | yes | -| onStartShouldSetPanResponder | function | Determines whether the view group responds to touch events when a finger is pressed. | no | All | yes | -| onPanResponderGrant | function | The gesture has started | no | All | yes | -| onPanResponderEnd | function | Will be called when gesture ends (more accurately, on pan responder "release") | no | All | yes | -| onPanResponderTerminate | function | Will be called when the gesture is force-interrupted by another handler | no | All | yes | -| onPanResponderTerminationRequest | function | Callback asking whether the gesture should be interrupted by another handler | no | IOS | yes | -| onPanResponderMove | function | Will be called when user moves while touching | no | All | yes | -| onShouldBlockNativeResponder | function | Returns whether this component should block native components from becoming the JS responder | no | All | yes | -| zoomTo | function | Changes the zoom level to a specific number | no | All | yes | -| zoomBy | function | Changes the zoom level relative to the current level (use positive numbers to zoom in, negative numbers to zoom out) | no | All | yes | -| moveTo | function | Shifts the zoomed part to a specific point (in px relative to x: 0, y: 0) | no | All | yes | -| moveBy | function | Shifts the zoomed part by a specific pixel number | no | All | yes | +| Name | Type | Description | Required | Platform | HarmonyOS Support | +| -------------------------------- | ------------------------- | ------------------------------------------------------------ | -------- | -------- | ----------------- | +| zoomEnabled | boolean | Can be used to enable or disable the zooming dynamically | no | All | yes | +| panEnabled | boolean | Can be used to enable or disable the panning dynamically | no | All | yes | +| initialZoom | number | Initial zoom level on startup | no | All | yes | +| maxZoom | number | Maximum possible zoom level (zoom in). Can be set to`null` to allow unlimited zooming | no | All | yes | +| minZoom | number | Minimum possible zoom level (zoom out) | no | All | yes | +| disablePanOnInitialZoom | boolean | If true, panning is disabled when zoom level is equal to the initial zoom level | no | All | yes | +| doubleTapDelay | number | How much delay will still be recognized as double press (ms) | no | All | yes | +| doubleTapZoomToCenter | boolean | If true, double tapping will always zoom to center of View instead of the direction it was double tapped in | no | All | yes | +| bindToBorders | boolean | If true, it makes sure the object stays within box borders | no | All | yes | +| zoomStep | number | How much zoom should be applied on double tap | no | All | yes | +| pinchToZoomInSensitivity | number | the level of resistance (sensitivity) to zoom in (0 - 10) - higher is less sensitive | no | All | yes | +| pinchToZoomOutSensitivity | number | the level of resistance (sensitivity) to zoom out (0 - 10) - higher is less sensitive | no | All | yes | +| movementSensibility | number | how resistant should shifting the view around be? (0.5 - 5) - higher is less sensitive | no | All | yes | +| initialOffsetX | number | The horizontal offset the image should start at | no | All | yes | +| initialOffsetY | number | The vertical offset the image should start at | no | All | yes | +| contentHeight | number | Specify if you want to treat the height of the**centered** content inside the zoom subject as the zoom subject's height | no | All | yes | +| contentWidth | number | Specify if you want to treat the width of the**centered** content inside the zoom subject as the zoom subject's width | no | All | yes | +| panBoundaryPadding | number | At certain scales, the edge of the content is bounded too close to the edge of the container, making it difficult to pan to and interact with the edge of the content. To fix this, we'd wanna allow the content to pan just a little further away from the container's edge. Hence, the "pan boundary padding", measured in pixels. | no | All | yes | +| longPressDuration | number | Duration in ms until a press is considered a long press | no | All | yes | +| visualTouchFeedbackEnabled | boolean | Whether to show a touch feedback circle on touch | no | All | yes | +| onTransform | function | Will be called when the transformation configuration (zoom level and offset) changes | no | All | yes | +| onDoubleTapBefore | function | Will be called, at the start of a double tap | no | All | yes | +| onDoubleTapAfter | function | Will be called at the end of a double tap | no | All | yes | +| onShiftingBefore | function | Will be called, when user taps and moves the view, but before our view movement work kicks in (so this is the place to interrupt movement, if you need to) | no | All | yes | +| onShiftingAfter | function | Will be called, when user taps and moves the view, but after the values have changed already | no | All | yes | +| onShiftingEnd | function | Will be called, when user stops a tap and move gesture | no | All | yes | +| onZoomBefore | function | Will be called, while the user pinches the screen, but before our zoom work kicks in (so this is the place to interrupt zooming, if you need to) | no | All | yes | +| onZoomAfter | function | Will be called, while the user pinches the screen, but after the values have changed already | no | All | yes | +| onZoomEnd | function | Will be called after pinchzooming has ended | no | All | yes | +| onLongPress | function | Will be called after the user pressed on the image for a while | no | All | yes | +| onLayout | function | Like View's onLayout, but different in that it syncs with this component's internal state and returns a fake sythentic event | no | All | yes | +| onStartShouldSetPanResponder | function | Determines whether the view group responds to touch events when a finger is pressed. | no | All | yes | +| onPanResponderGrant | function | The gesture has started | no | All | yes | +| onPanResponderEnd | function | Will be called when gesture ends (more accurately, on pan responder "release") | no | All | yes | +| onPanResponderTerminate | function | Will be called when the gesture is force-interrupted by another handler | no | All | yes | +| onPanResponderTerminationRequest | function | Callback asking whether the gesture should be interrupted by another handler | no | IOS | yes | +| onPanResponderMove | function | Will be called when user moves while touching | no | All | yes | +| onShouldBlockNativeResponder | function | Returns whether this component should block native components from becoming the JS responder | no | All | yes | +| zoomTo | function | Changes the zoom level to a specific number | no | All | yes | +| zoomBy | function | Changes the zoom level relative to the current level (use positive numbers to zoom in, negative numbers to zoom out) | no | All | yes | +| moveTo | function | Shifts the zoomed part to a specific point (in px relative to x: 0, y: 0) | no | All | yes | +| moveBy | function | Shifts the zoomed part by a specific pixel number | no | All | yes | +| staticPinPosition | Vec2D | Where in the viewport to put the pin | no | All | yes | +| staticPinIcon | Element | The pin icon itself | no | All | yes | +| onStaticPinPositionChange | (position: Vec2D) => void | Callback every time the pin is at rest | no | All | yes | +| onStaticPinPositionMove | (position: Vec2D) => void | Callback live while the pin is moving | no | All | yes | +| animatePin | boolean | Whether to make the pin bounce up and down while dragging | no | All | yes | ## 遗留问题 diff --git a/zh-cn/react-native-autoheight-webview.md b/zh-cn/react-native-autoheight-webview.md index 771bdcbc9cec6a29223eefc6e906bd01a4556246..d3b08a0d6309c108a6fbd01150310c5776c533c4 100644 --- a/zh-cn/react-native-autoheight-webview.md +++ b/zh-cn/react-native-autoheight-webview.md @@ -16,8 +16,13 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-autoheight-webview Releases](https://github.com/react-native-oh-library/react-native-autoheight-webview/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.6.5 | [@react-native-oh-tpl/react-native-autoheight-webview Releases](https://github.com/react-native-oh-library/react-native-autoheight-webview/releases) | 0.72 | +| 1.6.6 | [@react-native-ohos/react-native-autoheight-webview Releases]() | 0.77 | +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,13 +30,21 @@ #### **npm** ```bash +# V1.6.5 npm install @react-native-oh-tpl/react-native-autoheight-webview + +# V1.6.6 +npm install @react-native-ohos/react-native-autoheight-webview ``` #### **yarn** ```bash +# V1.6.5 yarn add @react-native-oh-tpl/react-native-autoheight-webview + +# V1.6.6 +yarn add @react-native-ohos/react-native-autoheight-webview ``` @@ -85,7 +98,11 @@ export function WebviewExample() { 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[ @react-native-oh-tpl/react-native-autoheight-webview Releases](https://github.com/react-native-oh-library/react-native-autoheight-webview/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.6.5 | [@react-native-oh-tpl/react-native-autoheight-webview Releases](https://github.com/react-native-oh-library/react-native-autoheight-webview/releases) | 0.72 | +| 1.6.6 | [@react-native-ohos/react-native-autoheight-webview Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-better-banner.md b/zh-cn/react-native-better-banner.md index f07b19a88ca5423d13ffba9b0a2cbc8d03c93ab2..c51727fec05b91c23e1754fdad3560fc5208f800 100644 --- a/zh-cn/react-native-better-banner.md +++ b/zh-cn/react-native-better-banner.md @@ -16,7 +16,12 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-better-banner Releases](https://github.com/react-native-oh-library/better-banner/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.1.3 | [@react-native-oh-tpl/react-native-better-banner Releases](https://github.com/react-native-oh-library/react-native-material-buttons/releases) | 0.72 | +| 1.1.4 | [@react-native-ohos/react-native-better-banner Releases]() | 0.77 | 进入到工程目录并输入以下命令： @@ -26,13 +31,19 @@ #### **npm** ```bash +#v1.1.3 npm install @react-native-oh-tpl/react-native-better-banner +#v1.1.4 +npm install @react-native-ohos/react-native-better-banner ``` #### **yarn** ```bash +#1.1.3 yarn add @react-native-oh-tpl/react-native-better-banner +#1.1.4 +yarn add @react-native-ohos/react-native-better-banner ``` @@ -112,7 +123,12 @@ export default App; 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-better-banner Releases](https://github.com/react-native-oh-library/better-banner/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.1.3 | [@react-native-oh-tpl/react-native-better-banner Releases](https://github.com/react-native-oh-library/react-native-material-buttons/releases) | 0.72 | +| 1.1.4 | [@react-native-ohos/react-native-better-banner Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-calendar-events.md b/zh-cn/react-native-calendar-events.md index 069692d03af5e6598e02f9e3220cf33462d83754..5c508db1b55edeaeab326346c25e216ea6c99fe5 100644 --- a/zh-cn/react-native-calendar-events.md +++ b/zh-cn/react-native-calendar-events.md @@ -16,7 +16,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-calendar-events Releases](https://github.com/react-native-oh-library/react-native-calendar-events/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 2.2.0 | [@react-native-oh-tpl/react-native-calendar-events Releases](https://github.com/react-native-oh-library/react-native-calendar-events/releases) | 0.72 | +| 2.2.1 | [@react-native-ohos/react-native-calendar-events Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,12 +32,20 @@ #### **npm** ```bash +#2.2.0 npm install @react-native-oh-tpl/react-native-calendar-events + +#2.2.1 +npm install @react-native-ohos/react-native-calendar-events ``` #### **yarn** ```bash +#2.2.0 +yarn add @react-native-oh-tpl/react-native-calendar-events + +#2.2.1 yarn add @react-native-oh-tpl/react-native-calendar-events ``` @@ -233,6 +248,8 @@ export default CalendarDemo; ## 使用 Codegen +> [!TIP] V2.2.1 不需要执行 Codegen。 + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](https://gitee.com/react-native-oh-library/usage-docs/blob/master/zh-cn/codegen.md)。 ## Link @@ -265,6 +282,8 @@ export default CalendarDemo; 打开 `entry/oh-package.json5`，添加以下依赖 +- V2.2.0 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -272,6 +291,15 @@ export default CalendarDemo; } ``` +- V2.2.1 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-calendar-events": "file:../../node_modules/@react-native-ohos/react-native-calendar-events/harmony/calendar_events.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -285,14 +313,18 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md) -### 3.在 ArkTs 侧引入 CalendarEventPackage +### 3.在 ArkTs 侧引入 CalendarEventsPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... +//2.2.0 + import { CalendarEventPackage } from "@react-native-oh-tpl/react-native-calendar-events/ts" +//2.2.1 ++ import { CalendarEventPackage } from "@react-native-ohos/react-native-calendar-events/ts" + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -301,7 +333,69 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 4.配置 CMakeLists 和引入 SqliteStoragePackage + +> [!TIP] V2.2.1 需要执行 + +打开 `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-calendar-events/src/main/cpp" ./calendar_events) + +# 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_sqlite_storage) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +```diff +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "CalendarEventsPackage.h" + +using namespace rnoh; + +std::vector> PackageProvider::getPackages(Package::Context ctx) { + return { + std::make_shared(ctx), + std::make_shared(ctx), ++ std::make_shared(ctx), + }; +} +``` + +### 5.运行 点击右上角的 `sync` 按钮 diff --git a/zh-cn/react-native-cardview.md b/zh-cn/react-native-cardview.md index e5c3e8d924c294acde31cf4ecadfa51540bdb9e8..a8e0d113a1298e4e818347b6f8a8697f548e9543 100644 --- a/zh-cn/react-native-cardview.md +++ b/zh-cn/react-native-cardview.md @@ -16,20 +16,35 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-cardview Releases](https://github.com/react-native-oh-library/react-native-cardview/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 2.0.3 | [@react-native-oh-tpl/react-native-cardview Releases](https://github.com/react-native-oh-library/react-native-cardview/releases) | 0.72 | +| 2.0.4 | [@react-native-ohos/react-native-cardviewReleases]() | 0.77 | + + 对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： #### **npm** ```bash +#2.0.3 npm install @react-native-oh-tpl/react-native-cardview + +#2.0.4 +npm install @react-native-ohos/react-native-cardview ``` #### **yarn** ```bash +#2.0.3 yarn add @react-native-oh-tpl/react-native-cardview + +#2.0.4 +yarn add @react-native-ohos/react-native-cardview ``` @@ -137,6 +152,8 @@ const styles = StyleSheet.create({ 打开 `entry/oh-package.json5`，添加以下依赖 +- V2.0.3 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -144,6 +161,15 @@ const styles = StyleSheet.create({ } ``` +- V2.0.4 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-cardview": "file:../../node_modules/@react-native-ohos/react-native-cardview/harmony/card_view.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -179,7 +205,12 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) +# 2.0.3 + add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-cardview/src/main/cpp" ./card-view) + +# 2.0.4 ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-cardview/src/main/cpp" ./card-view) + # RNOH_END: manual_package_linking_1 file(GLOB GENERATED_CPP_FILES "./generated/*.cpp") @@ -235,7 +266,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[react-native-oh-tpl/react-native-cardview Releases](https://github.com/react-native-oh-library/react-native-cardview/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 2.0.3 | [@react-native-oh-tpl/react-native-cardview Releases](https://github.com/react-native-oh-library/react-native-cardview/releases) | 0.72 | +| 2.0.4 | [@react-native-ohos/react-native-cardviewReleases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-community-push-notification-ios.md b/zh-cn/react-native-community-push-notification-ios.md index 60cd6858d6d0d79a070ac8c807247a9d2a40a8d5..6c721a25906f8953b0ad1699876dec2e9f74fc36 100644 --- a/zh-cn/react-native-community-push-notification-ios.md +++ b/zh-cn/react-native-community-push-notification-ios.md @@ -8,10 +8,13 @@ 该第三方库的仓库已迁移至 Gitee，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/push-notification-ios`，具体版本所属关系如下： -| Version | Package Name | Repository | Release | -|----------------------------| ------------------------------------------------- | ------------------ | -------------------------- | -| <= 1.11.0-0.1.3@deprecated | @react-native-oh-tpl/push-notification-ios | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-push-notification-ios) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-push-notification-ios/releases) | -| > 1.11.0 | @react-native-ohos/push-notification-ios | [GitCode](https://gitcode.com/openharmony-sig/rntpc_ios) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_ios/releases) | +| Version | Package Name | Repository | Release | Version for RN | +| ------------------------- | ------------------------------------------------- | ------------------ | -------------------------- | ------------------------- | +| <= 1.11.0-0.1.3@deprecated | @react-native-oh-tpl/push-notification-ios | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-push-notification-ios) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-push-notification-ios/releases)| 0.72 | +| > 1.11.0 | @react-native-ohos/push-notification-ios | [GitCode](https://gitcode.com/openharmony-sig/rntpc_ios) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_ios/releases) | 0.72 | +| > 1.11.0 | @react-native-ohos/push-notification-ios | [GitCode](https://gitcode.com/openharmony-sig/rntpc_ios) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_ios/releases) | 0.77 | + + ## 1. 安装与使用 @@ -22,12 +25,20 @@ #### **npm** ```bash +#<= v1.11.0-0.1.3 +npm install @react-native-oh-tpl/push-notification-ios + +#> v1.11.0 npm install @react-native-ohos/push-notification-ios ``` #### **yarn** ```bash +#<= v1.11.0-0.1.3 +yarn add @react-native-oh-tpl/push-notification-ios + +#> v1.11.0 yarn add @react-native-ohos/push-notification-ios ``` @@ -195,7 +206,13 @@ export const App = () => { > [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。 打开 `entry/oh-package.json5`，添加以下依赖 - +- <= V1.11.0-0.1.3 +```json +"dependencies": { + "@react-native-ohos/push-notification-ios": "file:../../node_modules/@react-native-oh-tpl/push-notification-ios/harmony/push_notification.har" + } +``` +- \> V1.11.0 ```json "dependencies": { "@react-native-ohos/push-notification-ios": "file:../../node_modules/@react-native-ohos/push-notification-ios/harmony/push_notification.har" @@ -223,6 +240,10 @@ ohpm install + set(OH_MODULES "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules") # RNOH_BEGIN: manual_package_linking_1 +# <= V1.11.0-0.1.3 ++ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/push-notification-ios/src/main/cpp" ./push_notification) + +# > V1.11.0 + add_subdirectory("${OH_MODULES}/@react-native-ohos/push-notification-ios/src/main/cpp" ./push_notification) # RNOH_END: manual_package_linking_1 @@ -254,6 +275,10 @@ std::vector> PackageProvider::getPackages(Package::Cont ```diff ... + //<= V1.11.0-0.1.3 ++ import { PushNotificationPackage } from '@react-native-oh-tpl/push-notification-ios/ts'; + + //> V1.11.0 + import { PushNotificationPackage } from '@react-native-ohos/push-notification-ios/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { @@ -270,6 +295,10 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { ```diff ... +//<= V1.11.0-0.1.3 ++ import { PushNotificationModule } from '@react-native-oh-tpl/push-notification-ios/ts'; + +//> V1.11.0 + import { PushNotificationModule } from '@react-native-ohos/push-notification-ios/ts'; ... onNewWant(want: Want, _launchParam: AbilityConstant.LaunchParam): void { @@ -294,7 +323,13 @@ ohpm install ### 3.1. 兼容性 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-ohos/push-notification-ios Releases](https://gitee.com/openharmony-sig/rntpc_ios/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| Version | Package Name | Repository | Release | Version for RN | +| ------------------------- | ------------------------------------------------- | ------------------ | -------------------------- | ------------------------- | +| <= 1.11.0-0.1.3@deprecated | @react-native-oh-tpl/push-notification-ios | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-push-notification-ios) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-push-notification-ios/releases)| 0.72 | +| > 1.11.0 | @react-native-ohos/push-notification-ios | [GitCode](https://gitcode.com/openharmony-sig/rntpc_ios) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_ios/releases) | 0.72 | +| > 1.11.0 | @react-native-ohos/push-notification-ios | [GitCode](https://gitcode.com/openharmony-sig/rntpc_ios) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_ios/releases) | 0.77 | + ## 4. API diff --git a/zh-cn/react-native-cookies-cookies.md b/zh-cn/react-native-cookies-cookies.md index 01a23afc00b03cee746054f8a4e6a31df137b81d..7a26696d2e4375748629e702c2cd03e80f3dd08c 100644 --- a/zh-cn/react-native-cookies-cookies.md +++ b/zh-cn/react-native-cookies-cookies.md @@ -16,7 +16,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/cookies Releases](https://github.com/react-native-oh-library/react-native-cookies/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 6.2.1 | [@react-native-oh-tpl/cookies Releases](https://github.com/react-native-oh-library/react-native-cookies/releases) | 0.72 | +| 6.2.2 | [@react-native-ohos/react-native-exception-handler Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,18 +32,26 @@ #### **npm** ```bash +# V6.2.1 npm install @react-native-oh-tpl/cookies + +# V6.2.2 +npm install @react-native-ohos/cookies ``` #### **yarn** -``` +```bash +# V6.2.1 yarn add @react-native-oh-tpl/cookies + +# V6.2.2 +yarn add @react-native-ohos/cookies ``` -HarmonyOS 中使用 react-native-cookies 需要配合 react-native-webview 使用，具体请参考[@react-native-oh-tpl/react-native-webview](/zh-cn/react-native-webview.md) +HarmonyOS 中使用 react-native-cookies 需要配合 react-native-webview 使用，具体请参考[@react-native-ohos/react-native-webview](/zh-cn/react-native-webview.md) 下面的代码展示了这个库的基本使用场景： @@ -212,6 +227,7 @@ const styles = StyleSheet.create({ > [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。 打开 `entry/oh-package.json5`，添加以下依赖 +- V6.2.1 ```json "dependencies": { @@ -220,7 +236,15 @@ const styles = StyleSheet.create({ "@react-native-oh-tpl/cookies": "file:../../node_modules/@react-native-oh-tpl/cookies/harmony/rn_cookies.har", } ``` +- V6.2.2 +```json +"dependencies": { + ... + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/cookies": "file:../../node_modules/@react-native-ohos/cookies/harmony/rn_cookies.har", + } +``` 点击右上角的 `sync` 按钮 或者在终端执行： @@ -252,7 +276,12 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) +# V6.2.1 + add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/cookies/src/main/cpp" ./rn_cookies) + +# V6.2.2 ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/cookies/src/main/cpp" ./rn_cookies) + # RNOH_BEGIN: manual_package_linking_1 file(GLOB GENERATED_CPP_FILES "./generated/*.cpp") @@ -290,11 +319,23 @@ std::vector> PackageProvider::getPackages(Package::Cont ### 4.在 ArkTs 侧引入 CookiesPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： - +- V6.2.1 ```diff ... + import {CookiesPackage} from '@react-native-oh-tpl/cookies/ts'; +export function createRNPackages(ctx: RNPackageContext): RNPackage[] { + return [ + ... ++ new CookiesPackage(ctx), + ]; +} +``` +- V6.2.2 +```diff + ... ++ import {CookiesPackage} from '@react-native-ohos/cookies/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ ... @@ -322,7 +363,13 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/cookies Releases](https://github.com/react-native-oh-library/react-native-cookies/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 6.2.1 | [@react-native-oh-tpl/cookies Releases](https://github.com/react-native-oh-library/react-native-cookies/releases) | 0.72 | +| 6.2.2 | [@react-native-ohos/react-native-exception-handler Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 ## 静态方法 > [!TIP] "Platform"列表示该属性在原三方库上支持的平台。 diff --git a/zh-cn/react-native-country-picker-modal.md b/zh-cn/react-native-country-picker-modal.md index 03ab96ed91f454cdb624b41f349bfed8898d8e6d..bf58f03a787d82f0477ba9bcaa27d73a43863ccb 100644 --- a/zh-cn/react-native-country-picker-modal.md +++ b/zh-cn/react-native-country-picker-modal.md @@ -16,7 +16,13 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-library/react-native-country-picker-modal Releases](https://github.com/react-native-oh-library/react-native-country-picker-modal/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 2.0.0 | [@react-native-oh-tpl/react-native-country-picker-modal Releases](https://github.com/react-native-oh-library/react-native-country-picker-modal/releases) | 0.72 | +| 2.0.1 | [@react-native-ohos/react-native-country-picker-modal Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -27,13 +33,19 @@ #### **npm** ```bash +# 2.0.0 npm install @react-native-oh-tpl/react-native-country-picker-modal +# 2.0.1 +npm install @react-native-ohos/react-native-country-picker-modal ``` #### **yarn** ```bash +# 2.0.0 yarn add @react-native-oh-tpl/react-native-country-picker-modal +# 2.0.1 +yarn add @react-native-ohos/react-native-country-picker-modal ``` diff --git a/zh-cn/react-native-default-preference.md b/zh-cn/react-native-default-preference.md index 7c9ddf0eb621852d30165a53ffd7806743f7c983..3f9c556bac752107693b65f1280f6de65fd3063b 100644 --- a/zh-cn/react-native-default-preference.md +++ b/zh-cn/react-native-default-preference.md @@ -18,7 +18,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-default-preference Releases](https://github.com/react-native-oh-library/react-native-default-preference/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.4.4 | [@react-native-oh-tpl/react-native-default-preference Releases](https://github.com/react-native-oh-library/react-native-default-preference/releases) | 0.72 | +| 1.4.5 | [@react-native-ohos/react-native-default-preference Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -28,13 +35,21 @@ #### **npm** ```bash +# V1.4.4 npm install @react-native-oh-tpl/react-native-default-preference + +# V1.4.5 +npm install @react-native-ohos/react-native-default-preference ``` #### **yarn** ```bash +# V1.4.4 yarn add @react-native-oh-tpl/react-native-default-preference + +# V1.4.5 +yarn add @react-native-ohos/react-native-default-preference ``` @@ -71,6 +86,10 @@ export default App; ## 使用 Codegen +> [!TIP] V1.4.4 不需要执行 Codegen。 + + + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -103,6 +122,8 @@ export default App; 打开 `entry/oh-package.json5`，添加以下依赖 +- V1.4.4 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -110,6 +131,15 @@ export default App; } ``` +- V1.4.5 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-default-preference": "file:../../node_modules/@react-native-ohos/react-native-default-preference/harmony/react_native_default_preference.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -123,16 +153,80 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md) +### 3.配置 CMakeLists 和引入 DefaultPreferencePackage + +> [!TIP] 若使用的是 1.4.4 版本，请跳过本章。 -### 3.在 ArkTs 侧引入 RNDefaultPreferencePackage +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +``` +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-default-preference/src/main/cpp" ./default_preference) +# 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_default_preference) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +``` +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "DefaultPreferencePackage.h" + +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 侧引入 RNDefaultPreferencePackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... +// V1.4.4 + import { RNDefaultPreferencePackage } from '@react-native-oh-tpl/react-native-default-preference/ts'; +// V1.4.5 ++ import { RNDefaultPreferencePackage } from '@react-native-ohos/react-native-default-preference/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -141,7 +235,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 5.运行 点击右上角的 `sync` 按钮 @@ -161,7 +255,11 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： -[@react-native-oh-tpl/react-native-default-preference Releases](https://github.com/react-native-oh-library/react-native-default-preference/releases) + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.4.4 | [@react-native-oh-tpl/react-native-default-preference Releases](https://github.com/react-native-oh-library/react-native-default-preference/releases) | 0.72 | +| 1.4.5 | [@react-native-ohos/react-native-default-preference Releases]() | 0.77 | ## API diff --git a/zh-cn/react-native-elements.md b/zh-cn/react-native-elements.md index 426bab4916ec909f84e254f333f99c53c0a60386..b97c0eeb387e6ddae5a7e4e1631131f1caa41842 100644 --- a/zh-cn/react-native-elements.md +++ b/zh-cn/react-native-elements.md @@ -28,14 +28,14 @@ ```bash npm install @rneui/themed@4.0.0-rc.8 -npm install @rneui/base@4.0.0-rc.7 +npm install @rneui/base@4.0.0-rc.8 ``` #### **yarn** ```bash yarn add @rneui/themed@4.0.0-rc.8 -yarn add @rneui/base@4.0.0-rc.7 +yarn add @rneui/base@4.0.0-rc.8 ``` diff --git a/zh-cn/react-native-exception-handler.md b/zh-cn/react-native-exception-handler.md index c991de8815f738335730fba193061068b2d38975..610b6a27847eea12e6d4bf0369701253035167e0 100644 --- a/zh-cn/react-native-exception-handler.md +++ b/zh-cn/react-native-exception-handler.md @@ -16,7 +16,16 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-exception-handler Releases](https://github.com/react-native-oh-library/react-native-exception-handler/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 2.10.10 | [@react-native-oh-tpl/react-native-exception-handler Releases](https://github.com/react-native-oh-library/react-native-exception-handler/releases) | 0.72 | +| 2.10.11 | [@react-native-ohos/react-native-exception-handler Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 + + 进入到工程目录并输入以下命令： @@ -25,13 +34,21 @@ #### **npm** ```bash +# V2.10.10 npm install @react-native-oh-tpl/react-native-exception-handler + +#V 2.10.11 +npm install @react-native-ohos/react-native-exception-handler ``` #### **yarn** ```bash +# V2.10.10 yarn add @react-native-oh-tpl/react-native-exception-handler + +#V 2.10.11 +yarn add @react-native-ohos/react-native-exception-handler ``` @@ -115,6 +132,14 @@ export const ReactNativeExceptionHandler = () => { }; ``` + + +## 使用 Codegen + +> [!TIP] V2.10.11 不需要执行 Codegen。 + +本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](https://gitee.com/react-native-oh-library/usage-docs/blob/39316eccca7657d77dfdc9e90cfbf64e6a7713f3/zh-cn/codegen.md)。 + ## Link 目前 HarmonyOS 暂不支持 AutoLink，所以 Link 步骤需要手动配置。 @@ -145,6 +170,8 @@ export const ReactNativeExceptionHandler = () => { 打开 `entry/oh-package.json5`，添加以下依赖 +- V2.10.10 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -153,6 +180,16 @@ export const ReactNativeExceptionHandler = () => { } ``` +- V2.10.11 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + + "@react-native-ohos/react-native-exception-handler": "file:../../node_modules/@react-native-ohos/react-native-exception-handler/harmony/exception_handler.har", + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -188,7 +225,14 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) + +# V2.10.10 + + add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-exception-handler/src/main/cpp" ./exception-handler) + +# V2.10.11 + ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-exception-handler/src/main/cpp" ./exception-handler) # RNOH_END: manual_package_linking_1 file(GLOB GENERATED_CPP_FILES "./generated/*.cpp") @@ -226,7 +270,7 @@ std::vector> PackageProvider::getPackages(Package::Cont ### 4.在 ArkTs 侧引入 ExceptionHandlerPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： - +- V2.10.10 ```diff ... + import {ExceptionHandlerPackage} from '@react-native-oh-tpl/react-native-exception-handler/ts'; @@ -238,7 +282,18 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { ]; } ``` +- V2.10.11 +```diff + ... ++ import {ExceptionHandlerPackage} from '@react-native-ohos/react-native-exception-handler/ts'; +export function createRNPackages(ctx: RNPackageContext): RNPackage[] { + return [ + new SamplePackage(ctx), ++ new ExceptionHandlerPackage(ctx) + ]; +} +``` ### 5.运行 点击右上角的 `sync` 按钮 @@ -257,8 +312,13 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/reace-native-exception-handler Releases](https://github.com/react-native-oh-library/react-native-exception-handler/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 2.10.10 | [@react-native-oh-tpl/react-native-exception-handler Releases](https://github.com/react-native-oh-library/react-native-exception-handler/releases) | 0.72 | +| 2.10.11 | [@react-native-ohos/react-native-exception-handler Releases]() | 0.77 | +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 ## 静态方法 > [!TIP] "Platform"列表示该属性在原三方库上支持的平台。 diff --git a/zh-cn/react-native-fs.md b/zh-cn/react-native-fs.md index c60ea9c24e60a66565963209efb24a9b066a30dd..cfd0dd47774f0676038cb6b663d40b63e22b17c9 100644 --- a/zh-cn/react-native-fs.md +++ b/zh-cn/react-native-fs.md @@ -6,10 +6,14 @@ 本项目基于 [react-native-fs@2.20.0](https://github.com/itinance/react-native-fs/tree/v2.20.0) 开发。 -| Version | Package Name | Repository | Release | -| --------------------------- | ------------------------------------ | -------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------- | -| <= 2.20.0-0.1.14@deprecated | @react-native-oh-tpl/react-native-fs | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-fs) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-fs/releases) | -| >= 2.20.1 | @react-native-ohos/react-native-fs | [Gitee](https://gitee.com/openharmony-sig/rntpc_react-native-fs) | [Gitee Releases](https://gitee.com/openharmony-sig/rntpc_react-native-fs/releases) | + +| Version | Package Name | Repository | Release | 支持RN版本 | +| --------------------------- | ------------------------------------ | -------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------- | ---------- | +| <= 2.20.0-0.1.14@deprecated | @react-native-oh-tpl/react-native-fs | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-fs) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-fs/releases) | 0.72 | +| >= 2.20.1 | @react-native-ohos/react-native-fs | [Gitee](https://gitee.com/openharmony-sig/rntpc_react-native-fs) | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-fs/releases) | 0.72 | +| >= 2.20.1 | @react-native-ohos/react-native-fs | [Gitee](https://gitee.com/openharmony-sig/rntpc_react-native-fs) | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-fs/releases) | 0.77 | + + ## 1. 安装与使用 @@ -20,12 +24,20 @@ #### npm ```bash +# <= V2.20.0-0.1.14 +npm install @react-native-oh-tpl/react-native-fs + +# >= V2.20.1 npm install @react-native-ohos/react-native-fs ``` #### yarn ```bash +# <= V2.20.0-0.1.14 +yarn add @react-native-oh-tpl/react-native-fs + +# >= V2.20.1 yarn add @react-native-ohos/react-native-fs ``` @@ -150,14 +162,20 @@ export default App; > [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。 打开 `entry/oh-package.json5`，添加以下依赖 - + - <= V2.20.0-0.1.14 +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-fs": "file:../../node_modules/@react-native-oh-tpl/react-native-fs/harmony/fs.har" + } +``` + - \>= V2.20.1 ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", "@react-native-ohos/react-native-fs": "file:../../node_modules/@react-native-ohos/react-native-fs/harmony/fs.har" } ``` - 点击右上角的 `sync` 按钮 或者在终端执行： @@ -188,7 +206,12 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) +# <= V2.20.0-0.1.14 ++ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-fs/src/main/cpp" ./fs) + +# >= V2.20.1 + add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-fs/src/main/cpp" ./fs) + # RNOH_END: manual_package_linking_1 add_library(rnoh_app SHARED @@ -225,7 +248,20 @@ std::vector> PackageProvider::getPackages(Package::Cont ### 2.4. 在 ArkTs 侧引入 FsPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： + - <= V2.20.0-0.1.14 +```diff +import type { RNPackageContext, RNPackage } from 'rnoh/ts'; + ... ++ import { FsPackage } from '@react-native-oh-tpl/react-native-fs/ts'; +export function createRNPackages(ctx: RNPackageContext): RNPackage[] { + return [ + new SamplePackage(ctx), ++ new FsPackage(ctx) + ]; +} +``` + - \>= V2.20.1 ```diff import type { RNPackageContext, RNPackage } from 'rnoh/ts'; ... @@ -257,7 +293,13 @@ ohpm install ### 3.1. 兼容性 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-ohos/react-native-fs Releases](https://gitee.com/openharmony-sig/rntpc_react-native-fs/releases) +本项目基于 [react-native-fs@2.20.0](https://github.com/itinance/react-native-fs/tree/v2.20.0) 开发。 + +| Version | Package Name | Repository | Release | 支持RN版本 | +| --------------------------- | ------------------------------------ | -------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------- | ---------- | +| <= 2.20.0-0.1.14@deprecated | @react-native-oh-tpl/react-native-fs | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-fs) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-fs/releases) | 0.72 | +| >= 2.20.1 | @react-native-ohos/react-native-fs | [Gitee](https://gitee.com/openharmony-sig/rntpc_react-native-fs) | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-fs/releases) | 0.72 | +| >= 2.20.1 | @react-native-ohos/react-native-fs | [Gitee](https://gitee.com/openharmony-sig/rntpc_react-native-fs) | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-fs/releases) | 0.77 | ## 4. 静态方法 diff --git a/zh-cn/react-native-gifted-chat.md b/zh-cn/react-native-gifted-chat.md index 01a564eff14c9b1edf8af9c7f2ada4ea7b7c42f8..9d82c0ddbb0a097f37f030531aee4e03237aa64c 100644 --- a/zh-cn/react-native-gifted-chat.md +++ b/zh-cn/react-native-gifted-chat.md @@ -24,13 +24,13 @@ #### **npm** ```bash -npm install react-native-gifted-chat@2.4.0 +npm install react-native-gifted-chat@2.8.1 ``` #### **yarn** ```bash -yarn add react-native-gifted-chat@2.4.0 +yarn add react-native-gifted-chat@2.8.1 ``` diff --git a/zh-cn/react-native-image-colors.md b/zh-cn/react-native-image-colors.md index 4282ee5d50a1d2f3ac1fcf4cd5ede56b1fd2c1b1..352244f8459a44ac86adec5143d486f69cbb11b4 100644 --- a/zh-cn/react-native-image-colors.md +++ b/zh-cn/react-native-image-colors.md @@ -17,7 +17,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-image-colors Releases](https://github.com/react-native-oh-library/react-native-image-colors/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 2.4.0 | [@react-native-oh-tpl/react-native-image-colors Releases](https://github.com/react-native-oh-library/react-native-image-colors/releases) | 0.72 | +| 2.5.1 | [@react-native-ohos/react-native-image-colors Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -26,13 +33,21 @@ #### **npm** ```bash +# V2.4.0 npm install @react-native-oh-tpl/react-native-image-colors + +# V2.5.1 +npm install @react-native-ohos/react-native-image-colors ``` #### **yarn** ```bash +# V2.4.0 yarn add @react-native-oh-tpl/react-native-image-colors + +# V2.5.1 +yarn add @react-native-ohos/react-native-image-colors ``` @@ -197,6 +212,8 @@ const styles = StyleSheet.create({ ## 使用 Codegen +> [!TIP] V2.5.1 不需要执行Codegen + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -229,6 +246,8 @@ const styles = StyleSheet.create({ 打开 `entry/oh-package.json5`，添加以下依赖 +- V2.4.0 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -236,6 +255,15 @@ const styles = StyleSheet.create({ } ``` +- V2.5.1 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-image-colors": "file:../../node_modules/@react-native-ohos/react-native-image-colors/harmony/image_colors.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -249,14 +277,81 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md) -### 3.在 ArkTs 侧引入 RNImageColorsPackage + +### 3.配置CMakeLists 和引入 ImageColorsPackage + +> [!TIP] 若使用的是 2.4.0 版本，请跳过本章 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +```cmake +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-image-colors/src/main/cpp" ./image-colors) +# 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_image_colors) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +```c++ +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "ImageColorsPackage.h" + +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 侧引入 RNImageColorsPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... +// V2.4.0 + import { RNImageColorsPackage } from "@react-native-oh-tpl/react-native-image-colors/ts"; +// V2.5.1 ++ import { RNImageColorsPackage } from "@react-native-ohos/react-native-image-colors/ts"; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -265,7 +360,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 5.运行 点击右上角的 `sync` 按钮 @@ -284,7 +379,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-image-colors Releases](https://github.com/react-native-oh-library/react-native-image-colors/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 2.4.0 | [@react-native-oh-tpl/react-native-image-colors Releases](https://github.com/react-native-oh-library/react-native-image-colors/releases) | 0.72 | +| 2.5.1 | [@react-native-ohos/react-native-image-colors Releases]() | 0.77 | ## API diff --git a/zh-cn/react-native-image-marker.md b/zh-cn/react-native-image-marker.md index d153019f42bc17d352d7426d60587cbc302a89b0..14024fbaa9e3d825064e6922482db8c235d968e0 100644 --- a/zh-cn/react-native-image-marker.md +++ b/zh-cn/react-native-image-marker.md @@ -17,7 +17,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-image-marker Releases](https://github.com/react-native-oh-library/react-native-image-marker/releases)。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.2.6 | [@react-native-oh-tpl/react-native-image-marker Releases](https://github.com/react-native-oh-library/react-native-image-marker/releases) | 0.72 | +| 1.2.7 | [@react-native-ohos/react-native-image-marker Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -28,13 +35,21 @@ #### **npm** ```bash +# V1.2.6 npm install @react-native-oh-tpl/react-native-image-marker + +# V1.2.7 +npm install @react-native-ohos/react-native-image-marker ``` #### **yarn** ```bash +# V1.2.6 yarn add @react-native-oh-tpl/react-native-image-marker + +# V1.2.7 +yarn add @react-native-ohos/react-native-image-marker ``` @@ -188,6 +203,10 @@ export const ImageMarkerText = () => { ## 使用 Codegen +> [!TIP] V1.2.7 不需要执行 Codegen。 + + + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -220,6 +239,8 @@ export const ImageMarkerText = () => { 打开 `entry/oh-package.json5`，添加以下依赖 +- V1.2.6 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -227,6 +248,15 @@ export const ImageMarkerText = () => { } ``` +- V1.2.7 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-image-marker": "file:../../node_modules/@react-native-ohos/react-native-image-marker/harmony/image_marker.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -240,14 +270,78 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md) -### 3.在 ArkTs 侧引入 RNImageMarkerPackage +### 3.配置 CMakeLists 和引入 ImageMarkerPackage + +> [!TIP] 若使用的是 1.2.6 版本，请跳过本章。 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +``` +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-image-marker/src/main/cpp" ./image-marker) +# 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_image_marker) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +``` +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "ImageMarkerPackage.h" + +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 侧引入 RNImageMarkerPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... +// V1.2.6 + import {RNImageMarkerPackage} from '@react-native-oh-tpl/react-native-image-marker/ts'; +// V1.2.7 ++ import {RNImageMarkerPackage} from '@react-native-ohos/react-native-image-marker/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ @@ -257,7 +351,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 5.运行 点击右上角的 `sync` 按钮 @@ -276,7 +370,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-image-marker Releases](https://github.com/react-native-oh-library/react-native-image-marker/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.2.6 | [@react-native-oh-tpl/react-native-image-marker Releases](https://github.com/react-native-oh-library/react-native-image-marker/releases) | 0.72 | +| 1.2.7 | [@react-native-ohos/react-native-image-marker Releases]() | 0.77 | ### 权限要求 diff --git a/zh-cn/react-native-keep-awake.md b/zh-cn/react-native-keep-awake.md index ec2d371eced20845ad58571eaf3179d2503ada23..17bc25bc74d4e7940e5bb801d27c431eec17ed62 100644 --- a/zh-cn/react-native-keep-awake.md +++ b/zh-cn/react-native-keep-awake.md @@ -21,23 +21,37 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-keep-awake Releases](https://github.com/react-native-oh-library/react-native-keep-awake/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： -进入到工程目录并输入以下命令： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.0.0 | [@react-native-oh-tpl/react-native-keep-awake Releases](https://github.com/react-native-oh-library/react-native-keep-awake/releases) | 0.72 | +| 4.0.1 | [@react-native-ohos/react-native-keep-awake Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +进入到工程目录并输入以下命令： #### **npm** ```bash +# V4.0.0 npm install @react-native-oh-tpl/react-native-keep-awake + +# V4.0.1 +npm install @react-native-ohos/react-native-keep-awake ``` #### **yarn** ```bash +# V4.0.0 yarn add @react-native-oh-tpl/react-native-keep-awake + +# V4.0.1 +yarn add @react-native-ohos/react-native-keep-awake ``` @@ -103,6 +117,12 @@ export function KeepAwakeExample() { ``` +## 使用 Codegen + +> [!TIP] V4.0.1 不需要执行Codegen + +本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 + ## Link 目前 HarmonyOS 暂不支持 AutoLink，所以 Link 步骤需要手动配置。 @@ -133,6 +153,8 @@ export function KeepAwakeExample() { 打开 `entry/oh-package.json5`，添加以下依赖 +- V4.0.0 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -140,6 +162,15 @@ export function KeepAwakeExample() { } ``` +- V4.0.1 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-keep-awake": "file:../../node_modules/@react-native-ohos/react-native-keep-awake/harmony/keep_awake.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -155,6 +186,8 @@ ohpm install 打开 `entry/oh-package.json5`，添加以下依赖 +- V4.0.0 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -162,6 +195,15 @@ ohpm install } ``` +- V4.0.1 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-keep-awake": "file:../../node_modules/@react-native-ohos/react-native-keep-awake/harmony/keep_awake" + } +``` + 打开终端，执行： ```bash @@ -169,14 +211,80 @@ cd entry ohpm install --no-link ``` -### 3.在 ArkTs 侧引入 RNKeepAwakePackage + +### 3.配置CMakeLists 和引入 KeepAwakePackage + +> [!TIP] 若使用的是 4.0.0 版本，请跳过本章 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +```cmake +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-keep-awake/src/main/cpp" ./keep-awake) +# 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_keep_awake) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +```c++ +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "KeepAwakePackage.h" + +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 侧引入 RNKeepAwakePackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... +// V4.0.0 + import { RNKeepAwakePackage } from "@react-native-oh-tpl/react-native-keep-awake/ts"; +// V4.0.1 ++ import { RNKeepAwakePackage } from "@react-native-ohos/react-native-keep-awake/ts"; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -185,7 +293,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 5.运行 点击右上角的 `sync` 按钮 @@ -204,7 +312,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-keep-awake Releases](https://github.com/react-native-oh-library/react-native-keep-awake/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.0.0 | [@react-native-oh-tpl/react-native-keep-awake Releases](https://github.com/react-native-oh-library/react-native-keep-awake/releases) | 0.72 | +| 4.0.1 | [@react-native-oh-tpl/react-native-keep-awake Releases]() | 0.77 | 本文档内容基于以下版本验证通过： diff --git a/zh-cn/react-native-keyboard-accessory.md b/zh-cn/react-native-keyboard-accessory.md index 8e91e3e7579347c06d7d077ae234ea628de5ed2d..829851d1409113cb540062018497f5f00685185c 100644 --- a/zh-cn/react-native-keyboard-accessory.md +++ b/zh-cn/react-native-keyboard-accessory.md @@ -17,22 +17,35 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-keyboard-accessory Releases](https://github.com/react-native-oh-library/react-native-keyboard-accessory/releases)。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： -进入到工程目录并输入以下命令： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.1.16 | [@react-native-oh-tpl/react-native-keyboard-accessory Releases](https://github.com/react-native-oh-library/react-native-keyboard-accessory/releases) | 0.72 | +| 0.1.17 | [@react-native-ohos/react-native-keyboard-accessory Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 -。 +进入到工程目录并输入以下命令： #### **npm** ```bash +# V0.1.16 npm install @react-native-oh-tpl/react-native-keyboard-accessory + +# V0.1.17 +npm install @react-native-ohos/react-native-keyboard-accessor ``` #### **yarn** ```bash +# V0.1.16 yarn add @react-native-oh-tpl/react-native-keyboard-accessory + +# V0.1.17 +yarn add @react-native-ohos/react-native-keyboard-accessory ``` 下面的代码展示了这个库的基本使用场景： @@ -130,7 +143,12 @@ export default ViewExample; 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-keyboard-accessory Releases](https://github.com/react-native-oh-library/react-native-keyboard-accessory/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.1.16 | [@react-native-oh-tpl/react-native-keyboard-accessory Releases](https://github.com/react-native-oh-library/react-native-keyboard-accessory/releases) | 0.72 | +| 0.1.17 | [@react-native-ohos/react-native-keyboard-accessory Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-keyboard-aware-scroll-view.md b/zh-cn/react-native-keyboard-aware-scroll-view.md index 2a9db5b2eaa883a1f2ee333e2ea3c467cd110a95..55e3da88eb6961d3a0a344b7b24ea8395de1aa85 100644 --- a/zh-cn/react-native-keyboard-aware-scroll-view.md +++ b/zh-cn/react-native-keyboard-aware-scroll-view.md @@ -16,22 +16,37 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-keyboard-aware-scroll-view Releases](https://github.com/react-native-oh-library/react-native-keyboard-aware-scroll-view/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.9.5 | [@react-native-oh-tpl/react-native-keyboard-aware-scroll-view Releases](https://github.com/react-native-oh-library/react-native-keyboard-aware-scroll-view/releases) | 0.72 | +| 0.9.6 | [@react-native-ohos/react-native-keyboard-aware-scroll-view Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： + #### **npm** ```bash +# V0.9.5 npm install @react-native-oh-tpl/react-native-keyboard-aware-scroll-view + +# V0.9.6 +npm install @react-native-ohos/react-native-keyboard-aware-scroll-view ``` #### **yarn** ```bash +# V0.9.5 yarn add @react-native-oh-tpl/react-native-keyboard-aware-scroll-view + +# V0.9.6 +yarn add @react-native-ohos/react-native-keyboard-aware-scroll-view ``` @@ -99,7 +114,12 @@ const styles = StyleSheet.create({ 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-keyboard-aware-scroll-view Releases](https://github.com/react-native-oh-library/react-native-keyboard-aware-scroll-view/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.9.5 | [@react-native-oh-tpl/react-native-keyboard-aware-scroll-view Releases](https://github.com/react-native-oh-library/react-native-keyboard-aware-scroll-view/releases) | 0.72 | +| 0.9.6 | [@react-native-ohos/react-native-keyboard-aware-scroll-view Releases]() | 0.77 | + ## 属性 diff --git a/zh-cn/react-native-lightbox.md b/zh-cn/react-native-lightbox.md index ba675a76ebb6d97277c91a2cba777312d09dc9f3..f9e359fd8670fea82e73f9dd5d111a7a77b5151d 100644 --- a/zh-cn/react-native-lightbox.md +++ b/zh-cn/react-native-lightbox.md @@ -25,13 +25,13 @@ #### **npm** ```bash -npm install react-native-lightbox-v2@0.9.0 +npm install react-native-lightbox-v2@0.9.2 ``` #### **yarn** ```bash -yarn add react-native-lightbox-v2@0.9.0 +yarn add react-native-lightbox-v2@0.9.2 ``` @@ -179,6 +179,7 @@ const styles = StyleSheet.create({ | **`activeProps`** | 可选属性，在lightbox模式下应用于内容组件， 可用于应用自定义样式或更高分辨率的图源。 | `object` |no |all | yes | | **`renderHeader(close)`** | 自定义header，用于替换默认的 X 按钮| `function` | no |all | yes | | **`renderContent`** | 自定义lightbox内容，用于替换默认的子内容| `function` |no|all | yes | +| **`renderItem(open)`** | 自定义lightbox触发元素，而不是默认的触发元素| `function` |no|all | yes | | **`willClose`** | lightbox关闭前触发 | `function` |no|all | yes | | **`onClose`** | lightbox关闭时触发| `function` |no|all | yes | | **`onOpen`** |lightbox打开时触发| `function` |no|all | yes | diff --git a/zh-cn/react-native-linear-gradient.md b/zh-cn/react-native-linear-gradient.md index 6da3ab669741f57978124e8c2c7d6adb2441eb50..98f8ed859ee050e1f904139e32ae713045cf40da 100644 --- a/zh-cn/react-native-linear-gradient.md +++ b/zh-cn/react-native-linear-gradient.md @@ -6,12 +6,15 @@ 本项目基于 [react-native-linear-gradient@3.0.0-alpha.1](https://github.com/react-native-linear-gradient/react-native-linear-gradient) 开发。 -该第三方库的仓库已迁移至 Gitee，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/react-native-linear-gradient`，具体版本所属关系如下： +该第三方库的仓库已迁移至 gitcode，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/react-native-linear-gradient`，具体版本所属关系如下： + +| Version | Package Name | Repository | Release | Version for RN | +| ------------------------- | ------------------------------------------------- | ------------------ | -------------------------- | ------------------------- | +|<= 3.0.0-0.5.0@deprecated | @react-native-oh-tpl/react-native-linear-gradient | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-linear-gradient) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-linear-gradient/releases) | 0.72 | +| > 3.0.0 | @react-native-ohos/react-native-linear-gradient | [Gitcode](https://gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient) | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient/releases) | 0.72 | +| > 3.0.0 | @react-native-ohos/react-native-linear-gradient | [Gitcode](https://gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient) | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient/releases) | 0.77 | + -| Version | Package Name | Repository | Release | -| ------------------------- | ------------------------------------------------- | ------------------ | -------------------------- | -| <= 3.0.0-0.5.0@deprecated | @react-native-oh-tpl/react-native-linear-gradient | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-linear-gradient) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-linear-gradient/releases) | -| > 3.0.0 | @react-native-ohos/react-native-linear-gradient | [Gitee](https://gitee.com/openharmony-sig/rntpc_react-native-linear-gradient) | [Gitee Releases](https://gitee.com/openharmony-sig/rntpc_react-native-linear-gradient/releases) | ## 1. 安装与使用 @@ -22,12 +25,20 @@ #### **npm** ```bash +# <= V3.0.0 +npm install @react-native-oh-tpl/react-native-linear-gradient + +# > V3.0.0 npm install @react-native-ohos/react-native-linear-gradient ``` #### **yarn** ```bash +# <= V3.0.0 +yarn add @react-native-oh-tpl/react-native-linear-gradient + +# > V3.0.0 yarn add @react-native-ohos/react-native-linear-gradient ``` @@ -122,7 +133,15 @@ var styles = StyleSheet.create({ > [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。 打开 `entry/oh-package.json5`，添加以下依赖 +- \<=V3.0.0 +```json +"dependencies": { + "@react-native-oh-tpl/react-native-linear-gradient": "file:../../node_modules/@react-native-oh-tpl/react-native-linear-gradient/harmony/linear_gradient.har" + } +``` + +- \>V3.0.0 ```json "dependencies": { "@react-native-ohos/react-native-linear-gradient": "file:../../node_modules/@react-native-ohos/react-native-linear-gradient/harmony/linear_gradient.har" @@ -192,7 +211,12 @@ ohpm install ### 3.1 兼容性 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-ohos/react-native-linear-gradient Releases](https://gitee.com/openharmony-sig/rntpc_react-native-linear-gradient/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| Version | Package Name | Repository | Release | Version for RN | +| ------------------------- | ------------------------------------------------- | ------------------ | -------------------------- | ------------------------- | +|<= 3.0.0-0.5.0@deprecated | @react-native-oh-tpl/react-native-linear-gradient | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-linear-gradient) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-linear-gradient/releases) | 0.72 | +| > 3.0.0 | @react-native-ohos/react-native-linear-gradient | [Gitcode](https://gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient) | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient/releases) | 0.72 | +| > 3.0.0 | @react-native-ohos/react-native-linear-gradient | [Gitcode](https://gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient) | [Gitcode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient/releases) | 0.77 | ## 4. 属性 @@ -216,4 +240,4 @@ ohpm install ## 6. 开源协议 -本项目基于 [The MIT License (MIT)](https://gitee.com/openharmony-sig/rntpc_react-native-linear-gradient/blob/master/LICENSE)，请自由地享受和参与开源。 +本项目基于 [The MIT License (MIT)](https://Gitcode.com/openharmony-sig/rntpc_react-native-linear-gradient/blob/master/LICENSE)，请自由地享受和参与开源。 diff --git a/zh-cn/react-native-mail.md b/zh-cn/react-native-mail.md index abedccde0a40e15e4106389f0708c6d5c1565417..d7e4779d6575778234009cb5762ab77e1da3322d 100644 --- a/zh-cn/react-native-mail.md +++ b/zh-cn/react-native-mail.md @@ -18,7 +18,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-mail Releases](https://github.com/react-native-oh-library/react-native-mail/releases)，并下载适用版本的 tgz 包 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 6.1.1 | [@react-native-oh-tpl/react-native-mail Releases](https://github.com/react-native-oh-library/react-native-mail/releases) | 0.72 | +| 6.1.2 | [@react-native-ohos/react-native-mail Releases]() | 0.77 | + +并下载适用版本的 tgz 包 进入到工程目录并输入以下命令： @@ -29,13 +36,21 @@ #### **npm** ```bash +# V6.1.1 npm install @react-native-oh-tpl/react-native-mail + +# V6.1.2 +npm install @react-native-ohos/react-native-mail ``` #### **yarn** ```bash +# V6.1.1 yarn add @react-native-oh-tpl/react-native-mail + +# V6.1.2 +yarn add @react-native-ohos/react-native-mail ``` @@ -141,6 +156,8 @@ export default class App extends Component { 打开 `entry/oh-package.json5`，添加以下依赖 +- V6.1.1 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -148,6 +165,15 @@ export default class App extends Component { } ``` +- V6.1.2 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-mail": "file:../../node_modules/@react-native-ohos/react-native-mail/harmony/mail.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -167,8 +193,12 @@ ohpm install ```diff ... +// V6.1.1 + import {RNMailPackage} from '@react-native-oh-tpl/react-native-mail/ts'; +// V6.1.2 ++ import {RNMailPackage} from '@react-native-ohos/react-native-mail/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -196,7 +226,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-mail Releases](https://github.com/react-native-oh-library/react-native-mail/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 6.1.1 | [@react-native-oh-tpl/react-native-mail Releases](https://github.com/react-native-oh-library/react-native-mail/releases) | 0.72 | +| 6.1.2 | [@react-native-ohos/react-native-mail Releases]() | 0.77 | ## API diff --git a/zh-cn/react-native-map-linking.md b/zh-cn/react-native-map-linking.md index 7f219b8899960e632a21da28ab02e6121b8f9d4c..99abbc6df592cc4492d992cc037069cde8031243 100644 --- a/zh-cn/react-native-map-linking.md +++ b/zh-cn/react-native-map-linking.md @@ -8,11 +8,10 @@ 该第三方库的仓库已迁移至 Gitee，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/react-native-map-linking`，具体版本所属关系如下： -| Version | Package Name | Repository | Release | -| ------------------------- | --------------------------------------------- | ----------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | -| <= 1.0.1-0.0.1@deprecated | @react-native-oh-tpl/react-native-map-linking | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-map-linking) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-map-linking/releases) | -| > 1.0.1 | @react-native-ohos/react-native-map-linking | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-map-linking) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-map-linking/releases) | - +| Version | Package Name | Repository | Release | 支持RN版本 | +| ------------------------- | --------------------------------------------- | ----------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ---------- | +| <= 1.0.1-0.0.1@deprecated | @react-native-oh-tpl/react-native-map-linking | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-map-linking) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-map-linking/releases) | 0.72 | +| > 1.0.1 | @react-native-ohos/react-native-map-linking | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-map-linking) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-map-linking/releases) | 0.77 | ## 1. 安装与使用 进入到工程目录并输入以下命令： @@ -22,12 +21,20 @@ #### **npm** ```bash +# <= V1.0.1-0.0.1 +npm install @react-native-oh-tpl/react-native-map-linking + +# > V1.0.1 npm install @react-native-ohos/react-native-map-linking ``` #### **yarn** ```bash +# <= V1.0.1-0.0.1 +yarn add @react-native-oh-tpl/react-native-map-linking + +# > V1.0.1 yarn add @react-native-ohos/react-native-map-linking ``` @@ -135,7 +142,11 @@ export default MapLinkingDemo; ### 2.2 兼容性 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-ohos/react-native-map-linking Releases](https://gitee.com/openharmony-sig/rntpc_react-native-map-linking/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| Version | Package Name | Repository | Release | 支持RN版本 | +| ------------------------- | --------------------------------------------- | ----------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ---------- | +| <= 1.0.1-0.0.1@deprecated | @react-native-oh-tpl/react-native-map-linking | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-map-linking) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-map-linking/releases) | 0.72 | +| > 1.0.1 | @react-native-ohos/react-native-map-linking | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-map-linking) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-map-linking/releases) | 0.77 | ## 3. APIs diff --git a/zh-cn/react-native-maps-directions.md b/zh-cn/react-native-maps-directions.md index 00de906b3ea52c4d4b4f5b7edc0df446470a13fe..d5a09889f724ae3a15ac90ee51adf3cb7502d2da 100644 --- a/zh-cn/react-native-maps-directions.md +++ b/zh-cn/react-native-maps-directions.md @@ -19,20 +19,31 @@ > [!TIP] 该库依赖react-native-maps，可参考[react-native-maps文档](./react-native-maps.md)安装 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-maps-directions Releases](https://github.com/react-native-oh-library/react-native-maps-directions/releases)，并下载适用版本的 tgz 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.9.1 | [@react-native-oh-tpl/react-native-maps-directions Releases](https://github.com/react-native-oh-library/react-native-maps-directions/releases) | 0.72 | +| 1.9.2 | [@react-native-ohos/react-native-maps-directions Releases]() | 0.77 | 进入到工程目录并输入以下命令： #### **npm** ```bash +#V1.9.1 npm install @react-native-oh-tpl/react-native-maps-directions +#V1.9.2 +npm install @react-native-ohos/react-native-maps-directions ``` #### **yarn** ```bash +#V1.9.1 yarn add @react-native-oh-tpl/react-native-maps-directions +#V1.9.2 +yarn add @react-native-ohos/react-native-maps-directions ``` 下面的代码展示了这个库的基本使用场景： @@ -161,7 +172,12 @@ export default MapExample; 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-maps-directions Releases](https://github.com/react-native-oh-library/react-native-maps-directions/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.9.1 | [@react-native-oh-tpl/react-native-maps-directions Releases](https://github.com/react-native-oh-library/react-native-maps-directions/releases) | 0.72 | +| 1.9.2 | [@react-native-ohos/react-native-maps-directions Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-markdown-display.md b/zh-cn/react-native-markdown-display.md index 4a0475c88a1e4bee886019e672cd44216d68de5a..7002a621df8b0f6632f347f9f349b59954a26619 100644 --- a/zh-cn/react-native-markdown-display.md +++ b/zh-cn/react-native-markdown-display.md @@ -16,7 +16,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-markdown-display Releases](https://github.com/react-native-oh-library/react-native-markdown-display/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ----------- | ------------------------------------------------------------ | ---------- | +| 7.0.2-0.0.1 | [@react-native-oh-tpl/react-native-markdown-display Releases](https://github.com/react-native-oh-library/react-native-markdown-display/releases) | 0.72 | +| 7.0.3 | [@react-native-ohos/react-native-markdown-display Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,13 +32,21 @@ #### **npm** ```bash +#7.0.2-0.0.1 npm install @react-native-oh-tpl/react-native-markdown-display + +#7.0.3 +npm install @react-native-ohos/react-native-markdown-display ``` #### **yarn** ```bash +#7.0.2-0.0.1 yarn add @react-native-oh-tpl/react-native-markdown-display + +#7.0.3 +yarn add @react-native-ohos/react-native-markdown-display ``` diff --git a/zh-cn/react-native-markdown-renderer.md b/zh-cn/react-native-markdown-renderer.md index 6ddc441adca771feece86ebb30d3c85b87ad3946..07abdc405b698a442e1259f63b99063f010ba8a4 100644 --- a/zh-cn/react-native-markdown-renderer.md +++ b/zh-cn/react-native-markdown-renderer.md @@ -16,7 +16,12 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-markdown-renderer Releases](https://github.com/react-native-oh-library/react-native-markdown-renderer/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.2.8 | [@react-native-oh-tpl/react-native-markdown-renderer Releases](https://github.com/react-native-oh-library/react-native-markdown-renderer/releases) | 0.72 | +| 3.2.9 | [@react-native-ohos/react-native-markdown-renderer Releases]() | 0.77 | 进入到工程目录并输入以下命令： @@ -25,13 +30,19 @@ #### **npm** ```bash +#V3.2.8 npm install @react-native-oh-tpl/react-native-markdown-renderer +#V3.2.9 +npm install @react-native-ohos/react-native-markdown-renderer ``` #### **yarn** ```bash +#V3.2.8 yarn add @react-native-oh-tpl/react-native-markdown-renderer +#V3.2.9 +yarn add @react-native-ohos/react-native-markdown-renderer ``` @@ -70,7 +81,12 @@ export default class Page extends PureComponent { 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-markdown-renderer Releases](https://github.com/react-native-oh-library/react-native-markdown-renderer/releases) +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.2.8 | [@react-native-oh-tpl/react-native-markdown-renderer Releases](https://github.com/react-native-oh-library/react-native-markdown-renderer/releases) | 0.72 | +| 3.2.9 | [@react-native-ohos/react-native-markdown-renderer Releases]() | 0.77 | ## Markdown 组件 diff --git a/zh-cn/react-native-marquee.md b/zh-cn/react-native-marquee.md index ed1b23fd31696728eeb6f2cee907226b84da914d..703d7dccdad4a25bea5eba13c21397b3b8a3e3cf 100644 --- a/zh-cn/react-native-marquee.md +++ b/zh-cn/react-native-marquee.md @@ -8,10 +8,11 @@ 该第三方库的仓库已迁移至 Gitcode，且支持直接从 npm 下载，新的包名为：`@react-native-ohos/react-native-marquee`，具体版本所属关系如下： -| Version | Package Name | Repository | Release | -| ------------------------- | ------------------------------------------------- | ------------------ | -------------------------- | -| <= 0.5.0-0.0.1@deprecated | @react-native-oh-tpl/react-native-marquee | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-marquee) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-marquee/releases) | -| > 0.5.1 | @react-native-ohos/react-native-marquee | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee/releases) | +| Version | Package Name | Repository | Release | Version for RN | +| ------------------------- | ------------------------------------------------- | ------------------ | -------------------------- | ------------------------- | +| <= 0.5.0-0.0.1@deprecated | @react-native-oh-tpl/react-native-marquee | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-marquee) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-marquee/releases) | 0.72 | +| > 0.5.1 | @react-native-ohos/react-native-marquee | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee/releases) | 0.72 | +| > 0.5.1 | @react-native-ohos/react-native-marquee | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee/releases) | 0.77 | ## 1. 安装与使用 @@ -73,10 +74,13 @@ const styles = StyleSheet.create({ ### 2.1 兼容性 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-ohos/react-native-marquee Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： - -## 3. 属性 +| Version | Package Name | Repository | Release | Version for RN | +| ------------------------- | ----------------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | -------------- | +| <= 0.5.0-0.0.1@deprecated | @react-native-oh-tpl/react-native-marquee | [Github(deprecated)](https://github.com/react-native-oh-library/react-native-marquee) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/react-native-marquee/releases) | 0.72 | +| > 0.5.1 | @react-native-ohos/react-native-marquee | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee/releases) | 0.72 | +| > 0.5.1 | @react-native-ohos/react-native-marquee | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee) | [GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-marquee/releases) | 0.77 | > [!TIP] "Platform"列表示该属性在原三方库上支持的平台。 diff --git a/zh-cn/react-native-material-buttons.md b/zh-cn/react-native-material-buttons.md index cdbfdddc4dea78552a296967f2737ae270ab9eda..75725495f585f69ec613738a93d2818c8ba03b97 100644 --- a/zh-cn/react-native-material-buttons.md +++ b/zh-cn/react-native-material-buttons.md @@ -17,7 +17,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-material-buttons Releases](https://github.com/react-native-oh-library/react-native-material-buttons/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.6.0 | [@react-native-oh-tpl/react-native-material-buttons Releases](https://github.com/react-native-oh-library/react-native-material-buttons/releases) | 0.72 | +| 0.6.1 | [@react-native-ohos/react-native-material-buttons Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -26,13 +33,23 @@ #### **npm** ```bash +#v0.6.0 npm install @react-native-oh-tpl/react-native-material-buttons +npm install deprecated-react-native-prop-types +#v0.6.1 +npm install @react-native-ohos/react-native-material-buttons +npm install deprecated-react-native-prop-types ``` #### **yarn** ```bash +#v0.6.0 yarn add @react-native-oh-tpl/react-native-material-buttons +yarn add deprecated-react-native-prop-types +#v0.6.1 +yarn add @react-native-ohos/react-native-material-buttons +yarn add deprecated-react-native-prop-types ``` @@ -205,7 +222,12 @@ export default MaterialButtons; 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-material-buttons Releases](https://github.com/react-native-oh-library/react-native-material-buttons/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.6.0 | [@react-native-oh-tpl/react-native-material-buttons Releases](https://github.com/react-native-oh-library/react-native-material-buttons/releases) | 0.72 | +| 0.6.1 | [@react-native-ohos/react-native-material-buttons Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-material-textfield.md b/zh-cn/react-native-material-textfield.md index 03b685808a04540d6be781d5e2674cf51bed57b9..50e9479a0020882d7bc5c1cd61dcd6e71b4eaf49 100644 --- a/zh-cn/react-native-material-textfield.md +++ b/zh-cn/react-native-material-textfield.md @@ -17,7 +17,12 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-material-textfield Releases](https://github.com/react-native-oh-library/react-native-material-textfield/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.16.1 | [@react-native-oh-tpl/react-native-material-textfield Releases](https://github.com/react-native-oh-library/react-native-material-textfield/releases) | 0.72 | +| 0.16.2 | [@react-native-ohos/react-native-material-textfield Releases]() | 0.77 | 进入到工程目录并输入以下命令： @@ -26,13 +31,23 @@ #### **npm** ```bash +#v0.16.1 npm install @react-native-oh-tpl/react-native-material-textfield +npm install deprecated-react-native-prop-types +#v0.16.2 +npm install @react-native-ohos/react-native-material-textfield +npm install deprecated-react-native-prop-types ``` #### **yarn** ```bash +#v0.16.1 yarn add @react-native-oh-tpl/react-native-material-textfield +yarn add deprecated-react-native-prop-types +#v0.16.2 +yarn add @react-native-ohos/react-native-material-textfield +yarn add deprecated-react-native-prop-types ``` @@ -201,7 +216,12 @@ const styles = StyleSheet.create({ 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-material-textfield Releases](https://github.com/react-native-oh-library/react-native-material-textfield/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.16.1 | [@react-native-oh-tpl/react-native-material-textfield Releases](https://github.com/react-native-oh-library/react-native-material-textfield/releases) | 0.72 | +| 0.16.2 | [@react-native-ohos/react-native-material-textfield Releases]() | 0.77 | 在下述版本验证通过： diff --git a/zh-cn/react-native-neomorph-shadows.md b/zh-cn/react-native-neomorph-shadows.md index 3ccaa4156976b143397a90c11272246a783c59b6..1b006ac5f7b1874fabf693f293cff6c4a84417e9 100644 --- a/zh-cn/react-native-neomorph-shadows.md +++ b/zh-cn/react-native-neomorph-shadows.md @@ -17,7 +17,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-neomorph-shadows Releases](https://github.com/react-native-oh-library/react-native-neomorph-shadows/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.1.2 | [@react-native-oh-tpl/react-native-neomorph-shadows Releases](https://github.com/react-native-oh-library/react-native-neomorph-shadows/releases) | 0.72 | +| 1.1.3 | [@react-native-ohos/react-native-neomorph-shadows Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -26,13 +33,21 @@ #### **npm** ```bash +# V1.1.2 npm install @react-native-oh-tpl/react-native-neomorph-shadows + +# V1.1.3 +npm install @react-native-ohos/react-native-neomorph-shadows ``` #### **yarn** ```bash +# V1.1.2 yarn add @react-native-oh-tpl/react-native-neomorph-shadows + +# V1.1.3 +yarn add @react-native-ohos/react-native-neomorph-shadows ``` @@ -114,7 +129,12 @@ const styles = StyleSheet.create({ 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-neomorph-shadows Releases](https://github.com/react-native-oh-library/react-native-neomorph-shadows/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.1.2 | [@react-native-oh-tpl/react-native-neomorph-shadows Releases](https://github.com/react-native-oh-library/react-native-neomorph-shadows/releases) | 0.72 | +| 1.1.3 | [@react-native-ohos/react-native-neomorph-shadows Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-picker.md b/zh-cn/react-native-picker.md index 31abd4605173a3ee7fb79120ce76cad457348d08..0e4e02fa4ae4ad8d3f51ef66ec7a4c4db52fff86 100644 --- a/zh-cn/react-native-picker.md +++ b/zh-cn/react-native-picker.md @@ -16,22 +16,40 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-picker Releases](https://github.com/react-native-oh-library/react-native-picker/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 + + +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.3.7 | [@react-native-oh-tpl/react-native-picker Releases](https://github.com/react-native-oh-library/react-native-picker/releases) | 0.72 | +| 4.3.8 | [@react-native-ohos/react-native-picker Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： + + #### **npm** ```bash +# V4.3.7 npm install @react-native-oh-tpl/react-native-picker + +# V4.3.8 +npm install @react-native-ohos/react-native-picker ``` #### **yarn** ```bash +# V4.3.7 yarn add @react-native-oh-tpl/react-native-picker + +# V4.3.8 +yarn add @react-native-ohos/react-native-picker ``` @@ -108,7 +126,15 @@ const MyPicker = () => { }; export default MyPicker; + + ``` +## 使用 Codegen + +> [!TIP] V4.3.8 不需要执行 Codegen。 + +本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](https://gitee.com/react-native-oh-library/usage-docs/blob/39316eccca7657d77dfdc9e90cfbf64e6a7713f3/zh-cn/codegen.md)。 + ## Link 目前 HarmonyOS 暂不支持 AutoLink，所以 Link 步骤需要手动配置。 @@ -139,13 +165,20 @@ export default MyPicker; 打开 `entry/oh-package.json5`，添加以下依赖 +- V4.3.7 ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", "@react-native-oh-tpl/react-native-picker": "file:../../node_modules/@react-native-oh-tpl/react-native-picker/harmony/picker.har" } ``` - +- V4.3.8 +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-oh-tpl/react-native-picker": "file:../../node_modules/@react-native-ohos/react-native-picker/harmony/picker.har" + } +``` 点击右上角的 `sync` 按钮 或者在终端执行： @@ -181,7 +214,11 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) +# V4.3.7 + add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-picker/src/main/cpp" ./picker) + +# V4.3.8 ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-picker/src/main/cpp" ./picker) # RNOH_END: manual_package_linking_1 file(GLOB GENERATED_CPP_FILES "./generated/*.cpp") @@ -195,7 +232,11 @@ target_link_libraries(rnoh_app PUBLIC rnoh) # RNOH_BEGIN: manual_package_linking_2 target_link_libraries(rnoh_app PUBLIC rnoh_sample_package) +# V4.3.7 + target_link_libraries(rnoh_app PUBLIC rnoh_native_picker) + +# V4.3.8 ++ target_link_libraries(rnoh_app PUBLIC rnoh_picker) # RNOH_END: manual_package_linking_2 ``` @@ -221,10 +262,12 @@ std::vector> PackageProvider::getPackages(Package::Cont ### 4.在 ArkTs 侧引入 PickerViewPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： - ```diff ... + // V4.3.7 + import { PickerViewPackage } from "@react-native-oh-tpl/react-native-picker/ts" + // V4.3.8 ++ import { PickerViewPackage } from "@react-native-ohos/react-native-picker/ts" export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ @@ -232,7 +275,6 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { ]; } ``` - ### 5.运行 点击右上角的 `sync` 按钮 @@ -252,7 +294,11 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-picker Releases](https://github.com/react-native-oh-library/react-native-picker/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.3.7 | [@react-native-oh-tpl/react-native-picker Releases](https://github.com/react-native-oh-library/react-native-picker/releases) | 0.72 | +| 4.3.8 | [@react-native-ohos/react-native-picker Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-restart.md b/zh-cn/react-native-restart.md index 5ca34d54de67c3851434cc4fc60aa4a0bd91588a..f959d32844b74128e832c0fe6880d3566ca4e854 100644 --- a/zh-cn/react-native-restart.md +++ b/zh-cn/react-native-restart.md @@ -17,7 +17,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-restart Releases](https://github.com/react-native-oh-library/react-native-restart/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.0.27 | [@react-native-oh-tpl/react-native-restart Releases](https://github.com/react-native-oh-library/react-native-restart/releases) | 0.72 | +| 0.0.28 | [@react-native-ohos/react-native-restart Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -26,13 +33,21 @@ #### **npm** ```bash +# V0.0.27 npm install @react-native-oh-tpl/react-native-restart + +# V0.0.28 +npm install @react-native-ohos/react-native-restart ``` #### **yarn** ```bash +# V0.0.27 yarn add @react-native-oh-tpl/react-native-restart + +# V0.0.28 +yarn add @react-native-ohos/react-native-restart ``` @@ -79,6 +94,8 @@ const styles = StyleSheet.create({ ## 使用 Codegen +> [!TIP] V0.0.28 不需要执行Codegen + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -110,6 +127,8 @@ const styles = StyleSheet.create({ 打开 `entry/oh-package.json5`，添加以下依赖 +- V0.0.27 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -117,6 +136,15 @@ const styles = StyleSheet.create({ } ``` +- V0.0.28 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-restart": "file:../../node_modules/@react-native-ohos/react-native-restart/harmony/rn_restart.har", + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -130,15 +158,81 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](https://gitee.com/react-native-oh-library/usage-docs/blob/master/zh-cn/link-source-code.md) -### 3.在 ArkTs 侧引入 RNRestartPackage + +### 3.配置CMakeLists 和引入 RestartPackage + +> [!TIP] 若使用的是 4.0.0 版本，请跳过本章 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +```cmake +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-restart/src/main/cpp" ./restart) +# 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_restart) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +```c++ +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "RestartPackage.h" + +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 侧引入 RNRestartPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff import type { RNPackageContext, RNPackage } from "rnoh/ts"; import { SamplePackage } from "rnoh-sample-package/ts"; +// V0.0.27 + import { RNRestartPackage } from '@react-native-oh-tpl/react-native-restart/ts'; +// V0.0.28 ++ import { RNRestartPackage } from '@react-native-ohos/react-native-restart/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -153,7 +247,12 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-restart Releases](https://github.com/react-native-oh-library/react-native-restart/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.0.27 | [@react-native-oh-tpl/react-native-restart Releases](https://github.com/react-native-oh-library/react-native-restart/releases) | 0.72 | +| 0.0.28 | [@react-native-ohos/react-native-restart Releases]() | 0.77 | ## 静态方法 diff --git a/zh-cn/react-native-screens.md b/zh-cn/react-native-screens.md index af3334432bc74fea45a82ea60dc092ae62f51965..c99d8ab48715ec01ffbac2d4ad6b16939dfdabed 100644 --- a/zh-cn/react-native-screens.md +++ b/zh-cn/react-native-screens.md @@ -12,7 +12,7 @@

-> [!TIP] [Github 地址](https://github.com/software-mansion/react-native-screens/tree/3.29.0) +> [!TIP] [Github 地址](https://github.com/software-mansion/react-native-screens/tree/4.13.1) ## 安装与使用 @@ -23,19 +23,22 @@ #### **npm** ```bash +#v4.13.1 npm install @react-navigation/native npm install @react-native-oh-tpl/stack npm install @react-native-oh-tpl/react-native-safe-area-context -npm install react-native-screens@3.29.0 +npm install react-native-screens@4.13.1 + ``` #### **yarn** ```bash +#v4.13.1 yarn add @react-navigation/native yarn add @react-native-oh-tpl/stack yarn add @react-native-oh-tpl/react-native-safe-area-context -yarn add react-native-screens@3.29.0 +yarn add react-native-screens@4.13.1 ``` @@ -135,7 +138,9 @@ enableScreens(false); | Name | Description | Type | Required | Platform | HarmonyOS Support | |-----------------------------------------------------------|---------------------------------------------------------------------------------------|----------|----------|-------------|-------------------| | enableScreens | 支持原生及其 React Native View | function | No | iOS Android | Yes | +| screensEnabled | 检查是否启用了原生屏幕功能 | function | No | iOS Android | Yes | | enableFreeze | 对 react-freeze 的支持，使用 ReactSuspense 机制来防止 React 组件树的部分渲染 | function | No | iOS Android | Yes | +| freezeEnabled | 检查是否启用了冻结(Freeze)功能 | function | No | iOS Android | Yes | | createNativeStackNavigator | 提供屏幕切换的能力 | function | No | iOS Android | NO | | NativeStackNavigationProp | 切换页面属性的封装 | object | No | iOS Android | Yes | | NativeStackNavigationOptions | 导航栏属性设置封装 | object | No | iOS Android | NO | @@ -150,10 +155,14 @@ enableScreens(false); | onDisappear | 页面消失 | function | No | iOS Android | Yes | | onWillAppear | 页面将显示 | function | No | iOS Android | Yes | | onWillDisappear | 页面将消失 | function | No | iOS Android | Yes | +| onDismissed | 屏幕被返回手势或硬件返回键关闭时触发 | function | No | iOS Android | Yes | +| onTransitionProgress | 转场动画进度更新时触发 | function | No | iOS Android | Yes | | fullScreenSwipeEnabled | 全屏滑动 | property | No | iOS Android | Yes | +| shouldFreeze | 是否应该使用react-freeze来“冻结”屏幕 | property | No | iOS Android | Yes | | gestureEnabled | 是否开启手势滑动 | property | No | iOS Android | Yes | | statusBarColor | 状态栏颜色 | property | No | iOS Android | No | | screenOrientation | 屏幕显示方向 | property | No | iOS Android | Yes | +| navigationBarTranslucent | 导航栏是否透明 | property | No | iOS Android | Yes | | statusBarStyle | 状态栏样式 | property | No | iOS Android | Yes | | statusBarTranslucent | 状态栏是否透明化 | property | No | iOS Android | Yes | | statusBarHidden | 隐藏状态栏 | property | No | iOS Android | Yes | diff --git a/zh-cn/react-native-screenshot-prevent.md b/zh-cn/react-native-screenshot-prevent.md index 189e067c960bfb7e2fe34b45fa1a5c51095addcc..bde52eab5bd212339f4c292b4b86da5f60adac40 100644 --- a/zh-cn/react-native-screenshot-prevent.md +++ b/zh-cn/react-native-screenshot-prevent.md @@ -16,7 +16,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-screenshot-prevent Releases](https://github.com/react-native-oh-library/react-native-screenshot-prevent/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.2.1 | [@react-native-oh-tpl/react-native-screenshot-prevent Releases](https://github.com/react-native-oh-library/react-native-screenshot-prevent/releases) | 0.72 | +| 1.2.2 | [@react-native-ohos/react-native-screenshot-prevent Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,13 +32,21 @@ #### **npm** ```bash +# V1.2.1 npm install @react-native-oh-tpl/react-native-screenshot-prevent + +# V1.2.2 +npm install @react-native-ohos/react-native-screenshot-prevent ``` #### **yarn** ```bash +# V1.2.1 yarn add @react-native-oh-tpl/react-native-screenshot-prevent + +# V1.2.2 +yarn add @react-native-ohos/react-native-screenshot-prevent ``` @@ -98,6 +113,8 @@ useEffect(() => { 打开 `entry/oh-package.json5`，添加以下依赖 +- V1.2.1 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -105,6 +122,15 @@ useEffect(() => { } ``` +- V1.2.2 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-screenshot-prevent": "file:../../node_modules/@react-native-ohos/react-native-screenshot-prevent/harmony/react_native_screenshot_prevent.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -118,14 +144,80 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md) -### 3.在 ArkTs 侧引入 RNScreenShotPreventPackage +### 3.配置 CMakeLists 和引入 ScreenshotPreventPackage + +> [!TIP] 若使用的是 1.2.1 版本，请跳过本章。 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +``` +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-screenshot-prevent/src/main/cpp" ./screenshot-prevent) +# 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_screenshot_prevent) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +``` +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "ScreenshotPreventPackage.h" + +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 侧引入 RNScreenShotPreventPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... + +// V1.2.1 + import { RNScreenShotPreventPackage } from "@react-native-oh-tpl/react-native-screenshot-prevent/ts"; +// V1.2.2 ++ import { RNScreenShotPreventPackage } from "@react-native-ohos/react-native-screenshot-prevent/ts"; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -134,7 +226,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 5.运行 点击右上角的 `sync` 按钮 @@ -153,7 +245,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-screenshot-prevent Releases](https://github.com/react-native-oh-library/react-native-screenshot-prevent/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.2.1 | [@react-native-oh-tpl/react-native-screenshot-prevent Releases](https://github.com/react-native-oh-library/react-native-screenshot-prevent/releases) | 0.72 | +| 1.2.2 | [@react-native-ohos/react-native-screenshot-prevent Releases]() | 0.77 | ### 权限要求 diff --git a/zh-cn/react-native-scroll-bottom-sheet.md b/zh-cn/react-native-scroll-bottom-sheet.md index 11afdbd6a3f1ae38908818fa5bec809be03b9c62..f737ef4e3d22564982263abc4c0f63763587e12c 100644 --- a/zh-cn/react-native-scroll-bottom-sheet.md +++ b/zh-cn/react-native-scroll-bottom-sheet.md @@ -18,7 +18,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-library/react-native-scroll-bottom-sheet Releases](https://github.com/react-native-oh-library/react-native-scroll-bottom-sheet/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.7.0 | [@react-native-oh-library/react-native-scroll-bottom-sheet Releases](https://github.com/react-native-oh-library/react-native-scroll-bottom-sheet/releases) | 0.72 | +| 0.7.1 | [@react-native-ohos/react-native-scroll-bottom-sheet Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -27,13 +34,21 @@ #### **npm** ```bash +# V0.7.0 npm install @react-native-oh-tpl/react-native-scroll-bottom-sheet + +# V0.7.1 +npm install @react-native-ohos/react-native-scroll-bottom-sheet ``` #### **yarn** ```bash +# V0.7.0 yarn add @react-native-oh-tpl/react-native-scroll-bottom-sheet + +# V0.7.1 +yarn add @react-native-ohos/react-native-scroll-bottom-sheet ``` @@ -162,7 +177,12 @@ const styles = StyleSheet.create({ 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-library/react-native-scroll-bottom-sheet Releases](https://github.com/react-native-oh-library/react-native-scroll-bottom-sheet/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.7.0 | [@react-native-oh-library/react-native-scroll-bottom-sheet Releases](https://github.com/react-native-oh-library/react-native-scroll-bottom-sheet/releases) | 0.72 | +| 0.7.1 | [@react-native-ohos/react-native-scroll-bottom-sheet Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-send-intent.md b/zh-cn/react-native-send-intent.md index fe55d9e85457b77bd51e2961356cc328ad4d9d16..5eb3872b1e5eaf843eac8f96b327b6aedd651ebb 100644 --- a/zh-cn/react-native-send-intent.md +++ b/zh-cn/react-native-send-intent.md @@ -16,7 +16,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-send-intent Releases](https://github.com/react-native-oh-library/react-native-send-intent/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.3.0 | [@react-native-oh-tpl/react-native-send-intent Releases](https://github.com/react-native-oh-library/react-native-send-intent/releases) | 0.72 | +| 1.3.1 | [@react-native-ohos/react-native-send-intent Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -26,13 +33,21 @@ #### npm ```bash +# V1.3.0 npm install @react-native-oh-tpl/react-native-send-intent + +# V1.3.1 +npm install @react-native-ohos/react-native-send-intent ``` #### yarn ```bash +# V1.3.0 yarn add @react-native-oh-tpl/react-native-send-intent + +# V1.3.1 +yarn add @react-native-ohos/react-native-send-intent ``` @@ -139,6 +154,10 @@ export default SendIntent; ## 使用 Codegen +> [!TIP] V1.3.1 不需要执行 Codegen。 + + + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -171,12 +190,24 @@ export default SendIntent; 打开 `entry/oh-package.json5`，添加以下依赖 +- V1.3.0 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", "@react-native-oh-tpl/react-native-send-intent": "file:../../node_modules/@react-native-oh-tpl/react-native-send-intent/harmony/send_intent.har" } ``` + +- V1.3.1 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-send-intent": "file:../../node_modules/@react-native-ohos/react-native-send-intent/harmony/send_intent.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -190,14 +221,78 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md) -### 3.在 ArkTs 侧引入 RNSendIntentPackage +### 3.配置 CMakeLists 和引入 SendIntentPackage + +> [!TIP] 若使用的是 1.3.0 版本，请跳过本章。 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +``` +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-send-intent/src/main/cpp" ./send_intent) +# 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_send_intent) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +``` +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "SendIntentPackage.h" + +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 侧引入 RNSendIntentPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... +// V1.3.0 + import {RNSendIntentPackage} from '@react-native-oh-tpl/react-native-send-intent/ts'; +// V1.3.1 ++ import {RNSendIntentPackage} from '@react-native-ohos/react-native-send-intent/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ @@ -207,7 +302,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 5.运行 点击右上角的 `sync` 按钮 @@ -226,7 +321,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-send-intent Releases](https://github.com/react-native-oh-library/react-native-send-intent/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.3.0 | [@react-native-oh-tpl/react-native-send-intent Releases](https://github.com/react-native-oh-library/react-native-send-intent/releases) | 0.72 | +| 1.3.1 | [@react-native-ohos/react-native-send-intent Releases]() | 0.77 | ## API diff --git a/zh-cn/react-native-shared-element.md b/zh-cn/react-native-shared-element.md index 051587da2a8e0ba45bebe719fa4ab2c745244023..0af355ca2f0d87117b7381722ee25562d9bf1f85 100644 --- a/zh-cn/react-native-shared-element.md +++ b/zh-cn/react-native-shared-element.md @@ -16,7 +16,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-shared-element Releases](https://github.com/react-native-oh-library/react-native-shared-element/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.8.9 | [@react-native-oh-tpl/react-native-shared-element Releases](https://github.com/react-native-oh-library/react-native-shared-element/releases) | 0.72 | +| 0.9.1 | [@react-native-ohos/react-native-shared-element Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,13 +32,21 @@ #### **npm** ```bash +# V0.8.9 npm install @react-native-oh-tpl/react-native-shared-element + +# V0.9.1 +npm install @react-native-ohos/react-native-shared-element ``` #### **yarn** ```bash +# V0.8.9 yarn add @react-native-oh-tpl/react-native-shared-element + +# V0.9.1 +yarn add @react-native-ohos/react-native-shared-element ``` @@ -237,6 +252,8 @@ const styles = StyleSheet.create({ 打开 `entry/oh-package.json5`，添加以下依赖 +- V0.8.9 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -244,6 +261,15 @@ const styles = StyleSheet.create({ } ``` +- V0.9.1 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-shared-element": "file:../../node_modules/@react-native-ohos/react-native-shared-element/harmony/shared_element.har" +} +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -279,7 +305,11 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) +# V0.8.9 + add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-shared-element/src/main/cpp" ./shared-element) + +# V0.9.1 ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-shared-element/src/main/cpp" ./shared-element) # RNOH_END: manual_package_linking_1 file(GLOB GENERATED_CPP_FILES "./generated/*.cpp") @@ -316,7 +346,29 @@ std::vector> PackageProvider::getPackages(Package::Cont } ``` -### 4.运行 +### 4.在 ArkTs 侧引入 SharedElementPackage + +打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： + +```ts +import type {RNPackageContext, RNPackage} from 'rnoh/ts'; +import {SamplePackage} from 'rnoh-sample-package/ts'; + +// V0.8.9 ++ import { SharedElementPackage } from '@react-native-oh-tpl/react-native-shared-element'; + +// V0.9.1 ++ import { SharedElementPackage } from '@react-native-ohos/react-native-shared-element'; + +export function createRNPackages(ctx: RNPackageContext): RNPackage[] { + return [ + new SamplePackage(ctx), ++ new SharedElementPackage(ctx) + ]; +} +``` + +### 5.运行 点击右上角的 `sync` 按钮 @@ -335,7 +387,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-shared-element Releases](https://github.com/react-native-oh-library/react-native-shared-element/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.8.9 | [@react-native-oh-tpl/react-native-shared-element Releases](https://github.com/react-native-oh-library/react-native-shared-element/releases) | 0.72 | +| 0.9.1 | [@react-native-ohos/react-native-shared-element Releases]() | 0.77 | ## 组件 diff --git a/zh-cn/react-native-snap-carousel.md b/zh-cn/react-native-snap-carousel.md index 644cdc665d0580ed90dd203fed601cd7dbef755a..c0c910f8a1c061ebead31e744fe4c1323ad2d93a 100644 --- a/zh-cn/react-native-snap-carousel.md +++ b/zh-cn/react-native-snap-carousel.md @@ -16,7 +16,13 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-library/react-native-snap-carousel Releases](https://github.com/react-native-oh-library/react-native-snap-carousel/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.9.1-0.1.3 |[@react-native-oh-tpl/react-native-snap-carousel Releases](https://github.com/react-native-oh-library/react-native-snap-carousel/releases)| 0.72 | +| 3.9.2-rc.1 |[@react-native-ohos/react-native-snap-carousel Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,12 +31,20 @@ #### **npm** ```bash +# V3.9.1-0.1.3 npm install @react-native-oh-tpl/react-native-snap-carousel + +# V3.9.2-rc.1 +npm install @react-native-ohos/react-native-snap-carousel ``` #### **yarn** ```bash +# V3.9.1-0.1.3 yarn add @react-native-oh-tpl/react-native-snap-carousel + +# V3.9.2-rc.1 +yarn add @react-native-ohos/react-native-snap-carousel ``` @@ -119,7 +133,13 @@ const styles = StyleSheet.create({ 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-library/react-native-snap-carousel Releases](https://github.com/react-native-oh-library/react-native-snap-carousel/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.9.1-0.1.3 |[@react-native-oh-tpl/react-native-fast-image Releases](https://github.com/react-native-oh-library/react-native-fast-image/releases)| 0.72 | +| 3.9.2-rc.1 |[@react-native-ohos/react-native-fast-image Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 ## 属性 diff --git a/zh-cn/react-native-sortable-list.md b/zh-cn/react-native-sortable-list.md index 845e71405aecdfb79d49d2cc9414af668783a50a..faf787d2dbf29e23abc1743b2430d422795101e6 100644 --- a/zh-cn/react-native-sortable-list.md +++ b/zh-cn/react-native-sortable-list.md @@ -17,7 +17,12 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-sortabel-list Releases](https://github.com/react-native-oh-library/react-native-sortable-list/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.0.25 | [@react-native-oh-tpl/react-native-sortabel-list Releases](https://github.com/react-native-oh-library/react-native-sortable-list/releases) | 0.72 | +| 0.0.26 | [@react-native-ohos/react-native-sortabel-list Releases]() | 0.77 | 进入到工程目录并输入以下命令： @@ -26,13 +31,19 @@ #### **npm** ```bash +#v0.0.25 npm install @react-native-oh-tpl/react-native-sortable-list +#v0.0.26 +npm install @react-native-ohos/react-native-sortable-list ``` #### **yarn** ```bash +#v0.0.25 yarn add @react-native-oh-tpl/react-native-sortable-list +#v0.0.26 +yarn add @react-native-ohos/react-native-sortable-list ``` @@ -233,9 +244,12 @@ const styles = StyleSheet.create({ 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-sortabel-list Releases](https://github.com/react-native-oh-library/react-native-sortable-list/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： -## 属性 +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.0.25 | [@react-native-oh-tpl/react-native-sortabel-list Releases](https://github.com/react-native-oh-library/react-native-sortable-list/releases) | 0.72 | +| 0.0.26 | [@react-native-ohos/react-native-sortabel-list Releases]() | 0.77 | > [!TIP] "Platform"列表示该属性在原三方库上支持的平台。 diff --git a/zh-cn/react-native-sqlite-storage.md b/zh-cn/react-native-sqlite-storage.md index 305b2232b5528bdad4c8e0a0c66a927f41c5214d..715bfb25024c7e94cae639499dbe6bd97b6f8f1c 100644 --- a/zh-cn/react-native-sqlite-storage.md +++ b/zh-cn/react-native-sqlite-storage.md @@ -17,7 +17,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-sqlite-storage Releases](https://github.com/react-native-oh-library/react-native-sqlite-storage/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 6.0.1 | [@react-native-oh-tpl/react-native-sqlite-storage Releases](https://github.com/react-native-oh-library/react-native-sqlite-storage/releases) | 0.72 | +| 6.0.2 | [@react-native-ohos/react-native-sqlite-storage Releases]() | 0.77 | + + 对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -26,13 +33,21 @@ #### **npm** ```bash +#6.0.1 npm install @react-native-oh-tpl/react-native-sqlite-storage + +#6.0.2 +npm install @react-native-ohos/react-native-sqlite-storage ``` #### **yarn** ```bash +#6.0.1 yarn add @react-native-oh-tpl/react-native-sqlite-storage + +#6.0.2 +yarn add @react-native-ohos/react-native-sqlite-storage ``` 下面的代码展示了这个库的基本使用场景： @@ -528,6 +543,8 @@ export default SQLiteDemo; ## 使用 Codegen +> [!TIP] V6.0.2 不需要执行 Codegen。 + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -560,6 +577,8 @@ export default SQLiteDemo; 打开 `entry/oh-package.json5`，添加以下依赖 +- V6.0.1 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -567,6 +586,14 @@ export default SQLiteDemo; } ``` +- V6.0.2 + +```json +"dependencies": { +"@rnoh/react-native-openharmony": "file:../react_native_openharmony", "@react-native-ohos/react-native-sqlite-storage": "file:../../node_modules/@react-native-ohos/react-native-sqlite-storage/platforms/harmony/sqlite_storage.har" +} +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -587,8 +614,12 @@ ohpm install ```diff ... +//6.0.1 + import {SQLitePluginPackage} from '@react-native-oh-tpl/react-native-sqlite-storage/ts'; +//6.0.2 ++ import {SQLitePluginPackage} from '@react-native-ohos/react-native-sqlite-storage/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -597,7 +628,69 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 4.配置 CMakeLists 和引入 SqliteStoragePackage + +> [!TIP] V6.0.2 需要执行 + +打开 `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-sqlite-storage/src/main/cpp" ./sqlite_storage) + +# 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_sqlite_storage) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +```diff +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "SqliteStoragePackage.h" + +using namespace rnoh; + +std::vector> PackageProvider::getPackages(Package::Context ctx) { + return { + std::make_shared(ctx), + std::make_shared(ctx), ++ std::make_shared(ctx), + }; +} +``` + +### 5.运行 点击右上角的 `sync` 按钮 @@ -614,7 +707,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-sqlite-storage Releases](https://github.com/react-native-oh-library/react-native-sqlite-storage/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 6.0.1 | [@react-native-oh-tpl/react-native-sqlite-storage Releases](https://github.com/react-native-oh-library/react-native-sqlite-storage/releases) | 0.72 | +| 6.0.2 | [@react-native-ohos/react-native-sqlite-storage Releases]() | 0.77 | ## 静态方法 diff --git a/zh-cn/react-native-stickyheader.md b/zh-cn/react-native-stickyheader.md index dc56fa908b84732cf53a8fcca8196d8800849b06..167c59280af6d6cdcbb65e866d17f0632041af7e 100644 --- a/zh-cn/react-native-stickyheader.md +++ b/zh-cn/react-native-stickyheader.md @@ -18,7 +18,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-stickyheader Releases](https://github.com/react-native-oh-library/react-native-stickyheader/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.1.3 | [@react-native-oh-tpl/react-native-stickyheader Releases](https://github.com/react-native-oh-library/react-native-stickyheader/releases) | 0.72 | +| 1.1.4 | [@react-native-ohos/react-native-stickyheader Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -27,13 +34,19 @@ #### **npm** ```bash +#v1.1.3 npm install @react-native-oh-tpl/react-native-stickyheader +#v1.1.4 +npm install @react-native-ohos/react-native-stickyheader ``` #### **yarn** ```bash +#v1.1.3 yarn add @react-native-oh-tpl/react-native-stickyheader +#v1.1.4 +yarn add @react-native-ohos/react-native-stickyheader ``` @@ -145,4 +158,3 @@ export default App; 本项目基于 [The MIT License (MIT)](https://github.com/jiasongs/react-native-stickyheader/blob/master/LICENSE) ，请自由地享受和参与开源。 - diff --git a/zh-cn/react-native-swipe-list-view.md b/zh-cn/react-native-swipe-list-view.md index a65331a0d1691b07bcfb26fc67caf4503182caa1..dfe946402f13647782c1f2676b0cdec9013468cc 100644 --- a/zh-cn/react-native-swipe-list-view.md +++ b/zh-cn/react-native-swipe-list-view.md @@ -18,7 +18,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-swipe-list-view Releases](https://github.com/react-native-oh-library/react-native-swipe-list-view/releases/) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.2.9 | [@react-native-oh-tpl/react-native-swipe-list-view Releases](https://github.com/react-native-oh-library/react-native-swipe-list-view/releases/) | 0.72 | +| 3.3.0 | [@react-native-ohos/react-native-swipe-list-view Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -27,13 +34,19 @@ #### **npm** ```bash +#v3.2.9 npm install --save @react-native-oh-tpl/react-native-swipe-list-view +#v3.3.0 +npm install --save @react-native-ohos/react-native-swipe-list-view ``` #### **yarn** ```bash +#v3.2.9 yarn add @react-native-oh-tpl/react-native-swipe-list-view +#v3.3.0 +yarn add @react-native-ohos/react-native-swipe-list-view ``` @@ -211,7 +224,12 @@ const styles = StyleSheet.create({ 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-swipe-list-view Releases](https://github.com/react-native-oh-library/react-native-swipe-list-view/releases/) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.2.9 | [@react-native-oh-tpl/react-native-swipe-list-view Releases](https://github.com/react-native-oh-library/react-native-swipe-list-view/releases/) | 0.72 | +| 3.3.0 | [@react-native-ohos/react-native-swipe-list-view Releases]() | 0.77 | ## 属性 @@ -341,4 +359,3 @@ const styles = StyleSheet.create({ 本项目基于 [The MIT License (MIT)](https://github.com/jemise111/react-native-swipe-list-view/blob/master/LICENSE) ，请自由地享受和参与开源。 - diff --git a/zh-cn/react-native-switch-pro.md b/zh-cn/react-native-switch-pro.md index d345bd64c8ab99cc96013596d6b1eb7b75e7fe01..f7980f88fe338b6db977b83669d9e24bbe85f7da 100644 --- a/zh-cn/react-native-switch-pro.md +++ b/zh-cn/react-native-switch-pro.md @@ -17,7 +17,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-switch-pro Releases](https://github.com/react-native-oh-library/react-native-switch-pro/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.0.5 | [@react-native-oh-tpl/react-native-switch-pro Releases](https://github.com/react-native-oh-library/react-native-switch-pro/releases) | 0.72 | +| 1.0.6 | [@react-native-ohos/react-native-switch-pro Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-switch-pro) | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包 进入到工程目录并输入以下命令： @@ -26,13 +33,21 @@ #### **npm** ```bash +# V1.0.5 npm install @react-native-oh-tpl/react-native-switch-pro + +# V1.0.6 +npm install @react-native-ohos/react-native-switch-pro ``` #### **yarn** ```bash +# V1.0.5 yarn add @react-native-oh-tpl/react-native-switch-pro + +# V1.0.6 +yarn add @react-native-ohos/react-native-switch-pro ``` @@ -60,7 +75,14 @@ import Switch from 'react-native-switch-pro' 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-switch-pro Releases](https://github.com/react-native-oh-library/react-native-switch-pro/releases) +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.0.5 | [@react-native-oh-tpl/react-native-switch-pro Releases](https://github.com/react-native-oh-library/react-native-switch-pro/releases) | 0.72 | +| 1.0.6 | [@react-native-ohos/react-native-switch-pro Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-switch-pro) | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包 本文档内容基于以下版本验证通过： diff --git a/zh-cn/react-native-text-size.md b/zh-cn/react-native-text-size.md index 263042e60bada3bb6042dc4bdf64ca98977642df..d3d9d3508e28afa8bceb93d886e6d7d3f80a3349 100644 --- a/zh-cn/react-native-text-size.md +++ b/zh-cn/react-native-text-size.md @@ -17,7 +17,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-text-size Releases](https://github.com/react-native-oh-library/react-native-text-size/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.0.0 | [@react-native-oh-tpl/react-native-text-size Releases](https://github.com/react-native-oh-library/react-native-text-size/releases) | 0.72 | +| 4.0.1 | [@react-native-ohos/react-native-text-size Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 + 进入到工程目录并输入以下命令： @@ -26,13 +33,21 @@ #### **npm** ```bash +# V4.0.0 npm install @react-native-oh-tpl/react-native-text-size + +# V4.0.1 +npm install @react-native-ohos/react-native-text-size ``` #### **yarn** ```bash +# V4.0.0 yarn add @react-native-oh-tpl/react-native-text-size + +# V4.0.1 +yarn add @react-native-ohos/react-native-text-size ``` @@ -187,6 +202,12 @@ export default function TextSizeExample() { } ``` +## 使用 Codegen + +> [!TIP] V4.0.1 不需要执行 Codegen。 + +本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](https://gitee.com/react-native-oh-library/usage-docs/blob/39316eccca7657d77dfdc9e90cfbf64e6a7713f3/zh-cn/codegen.md)。 + ## Link 目前 HarmonyOS 暂不支持 AutoLink，所以 Link 步骤需要手动配置。 @@ -216,13 +237,20 @@ export default function TextSizeExample() { > [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。 打开 `entry/oh-package.json5`，添加以下依赖 - +- V4.0.0 ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", "@react-native-oh-tpl/react-native-text-size": "file:../../node_modules/@react-native-oh-tpl/react-native-text-size/harmony/text_size.har" } ``` +- V4.0.1 +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-oh-tpl/react-native-text-size": "file:../../node_modules/@react-native-ohos/react-native-text-size/harmony/text_size.har" + } +``` 点击右上角的 `sync` 按钮 @@ -259,7 +287,11 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) +# V4.0.0 + add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-text-size/src/main/cpp" ./text-size) + +# V4.0.1 ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-text-size/src/main/cpp" ./text-size) # RNOH_END: manual_package_linking_1 add_library(rnoh_app SHARED @@ -297,8 +329,11 @@ std::vector> PackageProvider::getPackages(Package::Cont ```diff ... + // V4.0.0 + import { RNTextSizePackage } from '@react-native-oh-tpl/react-native-text-size/ts'; + // V4.0.1 ++ import { RNTextSizePackage } from '@react-native-ohos/react-native-text-size/ts'; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ ... @@ -326,7 +361,13 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-text-size Releases](https://github.com/react-native-oh-library/react-native-text-size/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.0.0 | [@react-native-oh-tpl/react-native-text-size Releases](https://github.com/react-native-oh-library/react-native-text-size/releases) | 0.72 | +| 4.0.1 | [@react-native-ohos/react-native-text-size Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 ## API diff --git a/zh-cn/react-native-textinput-maxlength-fixed.md b/zh-cn/react-native-textinput-maxlength-fixed.md index 0bbdd421513a7aca8255f5e39b300278d888a5d3..ab90c971ae6f8c3f2c45979b18642c8145ce4ae8 100644 --- a/zh-cn/react-native-textinput-maxlength-fixed.md +++ b/zh-cn/react-native-textinput-maxlength-fixed.md @@ -15,7 +15,13 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-textinput-maxlength-fixed Releases](https://github.com/react-native-oh-library/react-native-textinput-maxlength-fixed/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.1.2 | [@react-native-oh-tpl/react-native-textinput-maxlength-fixed Releases](https://github.com/react-native-oh-library/react-native-textinput-maxlength-fixed/releases) | 0.72 | +| 0.1.3 | [@react-native-ohos/react-native-textinput-maxlength-fixed Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -24,13 +30,19 @@ #### **npm** ```bash +# 0.1.2 npm install @react-native-oh-tpl/react-native-textinput-maxlength-fixed +# 0.1.3 +npm install @react-native-ohos/react-native-textinput-maxlength-fixed ``` #### **yarn** ```bash +# 0.1.2 yarn add @react-native-oh-tpl/react-native-textinput-maxlength-fixed +# 0.1.3 +yarn add @react-native-ohos/react-native-textinput-maxlength-fixed ``` @@ -82,6 +94,8 @@ const styles = StyleSheet.create({ ## 使用 Codegen +> [!TIP] V0.1.3 for RN0.77 不需要执行 Codegen。 + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -117,12 +131,21 @@ const styles = StyleSheet.create({ 打开 `entry/oh-package.json5`，添加以下依赖 +- V0.1.2 ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", "@react-native-oh-tpl/react-native-textinput-maxlength-fixed": "file:../../node_modules/@react-native-oh-tpl/react-native-textinput-maxlength-fixed/harmony/textinput_maxlength_fixed.har" } ``` + +- V0.1.3 +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-textinput-maxlength-fixed": "file:../../node_modules/@react-native-ohos/react-native-textinput-maxlength-fixed/harmony/textinput_maxlength_fixed.har" + } +``` 点击右上角的 `sync` 按钮 方法二：直接链接源码 @@ -137,7 +160,10 @@ const styles = StyleSheet.create({ import { RNPackageContext, RNPackage } from '@rnoh/react-native-openharmony'; import { SampleTurboModulePackage } from '../TurboModule/SampleTurboModulePackage'; import { ViewPagerPackage } from '@react-native-oh-tpl/react-native-pager-view/ts'; +// V0.1.2 +import { RNTextinputMaxlengthFixedPackage } from "@react-native-oh-tpl/react-native-textinput-maxlength-fixed/ts"; +// V0.1.3 ++import { RNTextinputMaxlengthFixedPackage } from "@react-native-ohos/react-native-textinput-maxlength-fixed/ts"; export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ @@ -153,7 +179,13 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-textinput-maxlength-fixed Releases](https://github.com/react-native-oh-library/react-native-textinput-maxlength-fixed/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.1.2 | [@react-native-oh-tpl/react-native-textinput-maxlength-fixed Releases](https://github.com/react-native-oh-library/react-native-textinput-maxlength-fixed/releases) | 0.72 | +| 0.1.3 | [@react-native-ohos/react-native-textinput-maxlength-fixed Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 ## API diff --git a/zh-cn/react-native-transitiongroup.md b/zh-cn/react-native-transitiongroup.md index c3b65569b69fd6debc7caa7e63c2a587e2907575..949179a8bd64bfff77b2f5e1b0011a1e65951733 100644 --- a/zh-cn/react-native-transitiongroup.md +++ b/zh-cn/react-native-transitiongroup.md @@ -17,7 +17,13 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-transitiongroup Releases](https://github.com/react-native-oh-library/react-native-transitiongroup/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.2.0 | [@react-native-oh-tpl/react-native-transitiongroup Releases](https://github.com/react-native-oh-library/react-native-transitiongroup/releases) | 0.72 | +| 1.2.1 | [@react-native-ohos/react-native-transitiongroup Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -26,12 +32,20 @@ #### **npm** ```bash +# V1.2.0 +npm install @react-native-oh-tpl/react-native-transitiongroup + +# V1.2.1 npm install @react-native-oh-tpl/react-native-transitiongroup ``` #### **yarn** ```bash +# V1.2.0 +yarn add @react-native-oh-tpl/react-native-transitiongroup + +# V1.2.1 yarn add @react-native-oh-tpl/react-native-transitiongroup ``` @@ -146,7 +160,12 @@ const styles = StyleSheet.create({ 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-transitiongroup Releases](https://github.com/react-native-oh-library/react-native-transitiongroup/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.2.0 | [@react-native-oh-tpl/react-native-transitiongroup Releases](https://github.com/react-native-oh-library/react-native-transitiongroup/releases) | 0.72 | +| 1.2.1 | [@react-native-ohos/react-native-transitiongroup Releases]() | 0.77 | + ## API diff --git a/zh-cn/react-native-tts.md b/zh-cn/react-native-tts.md index 9c6b9d3e21746463b49140e5cd80d1178278ade5..00a47dfd32b9e8118c94d49c73c74fcebe251354 100644 --- a/zh-cn/react-native-tts.md +++ b/zh-cn/react-native-tts.md @@ -18,7 +18,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-tts Releases](https://github.com/react-native-oh-library/react-native-tts/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.1.1 | [@react-native-oh-tpl/react-native-tts Releases](https://github.com/react-native-oh-library/react-native-tts/releases) | 0.72 | +| 4.1.2 | [@react-native-ohos/react-native-tts Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -27,13 +34,21 @@ #### **npm** ```bash +# V4.1.1 npm install @react-native-oh-tpl/react-native-tts + +# V4.1.2 +npm install @react-native-ohos/react-native-tts ``` #### **yarn** ```bash +# V4.1.1 yarn add @react-native-oh-tpl/react-native-tts + +# V4.1.2 +yarn add @react-native-ohos/react-native-tts ``` @@ -214,6 +229,8 @@ const styles = StyleSheet.create({ 打开 `entry/oh-package.json5`，添加以下依赖 +- V4.1.1 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -221,6 +238,15 @@ const styles = StyleSheet.create({ } ``` +- V4.1.2 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-tts": "file:../../node_modules/@react-native-ohos/react-native-tts/harmony/rn_tts.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -241,8 +267,12 @@ ohpm install ```diff ... +// V4.1.1 + import { RNTTSPackage } from '@react-native-oh-tpl/react-native-tts/ts'; +// V4.1.2 ++ import { RNTTSPackage } from '@react-native-ohos/react-native-tts/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -270,7 +300,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-tts Releases](https://github.com/react-native-oh-library/react-native-tts/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.1.1 | [@react-native-oh-tpl/react-native-tts Releases](https://github.com/react-native-oh-library/react-native-tts/releases) | 0.72 | +| 4.1.2 | [@react-native-ohos/react-native-tts Releases]() | 0.77 | ## 静态方法 diff --git a/zh-cn/react-native-typography.md b/zh-cn/react-native-typography.md index 2203e19791e20283f6a372ed148d4e768afb74cf..1d2972b8cdd6b2aaf4d85f77a932b9a8f8fd677e 100644 --- a/zh-cn/react-native-typography.md +++ b/zh-cn/react-native-typography.md @@ -16,7 +16,12 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-typography Releases](https://github.com/react-native-oh-library/react-native-typography/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.4.1 | [react-native-oh-tpl/react-native-typography Releases](https://github.com/react-native-oh-library/react-native-typography/releases) | 0.72 | +| 1.4.2 | [@react-native-ohos/react-native-typography Releases]() | 0.77 | 进入到工程目录并输入以下命令： @@ -25,13 +30,19 @@ #### **npm** ```bash +#v1.4.1 npm install @react-native-oh-tpl/react-native-typography +#v1.4.2 +npm install @react-native-ohos/react-native-typography ``` #### **yarn** ```bash +#v1.4.1 yarn add @react-native-oh-tpl/react-native-typography +#v1.4.2 +yarn add @react-native-ohos/react-native-typography ``` @@ -62,7 +73,12 @@ export function TypographyExample1() { 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-typography Releases](https://github.com/react-native-oh-library/react-native-typography/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 1.4.1 | [react-native-oh-tpl/react-native-typography Releases](https://github.com/react-native-oh-library/react-native-typography/releases) | 0.72 | +| 1.4.2 | [@react-native-ohos/react-native-typography Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-udp.md b/zh-cn/react-native-udp.md index 78e185ee9ea56ad0d904f86fdc6accbe214c8ee0..f2bfad9b860fbf7bc9bd554630b4eb2393ff755e 100644 --- a/zh-cn/react-native-udp.md +++ b/zh-cn/react-native-udp.md @@ -18,20 +18,35 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-udp Releases](https://github.com/react-native-oh-library/react-native-udp/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.1.7 | [@react-native-oh-tpl/react-native-udp Releases](https://github.com/react-native-oh-library/react-native-udp/releases) | 0.72 | +| 4.1.8 | [@react-native-ohos/react-native-udp Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： #### **npm** ```bash +# V4.1.7 npm install @react-native-oh-tpl/react-native-udp + +# V4.1.8 +npm install @react-native-ohos/react-native-udp ``` #### **yarn** ```bash +# V4.1.7 yarn add @react-native-oh-tpl/react-native-udp + +# V4.1.8 +yarn add @react-native-ohos/react-native-udp ``` 下面的代码展示了这个库的基本使用场景： @@ -158,6 +173,10 @@ export default App; ## 使用 Codegen +> [!TIP] V4.1.8 不需要执行 Codegen。 + + + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -190,6 +209,8 @@ export default App; 打开 `entry/oh-package.json5`，添加以下依赖 +- V4.1.7 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -197,6 +218,15 @@ export default App; } ``` +- V4.1.8 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-udp": "file:../../node_modules/@react-native-ohos/react-native-udp/harmony/react_native_udp.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -212,15 +242,80 @@ ohpm install -### 3.在 ArkTs 侧引入 RNUdpPackage +### 3.配置 CMakeLists 和引入 UdpPackage + +> [!TIP] 若使用的是 4.1.7 版本，请跳过本章。 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +``` +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-udp/src/main/cpp" ./udp) +# 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_udp) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +``` +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "UdpPackage.h" + +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 侧引入 RNUdpPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... +// V4.1.7 + import {RNUdpPackage} from '@react-native-oh-tpl/react-native-udp/ts'; +// V4.1.8 ++ import {RNUdpPackage} from '@react-native-ohos/react-native-udp/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -229,7 +324,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 5.运行 点击右上角的 `sync` 按钮 @@ -248,9 +343,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-udp Releases](https://github.com/react-native-oh-library/react-native-udp/releases) - +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 4.1.7 | [@react-native-oh-tpl/react-native-udp Releases](https://github.com/react-native-oh-library/react-native-udp/releases) | 0.72 | +| 4.1.8 | [@react-native-ohos/react-native-udp Releases]() | 0.77 | ## API diff --git a/zh-cn/react-native-version-number.md b/zh-cn/react-native-version-number.md index 48f8a62026500c8eba79c38e5a84a232d70327eb..0d1b5015ac0c494078ec7f919890d5f2d382ca6a 100644 --- a/zh-cn/react-native-version-number.md +++ b/zh-cn/react-native-version-number.md @@ -18,7 +18,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-version-number Releases](https://github.com/react-native-oh-library/react-native-version-number/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.3.6 | [@react-native-oh-tpl/react-native-version-number Releases](https://github.com/react-native-oh-library/react-native-version-number/releases) | 0.72 | +| 0.3.7 | [@react-native-ohos/react-native-version-number Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -27,13 +34,21 @@ #### **npm** ```bash +# V0.3.6 npm install @react-native-oh-tpl/react-native-version-number + +# V0.3.7 +npm install @react-native-ohos/react-native-version-number ``` #### **yarn** ```bash +# V0.3.6 yarn add @react-native-oh-tpl/react-native-version-number + +# V0.3.7 +yarn add @react-native-ohos/react-native-version-number ``` @@ -91,6 +106,8 @@ export default function () { 打开 `entry/oh-package.json5`，添加以下依赖 +- V0.3.6 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -99,6 +116,16 @@ export default function () { } ``` +- V0.3.7 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + + "@react-native-ohos/react-native-version-number": "file:../../node_modules/@react-native-ohos/react-native-version-number/harmony/rnoh_version_number.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -118,8 +145,12 @@ ohpm install ```diff ... +// V0.3.6 + import {RNVersionNumberPackage} from '@react-native-oh-tpl/react-native-version-number/ts'; +// V0.3.7 ++ import {RNVersionNumberPackage} from '@react-native-ohos/react-native-version-number/ts'; + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -147,7 +178,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-version-number Releases](https://github.com/react-native-oh-library/react-native-version-number/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.3.6 | [@react-native-oh-tpl/react-native-version-number Releases](https://github.com/react-native-oh-library/react-native-version-number/releases) | 0.72 | +| 0.3.7 | [@react-native-ohos/react-native-version-number Releases]() | 0.77 | ## API diff --git a/zh-cn/react-native-view-pdf.md b/zh-cn/react-native-view-pdf.md index b9d97e1f562a10077f101fb8e09059ec33d3a6c8..b9098b59a9bb03e771cdf5db907739cfe2ae8882 100644 --- a/zh-cn/react-native-view-pdf.md +++ b/zh-cn/react-native-view-pdf.md @@ -16,7 +16,14 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-view-pdf Releases](https://github.com/react-native-oh-library/react-native-PDFView/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.14.0 | [@react-native-oh-tpl/react-native-view-pdf Releases](https://github.com/react-native-oh-library/react-native-PDFView/releases) | 0.72 | +| 0.14.1 | [@react-native-ohos/react-native-view-pdf Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,13 +32,21 @@ #### **npm** ```bash +# V0.14.0 npm install @react-native-oh-tpl/react-native-view-pdf + +# V0.14.1 +npm install @react-native-ohos/react-native-view-pdf ``` #### **yarn** ```bash +# V0.14.0 yarn add @react-native-oh-tpl/react-native-view-pdf + +# V0.14.1 +yarn add @react-native-ohos/react-native-view-pdf ``` @@ -60,6 +75,10 @@ export function PdfViewExample() { ## 使用 Codegen +> [!TIP] V0.14.1 不需要执行 Codegen。 + + + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -92,6 +111,8 @@ export function PdfViewExample() { 打开 `entry/oh-package.json5`，添加以下依赖 +- V0.14.0 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -99,6 +120,15 @@ export function PdfViewExample() { } ``` +- V0.14.1 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-view-pdf": "file:../../node_modules/@react-native-ohos/react-native-view-pdf/harmony/pdf_view.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -118,8 +148,12 @@ ohpm install ```diff ... +// V0.14.0 + import { RNPDFView } from '@react-native-oh-tpl/react-native-view-pdf' +// V0.14.1 ++ import { RNPDFView } from '@react-native-ohos/react-native-view-pdf' + @Builder export function buildCustomRNComponent(ctx: ComponentBuilderContext) { ... @@ -147,14 +181,79 @@ const arkTsComponentNames: Array = [ ]; ``` -### 4.在 ArkTs 侧引入 PDFViewPackage +### 4.配置 CMakeLists 和引入 ViewPdfPackage + +> [!TIP] 若使用的是 0.14.0 版本，请跳过本章。 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +``` +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-view-pdf/src/main/cpp" ./pdf_view) +# 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_pdf_view) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +``` +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "ViewPdfPackage.h" + +using namespace rnoh; + +std::vector> PackageProvider::getPackages(Package::Context ctx) { + return { + std::make_shared(ctx), + std::make_shared(ctx), ++ std::make_shared(ctx), + }; +} +``` + +### 5.在 ArkTs 侧引入 PDFViewPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... +// V0.14.0 + import { PDFViewPackage } from '@react-native-oh-tpl/react-native-view-pdf/ts' +// V0.14.1 ++ import { PDFViewPackage } from '@react-native-ohos/react-native-view-pdf/ts' + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -163,7 +262,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 5.运行 +### 6.运行 点击右上角的 `sync` 按钮 @@ -180,7 +279,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/react-native-view-pdf Releases](https://github.com/react-native-oh-library/react-native-PDFView/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 0.14.0 | [@react-native-oh-tpl/react-native-view-pdf Releases](https://github.com/react-native-oh-library/react-native-PDFView/releases) | 0.72 | +| 0.14.1 | [@react-native-ohos/react-native-view-pdf Releases]() | 0.77 | ## 属性 diff --git a/zh-cn/react-native-view-shot.md b/zh-cn/react-native-view-shot.md index d77e54b6e19c25a848ded0a80e049ff5e122b9ec..b9061f765d50779fe2aafee779b6f79f2317774f 100644 --- a/zh-cn/react-native-view-shot.md +++ b/zh-cn/react-native-view-shot.md @@ -16,7 +16,12 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/react-native-view-shot Releases](https://github.com/react-native-oh-library/react-native-view-shot/releases) 。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.8.0 | [@react-native-oh-tpl/react-native-view-shot Releases](https://github.com/react-native-oh-library/react-native-view-shot/releases) | 0.72 | +| 3.8.1 | [@react-native-ohos/react-native-view-shot Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 进入到工程目录并输入以下命令： @@ -25,13 +30,21 @@ #### **npm** ```bash +# V3.8.0 npm install @react-native-oh-tpl/react-native-view-shot + +# V3.8.1 +npm install @react-native-ohos/react-native-view-shot ``` #### **yarn** ```bash +# V3.8.0 yarn add @react-native-oh-tpl/react-native-view-shot + +# V3.8.1 +yarn add @react-native-ohos/react-native-view-shot ``` @@ -139,7 +152,7 @@ export function ViewShotDemo() { > [!TIP] har 包位于三方库安装路径的 `harmony` 文件夹下。 打开 `entry/oh-package.json5`，添加以下依赖 - + - V3.8.0 ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -147,7 +160,14 @@ export function ViewShotDemo() { "@react-native-oh-tpl/react-native-view-shot": "file:../../node_modules/@react-native-oh-tpl/react-native-view-shot/harmony/view_shot.har" } ``` + - V3.8.1 +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/react-native-view-shot": "file:../../node_modules/@react-native-ohos/react-native-view-shot/harmony/view_shot.har" + } +``` 点击右上角的 `sync` 按钮 或者在终端执行： @@ -176,7 +196,13 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn) # RNOH_BEGIN: manual_package_linking_1 add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package) + +# V3.8.0 + add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-view-shot/src/main/cpp" ./view-shot) + +# V3.8.1 ++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-view-shot/src/main/cpp" ./view-shot) + # RNOH_BEGIN: manual_package_linking_1 add_library(rnoh_app SHARED @@ -212,7 +238,7 @@ std::vector> PackageProvider::getPackages(Package::Cont ### 4.在 ArkTs 侧引入 ViewShotPackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： - +- V3.8.0 ```diff ... + import { ViewShotPackage } from '@react-native-oh-tpl/react-native-view-shot/ts'; @@ -224,6 +250,20 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { ]; } ``` + +- V3.8.1 +```diff + ... ++ import { ViewShotPackage } from '@react-native-ohos/react-native-view-shot/ts'; + +export function createRNPackages(ctx: RNPackageContext): RNPackage[] { + return [ + new SamplePackage(ctx), ++ new ViewShotPackage(ctx), + ]; +} +``` + ### 5.运行 点击右上角的 `sync` 按钮 @@ -243,7 +283,13 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/view-shot Releases](https://github.com/react-native-oh-library/react-native-view-shot/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.8.0 | [@react-native-oh-tpl/react-native-view-shot Releases](https://github.com/react-native-oh-library/react-native-view-shot/releases) | 0.72 | +| 3.8.1 | [@react-native-ohos/react-native-view-shot Releases]() | 0.77 | + +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 ## 属性 diff --git a/zh-cn/react-native-voice-voice.md b/zh-cn/react-native-voice-voice.md index 49076faf02341d64b44ca192810d1ee866afe9fb..a67c6827aea92b24950d196318d64acd635ef060 100644 --- a/zh-cn/react-native-voice-voice.md +++ b/zh-cn/react-native-voice-voice.md @@ -16,24 +16,37 @@ ## 安装与使用 -请到三方库的 Releases 发布地址查看配套的版本信息：[@react-native-oh-tpl/voice Releases](https://github.com/react-native-oh-library/voice/releases)。对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +请到三方库的 Releases 发布地址查看配套的版本信息： -进入到工程目录并输入以下命令： +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.2.4 | [@react-native-oh-tpl/voice Releases](https://github.com/react-native-oh-library/voice/releases) | 0.72 | +| 3.2.5 | [@react-native-ohos/voice Releases]() | 0.77 | +对于未发布到npm的旧版本，请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。 +进入到工程目录并输入以下命令： #### **npm** ```bash +# V3.2.4 npm install @react-native-oh-tpl/voice + +# V3.2.5 +npm install @react-native-ohos/voice ``` #### **yarn** ```bash +# V3.2.4 yarn add @react-native-oh-tpl/voice + +# V3.2.5 +yarn add @react-native-ohos/voice ``` @@ -361,6 +374,8 @@ export default VoiceTest; ``` ## 使用 Codegen +> [!TIP] V3.2.5 不需要执行Codegen + 本库已经适配了 `Codegen` ，在使用前需要主动执行生成三方库桥接代码，详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。 ## Link @@ -393,6 +408,8 @@ export default VoiceTest; 打开 `entry/oh-package.json5`，添加以下依赖 +- V3.2.4 + ```json "dependencies": { "@rnoh/react-native-openharmony": "file:../react_native_openharmony", @@ -400,6 +417,15 @@ export default VoiceTest; } ``` +- V3.2.5 + +```json +"dependencies": { + "@rnoh/react-native-openharmony": "file:../react_native_openharmony", + "@react-native-ohos/voice": "file:../../node_modules/@react-native-ohos/voice/harmony/voice.har" + } +``` + 点击右上角的 `sync` 按钮 或者在终端执行： @@ -413,15 +439,79 @@ ohpm install > [!TIP] 如需使用直接链接源码，请参考[直接链接源码说明](/zh-cn/link-source-code.md) -### 3.在 ArkTs 侧引入 RNVoicePackage +### 3.配置CMakeLists 和引入 VoicePackage + +> [!TIP] 若使用的是 3.2.4 版本，请跳过本章 + +打开 `entry/src/main/cpp/CMakeLists.txt`，添加： + +```cmake +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/voice/src/main/cpp" ./voice) +# 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_voice) +# RNOH_END: manual_package_linking_2 +``` + +打开 `entry/src/main/cpp/PackageProvider.cpp`，添加： + +```c++ +#include "RNOH/PackageProvider.h" +#include "generated/RNOHGeneratedPackage.h" +#include "SamplePackage.h" ++ #include "VoicePackage.h" + +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 侧引入 RNVoicePackage 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加： ```diff ... - +// V3.2.4 + import { RNVoicePackage } from '@react-native-oh-tpl/voice/ts' +// V3.2.5 ++ import { RNVoicePackage } from '@react-native-ohos/voice/ts' + export function createRNPackages(ctx: RNPackageContext): RNPackage[] { return [ new SamplePackage(ctx), @@ -430,7 +520,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] { } ``` -### 4.运行 +### 5.运行 点击右上角的 `sync` 按钮 @@ -449,7 +539,12 @@ ohpm install 要使用此库，需要使用正确的 React-Native 和 RNOH 版本。另外，还需要使用配套的 DevEco Studio 和 手机 ROM。 -请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息：[@react-native-oh-tpl/voice Releases](https://github.com/react-native-oh-library/voice/releases) +请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息： + +| 三方库版本 | 发布信息 | 支持RN版本 | +| ---------- | ------------------------------------------------------------ | ---------- | +| 3.2.4 | [@react-native-oh-tpl/voice Releases](https://github.com/react-native-oh-library/voice/releases) | 0.72 | +| 3.2.5 | [@react-native-ohos/voice Releases]() | 0.77 | ### 权限要求 由于此库涉及语音识别会使用到系统录音功能，使用时需要配置对应的权限，权限需配置在entry/src/main目录下module.json5和entry/src/main/resources/base/element目录下string.json文件 diff --git a/zh-cn/react-navigation-shared-element.md b/zh-cn/react-navigation-shared-element.md index 304652bd3dc5f533694d4754405eb3e8b27e6e6c..cb5ad81cc8ba072e3f64f75c3a095a15f5c53a26 100644 --- a/zh-cn/react-navigation-shared-element.md +++ b/zh-cn/react-navigation-shared-element.md @@ -24,14 +24,14 @@ #### **npm** ```bash -npm install react-navigation-shared-element@3.1.2 +npm install react-navigation-shared-element@3.1.3 npm install react-native-shared-element@0.8.9 ``` #### **yarn** ```bash -yarn add react-navigation-shared-element@3.1.2 +yarn add react-navigation-shared-element@3.1.3 yarn add react-native-shared-element@0.8.9 ```