diff --git a/en/Parse-SDK-JS.md b/en/Parse-SDK-JS.md
index 8d4d5d6eb7ab89561c684a8dee6cc5762461fe09..f9840c42b42ce6f44dadd600665bb360d5ccb853 100644
--- a/en/Parse-SDK-JS.md
+++ b/en/Parse-SDK-JS.md
@@ -16,9 +16,9 @@
## Installation and Usage
-> [!TIP] It requires supporting services and third-party dependencies
+> [!TIP] 需要配套的服务和三方依赖
-The Parse JS SDK is compatible with the following versions of Parse Server. For the setup of the Parse Server server, please refer to[https://github.com/parse-community/parse-server/blob/alpha/README.md](https://github.com/parse-community/parse-server/blob/alpha/README.md)。
+Parse JS SDK 兼容以下版本的 Parse Server,Parse Server 服务端搭建可参考[https://github.com/parse-community/parse-server/blob/alpha/README.md](https://github.com/parse-community/parse-server/blob/alpha/README.md)。
| Parse JS SDK | Parse Server |
| :--------------: | :--------------: |
@@ -27,12 +27,6 @@ The Parse JS SDK is compatible with the following versions of Parse Server. For
> [!TIP] This library depends on[@react-native-oh-tpl/async-storage](/zh-cn/react-native-async-storage-async-storage.md)、[@react-native-oh-tpl/react-native-get-random-values](/zh-cn/react-native-get-random-values.md)
-Please go to the Releases release address of the third-party library to view the supporting version information: @react-native-ohos/pull-to-refresh Releases.
-
-|Version |Support RN version|
-| --------|---------- |
-| 5.3.0 | 0.72/0.77 |
-
Go to the project directory and execute the following instruction:
@@ -215,117 +209,116 @@ If it is not included, follow the guide provided in [@react-native-oh-tpl/async-
This document is verified based on the following versions:
1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.403; ROM: 3.0.0.25;
-2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
## API
-The apis corresponding to different versions are also different. For details, please refer to the official documentation of [Parse-SDK-JS](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/index.html)。
+不同版本对应的 API 也不同,详情请查看[Parse-SDK-JS 官方文档](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/index.html)。
> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library.
> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android.
-**Parse**: Parse is the core object of Parse-SDK-JS, containing all Parse API classes and functions.
+**Parse**: Parse 是 Parse-SDK-JS 的核心对象,包含所有 Parse API 类和函数。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| --------------- | ------------------------------------------------------------------------ | --------------------------------------------------------------------------- | -------- | ----------- | ----------------- |
-| initialize | Initialize the Parse SDK and set the ID and key of the application. It is usually called at the entrance of the application. | (applicationId: string, javaScriptKey?: string, masterKey?: string) => void | yes | iOS/Android | yes |
-| setAsyncStorage | Set the AsyncStorage instance used by the Parse SDK to store session tokens and other information. | (storage:AsyncStorage) => void | yes | iOS/Android | yes |
+| initialize | 初始化 Parse SDK,设置应用程序的 ID 和密钥。通常在应用程序的入口处调用。 | (applicationId: string, javaScriptKey?: string, masterKey?: string) => void | yes | iOS/Android | yes |
+| setAsyncStorage | 设置 Parse SDK 使用的 AsyncStorage 实例,用于存储会话令牌等信息。 | (storage:AsyncStorage) => void | yes | iOS/Android | yes |
-**Parse.ACL**: Access permission object.
+**Parse.ACL**: 访问权限对象。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| -------------------- | ---------------------------------------------- | ------------------------------------------ | -------- | ----------- | ----------------- |
-| setPublicReadAccess | Set whether to allow public (unauthenticated users) to read the object. | (allowed: boolean) => void | no | iOS/Android | yes |
-| setPublicWriteAccess | Set whether to allow public (unauthenticated users) to write to the object. | (allowed: boolean) => void | no | iOS/Android | yes |
-| getPublicReadAccess | Obtain whether public (unauthenticated users) are allowed to read the object. | () => boolean | no | iOS/Android | yes |
-| getPublicWriteAccess | Obtain the permission to allow public (unauthenticated users) to write to the object. | () => boolean | no | iOS/Android | yes |
-| setReadAccess | Set whether a specific user has the permission to read objects. | (userId: string, allowed: boolean) => void | no | iOS/Android | yes |
-| setWriteAccess | Set whether a specific user has the permission to write objects. | (userId: string, allowed: boolean) => void | no | iOS/Android | yes |
-| getReadAccess | Obtain whether a specific user has the permission to read objects. | (userId: string) => boolean | no | iOS/Android | yes |
-| getWriteAccess | Obtain whether a specific user has the permission to write objects. | (userId: string) => boolean | no | iOS/Android | yes |
+| setPublicReadAccess | 设置是否允许公共(未认证用户)读取对象。 | (allowed: boolean) => void | no | iOS/Android | yes |
+| setPublicWriteAccess | 设置是否允许公共(未认证用户)写入对象。 | (allowed: boolean) => void | no | iOS/Android | yes |
+| getPublicReadAccess | 获取是否允许公共(未认证用户)读取对象。 | () => boolean | no | iOS/Android | yes |
+| getPublicWriteAccess | 获取是否允许公共(未认证用户)写入对象的权限。 | () => boolean | no | iOS/Android | yes |
+| setReadAccess | 设置特定用户是否有读取对象的权限。 | (userId: string, allowed: boolean) => void | no | iOS/Android | yes |
+| setWriteAccess | 设置特定用户是否有写入对象的权限。 | (userId: string, allowed: boolean) => void | no | iOS/Android | yes |
+| getReadAccess | 获取特定用户是否有读取对象的权限。 | (userId: string) => boolean | no | iOS/Android | yes |
+| getWriteAccess | 获取特定用户是否有写入对象的权限。 | (userId: string) => boolean | no | iOS/Android | yes |
-**Parse.Object**: Under normal circumstances, you won't call this method directly. It is recommended that you use a subclass of Parse.Object and create a subclass object by calling the 'extend' method。
+**Parse.Object**: 通常情况下,您不会直接调用此方法。建议您使用 Parse.Object 的子类,通过调用 `extend` 方法创建子类对象。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| ---------------- | ------------------------------------------------------------------- | ---------------------------------------------------------------------------- | -------- | ----------- | ----------------- |
-| set | Set the attribute values of the data object, where 'key' is the attribute name and 'value' is the corresponding attribute value. | (key: string\|object, value: string\|object, options: object) => ParseObject | no | iOS/Android | yes |
-| get | Obtain the specified attribute value of the data object and specify the attribute name through the 'key'. | (attr: string) => any | no | iOS/Android | yes |
-| unset | Remove the specified attribute value of the data object and specify the attribute name through the 'key'. | (attr: string) => ParseObject | no | iOS/Android | yes |
-| increment | Increase the numeric type value of the specified attribute. 'amount' is the increased quantity. | (attr: String, amount: Number) => ParseObject | no | iOS/Android | yes |
-| add | Add a value to an array type property. 'value' is the value to be added. | (attr: string, item) => ParseObject | no | iOS/Android | yes |
-| remove | Remove a value from an array type property. 'value' is the value to be removed. | (attr: string, item) => ParseObject | no | iOS/Android | yes |
-| save | Save the data object to the Parse server. If the object does not exist, create it; if it exists, update it. | () => Promise | no | iOS/Android | yes |
-| fetch | Obtain the latest data object information from the Parse server. | (options: object) => Promise | no | iOS/Android | yes |
-| destroy | Delete the current data object from the Parse server. | (options: object) => Promise | no | iOS/Android | yes |
-| fetchWithInclude | When obtaining an object, include the associated object specified in the query. | (keys: string\|Array>, options: object) => Promise | no | iOS/Android | yes |
-| saveAll | Batch save a group of data objects to the Parse server. | (list: Array, options: object) => Array. | no | iOS/Android | yes |
-| destroyAll | Batch delete a group of data objects. | (list: Array, options: object) => Promise | no | iOS/Android | yes |
-
-**Parse.Query**: Parse.Query defines a query used to obtain Parse.Object.
+| set | 设置数据对象的属性值,其中 `key` 是属性名,`value` 是对应的属性值。 | (key: string\|object, value: string\|object, options: object) => ParseObject | no | iOS/Android | yes |
+| get | 获取数据对象的指定属性值,通过 `key` 指定属性名。 | (attr: string) => any | no | iOS/Android | yes |
+| unset | 移除数据对象的指定属性值,通过 `key` 指定属性名。 | (attr: string) => ParseObject | no | iOS/Android | yes |
+| increment | 增加指定属性的数值类型值,`amount` 是增加的数量。 | (attr: String, amount: Number) => ParseObject | no | iOS/Android | yes |
+| add | 添加一个值到数组类型的属性中,`value` 是要添加的值。 | (attr: string, item) => ParseObject | no | iOS/Android | yes |
+| remove | 从数组类型的属性中移除一个值,`value` 是要移除的值。 | (attr: string, item) => ParseObject | no | iOS/Android | yes |
+| save | 将数据对象保存到 Parse 服务器上,如果对象不存在则创建,存在则更新。 | () => Promise | no | iOS/Android | yes |
+| fetch | 从 Parse 服务器上获取最新的数据对象信息。 | (options: object) => Promise | no | iOS/Android | yes |
+| destroy | 从 Parse 服务器上删除当前数据对象。 | (options: object) => Promise | no | iOS/Android | yes |
+| fetchWithInclude | 在获取对象时,包含在查询中指定的关联对象。 | (keys: string\|Array>, options: object) => Promise | no | iOS/Android | yes |
+| saveAll | 批量保存一组数据对象到 Parse 服务器。 | (list: Array, options: object) => Array. | no | iOS/Android | yes |
+| destroyAll | 批量删除一组数据对象。 | (list: Array, options: object) => Promise | no | iOS/Android | yes |
+
+**Parse.Query**: Parse.Query 定义了一个用于获取 Parse.Object 的查询。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| :------------------: | ------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | ----------- | ----------------- |
-| equalTo | Add an equality condition to make the value of the query field 'key' equal to 'value'. | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| notEqualTo | Add an unequal condition, and the value of the query field 'key' is not equal to 'value'. | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| lessThan | Add a less than condition, and the value of the query field 'key' is less than 'value'. | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| greaterThan | Add a greater than condition to query that the value of the field 'key' is greater than that of 'value'. | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| lessThanOrEqualTo | Add a less than or equal to condition, and the value of the query field 'key' is less than or equal to 'value'. | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| greaterThanOrEqualTo | Add a greater than or equal to condition, and the value of the query field 'key' is greater than or equal to 'value'. | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| containedIn | Add a condition that includes the value of the query field 'key' in the 'values' array. | (key: string, value: any[]) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| notContainedIn | Add a condition that does not include the value of the query field 'key' in the 'values' array. | (key: string, value: any[]) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| exists | Add a existence condition that the value of the query field 'key' exists (not 'null' or 'undefined'). | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| doesNotExist | Add a non-existence condition where the value of the query field 'key' does not exist (either 'null' or 'undefined'). | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| containsAll | Add a query field 'key' that contains all conditions. The value of the query field 'key' must include all elements in the 'values' array. | (key: string, value: any[]) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| startsWith | Add a condition starting with the specified prefix. The value of the query field 'key' must start with the 'prefix' string. | (key: string, prefix: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| endsWith | Add a condition that ends with the specified suffix. The value of the query field 'key' must end with the 'suffix' string. | (key: string, suffix: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| near | Add a proximity condition to query that the value of the geographical location field 'key' is close to the specified geographical coordinate point 'point'. | (key: string, point: Parse.GeoPoint) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| withinRadians | Add a condition within the specified arc to query that the value of the geographical location field 'key' is within the circular range centered on 'point' with a radius of 'maxDistance'. | (key: string, point: Parse.GeoPoint, maxDistance: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| withinMiles | Add a condition within the specified mile to query that the value of the geographical location field 'key' is within a circular range centered on 'point' with a radius of 'maxDistance' miles. | (key: string, point: Parse.GeoPoint, maxDistance: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| withinKilometers | Add a condition within the specified kilometers to query that the value of the geographical location field 'key' is within a circular range centered on 'point' with a radius of 'maxDistance' kilometers. | (key: string, point: Parse.GeoPoint, maxDistance: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| withinGeoBox | Add a condition within the specified rectangular area to query that the value of the geographical location field 'key' must be within the rectangle defined by 'southwest' and 'northeast'. | (key: string, southwest: Parse.GeoPoint, northeast: Parse.GeoPoint) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| include | Add a condition containing the associated object | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| select | Only return the information of the specified fields in the query results. | (keys: string[]) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| limit | Limit the number of returned results. | (count: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| skip | Skip the specified number of query results. | (count: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| ascending | Sort the query results in ascending order according to the specified fields. | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| descending | Sort the query results in descending order according to the specified fields. | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| find | Sort the query results in descending order according to the specified fields. | (options?: Parse.Query.FindOptions) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| first | Execute the query and return the first object that meets the conditions. | (options?: Parse.Query.FindOptions) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-| count | Calculate the number of objects that meet the conditions. | (options?: Parse.Query.CountOptions) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
-
-**Parse.Role**: Represents the role object on the Parse server.
+| equalTo | 添加一个相等条件,查询字段 `key` 的值等于 `value`。 | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| notEqualTo | 添加一个不等条件,查询字段 `key` 的值不等于 `value`。 | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| lessThan | 添加一个小于条件,查询字段 `key` 的值小于 `value`。 | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| greaterThan | 添加一个大于条件,查询字段 `key` 的值大于 `value`。 | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| lessThanOrEqualTo | 添加一个小于或等于条件,查询字段 `key` 的值小于或等于 `value`。 | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| greaterThanOrEqualTo | 添加一个大于或等于条件,查询字段 `key` 的值大于或等于 `value`。 | (key: string, value: any) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| containedIn | 添加一个包含于条件,查询字段 `key` 的值包含在 `values` 数组中。 | (key: string, value: any[]) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| notContainedIn | 添加一个不包含于条件,查询字段 `key` 的值不包含在 `values` 数组中。 | (key: string, value: any[]) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| exists | 添加一个存在条件,查询字段 `key` 的值存在(非 `null` 或 `undefined`)。 | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| doesNotExist | 添加一个不存在条件,查询字段 `key` 的值不存在(为 `null` 或 `undefined`)。 | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| containsAll | 添加一个包含所有条件,查询字段 `key` 的值必须包含 `values` 数组中的所有元素。 | (key: string, value: any[]) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| startsWith | 添加一个以指定前缀开始的条件,查询字段 `key` 的值必须以 `prefix` 字符串开头。 | (key: string, prefix: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| endsWith | 添加一个以指定后缀结束的条件,查询字段 `key` 的值必须以 `suffix` 字符串结尾。 | (key: string, suffix: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| near | 添加一个接近条件,查询地理位置字段 `key` 的值接近于指定的地理坐标点 `point`。 | (key: string, point: Parse.GeoPoint) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| withinRadians | 添加一个在指定弧度内的条件,查询地理位置字段 `key` 的值在以 `point` 为中心、半径为 `maxDistance` 的圆形范围内。 | (key: string, point: Parse.GeoPoint, maxDistance: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| withinMiles | 添加一个在指定英里内的条件,查询地理位置字段 `key` 的值在以 `point` 为中心、半径为 `maxDistance` 英里的圆形范围内。 | (key: string, point: Parse.GeoPoint, maxDistance: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| withinKilometers | 添加一个在指定公里内的条件,查询地理位置字段 `key` 的值在以 `point` 为中心、半径为 `maxDistance` 公里的圆形范围内。 | (key: string, point: Parse.GeoPoint, maxDistance: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| withinGeoBox | 添加一个在指定矩形区域内的条件,查询地理位置字段 `key` 的值必须在由 `southwest` 和 `northeast` 定义的矩形内。 | (key: string, southwest: Parse.GeoPoint, northeast: Parse.GeoPoint) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| include | 添加一个包含关联对象条件 | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| select | 仅返回查询结果中指定字段的信息。 | (keys: string[]) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| limit | 限制返回结果的数量。 | (count: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| skip | 跳过指定数量的查询结果。 | (count: number) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| ascending | 按照指定字段升序排序查询结果。 | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| descending | 按照指定字段降序排序查询结果。 | (key: string) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| find | 按照指定字段降序排序查询结果。 | (options?: Parse.Query.FindOptions) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| first | 执行查询并返回符合条件的第一个对象。 | (options?: Parse.Query.FindOptions) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+| count | 计算符合条件的对象的数量。 | (options?: Parse.Query.CountOptions) => [Parse.Query](https://parseplatform.org/Parse-SDK-JS/api/5.3.0/Parse.Query.html) | no | iOS/Android | yes |
+
+**Parse.Role**: 表示 Parse 服务器上的角色对象。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| -------------- | ------------------------------- | --------------------------------------------- | -------- | ----------- | ----------------- |
-| getName | Get the name of the character. | () => String | no | iOS/Android | yes |
-| getUsers | Obtain the list of users assigned to the role. | () => Array | no | iOS/Android | yes |
-| getRoles | Get the list of sub-roles assigned to the role. | () => Array | no | iOS/Android | yes |
-| getRolesByName | Obtain the list of role objects based on the role name. | (Array) => Promise> | no | iOS/Android | yes |
-| save | Save the role object to the Parse server. | (obj: Object) => Promise> | no | iOS/Android | yes |
-| destroy | Delete the role object from the Parse server. | (obj: Object) => Promise> | no | iOS/Android | yes |
+| getName | 获取角色的名称。 | () => String | no | iOS/Android | yes |
+| getUsers | 获取分配给角色的用户列表。 | () => Array | no | iOS/Android | yes |
+| getRoles | 获取分配给角色的子角色列表。 | () => Array | no | iOS/Android | yes |
+| getRolesByName | 根据角色名称获取角色对象列表。 | (Array) => Promise> | no | iOS/Android | yes |
+| save | 将角色对象保存到 Parse 服务器。 | (obj: Object) => Promise> | no | iOS/Android | yes |
+| destroy | 从 Parse 服务器上删除角色对象。 | (obj: Object) => Promise> | no | iOS/Android | yes |
-**Parse.User**: It represents the user object on the Parse server and can perform operations such as registration, login, and logout.
+**Parse.User**: 表示 Parse 服务器上的用户对象,可进行注册、登录、登出等操作。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| ------- | --------------------------------------------------------- | ------------------------------------------------------------ | -------- | ----------- | ----------------- |
-| signUp | Register a new user to the Parse server. | ({username: string, password: string, email: string}) => Promise | no | iOS/Android | yes |
-| logIn | Logged-in user. | (username: string, password: string) => Promise | no | iOS/Android | yes |
-| current | Get the currently logged-in user object. If no user is logged in, return 'null'. | () => Parse.User | no | iOS/Android | yes |
-| logOut | Log out of the current user. | () => Promise | no | iOS/Android | yes |
-| become | Authenticate users through session tokens. | (sessionToken: string) => Promise | no | iOS/Android | yes |
-| save | Save the user object to the Parse server. | (user: Object) => Promise | no | iOS/Android | yes |
-| destroy | Delete the user object from the Parse server. | (user: Object) => Promise | no | iOS/Android | yes |
+| signUp | 注册新用户到 Parse 服务器。 | ({username: string, password: string, email: string}) => Promise | no | iOS/Android | yes |
+| logIn | 登录用户。 | (username: string, password: string) => Promise | no | iOS/Android | yes |
+| current | 获取当前已登录的用户对象,如果没有用户登录则返回 `null`。 | () => Parse.User | no | iOS/Android | yes |
+| logOut | 登出当前用户。 | () => Promise | no | iOS/Android | yes |
+| become | 通过会话令牌 sessionToken 来认证用户。 | (sessionToken: string) => Promise | no | iOS/Android | yes |
+| save | 将用户对象保存到 Parse 服务器。 | (user: Object) => Promise | no | iOS/Android | yes |
+| destroy | 从 Parse 服务器上删除用户对象。 | (user: Object) => Promise | no | iOS/Android | yes |
-**Parse.Cloud**: Custom Cloud code can be executed through the Cloud API. The following are the main supported Cloud apis and their related information:
+**Parse.Cloud**: 可以通过 Cloud API 执行自定义的云代码。以下是支持的主要 Cloud API 及其相关信息:
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| :----------: | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------- | -------- | ----------- | ----------------- |
-| run | Call the cloud function with the specified name and obtain its return value. 'functionName' is the name of the cloud function, 'data' is the parameter object passed to the cloud function, and 'options' is an optional configuration object used to set detailed options for cloud function calls, such as timeouts, etc. | (functionName: string, data?: object, options?: Parse.Cloud.HttpOptions) => Promise | no | iOS/Android | yes |
-| afterSave | Register a cloud function that is triggered after saving the object. ` className ` is the name of the class of an object, ` func ` is an asynchronous function or return void function, receives a ` Parse. Cloud. AfterSaveRequest ` objects as parameters, can perform custom logic after save objects. | (className: string, func: (request: Parse.Cloud.AfterSaveRequest) => Promise\|void) => void | no | iOS/Android | yes |
-| beforeSave | Register a cloud function that is triggered before saving the object. ` className ` is the name of the class of an object, ` func ` is an asynchronous function or return void function, receives a ` Parse. Cloud. BeforeSaveRequest ` objects as parameters, can perform custom logic in front of the object. | (className: string, func: (request: Parse.Cloud.BeforeSaveRequest) => Promise\|void) => void | no | iOS/Android | yes |
-| afterDelete | Register a cloud function that is triggered after deleting an object. ` className ` is the name of the class of an object, ` func ` is an asynchronous function or return void function, receives a ` Parse. Cloud. AfterDeleteRequest ` objects as parameters, can perform custom logic after delete the object. | (className: string, func: (request: Parse.Cloud.AfterDeleteRequest) => Promise\|void) => void | no | iOS/Android | yes |
-| beforeDelete | Register a cloud function that is triggered before deleting an object. ` className ` is the name of the class of an object, ` func ` is an asynchronous function or return void function, receives a ` Parse. Cloud. BeforeDeleteRequest ` objects as parameters, can perform custom logic before delete the object. | (className: string, func: (request: Parse.Cloud.BeforeDeleteRequest) => Promise\|void) => void | no | iOS/Android | yes |
+| run | 调用指定名称的云函数并获取其返回值。`functionName` 是云函数的名称,`data` 是传递给云函数的参数对象,`options` 是一个可选的配置对象,用于设置云函数调用的详细选项,如超时等。 | (functionName: string, data?: object, options?: Parse.Cloud.HttpOptions) => Promise | no | iOS/Android | yes |
+| afterSave | 注册一个在保存对象后触发的云函数。`className` 是对象的类名,`func` 是一个异步函数或返回 void 的函数,接收一个 `Parse.Cloud.AfterSaveRequest` 对象作为参数,可以在保存对象后执行自定义逻辑。 | (className: string, func: (request: Parse.Cloud.AfterSaveRequest) => Promise\|void) => void | no | iOS/Android | yes |
+| beforeSave | 注册一个在保存对象之前触发的云函数。`className` 是对象的类名,`func` 是一个异步函数或返回 void 的函数,接收一个 `Parse.Cloud.BeforeSaveRequest` 对象作为参数,可以在保存对象前执行自定义逻辑。 | (className: string, func: (request: Parse.Cloud.BeforeSaveRequest) => Promise\|void) => void | no | iOS/Android | yes |
+| afterDelete | 注册一个在删除对象后触发的云函数。`className` 是对象的类名,`func` 是一个异步函数或返回 void 的函数,接收一个 `Parse.Cloud.AfterDeleteRequest` 对象作为参数,可以在删除对象后执行自定义逻辑。 | (className: string, func: (request: Parse.Cloud.AfterDeleteRequest) => Promise\|void) => void | no | iOS/Android | yes |
+| beforeDelete | 注册一个在删除对象之前触发的云函数。`className` 是对象的类名,`func` 是一个异步函数或返回 void 的函数,接收一个 `Parse.Cloud.BeforeDeleteRequest` 对象作为参数,可以在删除对象前执行自定义逻辑。 | (className: string, func: (request: Parse.Cloud.BeforeDeleteRequest) => Promise\|void) => void | no | iOS/Android | yes |
## Known Issues
diff --git a/en/js/text-shadow-component.md b/en/js/text-shadow-component.md
index 330467aa96ea5e87a33d88440a0d4a7078a1268b..33a4067ed1e90d9488c2c5b599a8864a741016f8 100644
--- a/en/js/text-shadow-component.md
+++ b/en/js/text-shadow-component.md
@@ -1,16 +1,20 @@
-> Template version: v0.3.0
+> Template version: v0.2.2
text-shadow-component
+
+
+
+
+
+
+
+
-Please go to the Releases release address of the third-party library to view the supporting version information: [text-shadow-component Releases](https://github.com/bswnth48/text-shadow-react-native/releases). For older versions that are not published to npm, install the tgz package by referring to the [Installation Guide](/en/tgz-usage-en.md).
-
-| Version | Support RN version|
-| ---------- |---------- |
-| 1.0.7 | 0.72/0.77 |
+> [!TIP] [ GitHub address](https://github.com/bswnth48/text-shadow-react-native)
-> [!TIP] Starting from RNOH 0.72.97, RNOH 0.72 supports shadow rendering.
+> [!TIP] Renders text shadow only on RNOH 0.77+; RNOH 0.72 is not supported.
## Installation and Usage
@@ -84,14 +88,17 @@ export default function App() {
This document is verified with the following environment:
-1. RNOH: 0.77.18; SDK: HarmonyOS 5.0.0 Release (API Version 12 Release); IDE: DevEco Studio 5.1.1.830; ROM: 5.0.0.150 SP8;
-2. RNOH: 0.72.97; SDK: HarmonyOS 6.0.0.47 (API Version 20 Release); IDE: DevEco Studio 6.0.0 Release; ROM: 6.0.0.108 SP6;
+1. RNOH: 0.77.18; SDK: HarmonyOS 5.0.0 Release (API Version 12 Release); IDE: DevEco Studio 5.1.1.830; ROM: 5.0.0.150 SP8
+
+> Note: On RNOH 0.77+, native text shadow drawing is implemented. Earlier versions (e.g., RNOH 0.72) will not render text shadow.
## Properties
> [!TIP] The Platform column indicates the platform where the properties are supported in the original third-party library.
-
+>
> [!TIP] If the value of HarmonyOS Support is yes, it means the HarmonyOS platform supports this property; no means the opposite; partially means some capabilities of this property are supported. The usage is the same across platforms and the effect targets iOS/Android parity.
+>
+> [!TIP] This document provides support conclusions for HarmonyOS (RNOH 0.77+) only.
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| ----------- | ------------------------------------------------------- | ------ | -------- | ----------- | ----------------- |
@@ -101,9 +108,9 @@ This document is verified with the following environment:
## Known Issues
-## Others
+Text shadow is not displayed on RNOH 0.72. [issue#ID0FUU](https://gitee.com/react-native-oh-library/usage-docs/issues/ID0FUU)
-Starting from RNOH 0.72.97, RNOH 0.72 supports shadow rendering.
+## Others
## License
diff --git a/en/react-native-aria.md b/en/react-native-aria.md
index 1f56e006e9372b97bf1e7a4c2c86611f0729c803..c09ad97ab33b2e71fcf4f111c855dcbed94f5d8b 100644
--- a/en/react-native-aria.md
+++ b/en/react-native-aria.md
@@ -1,4 +1,4 @@
-> Template version: v0.2.2
+> Template Version: v0.2.2
react-native-aria
@@ -12,14 +12,19 @@
-> [!TIP] [GitHub address](https://github.com/gluestack/react-native-aria/tree/main)
+> [!TIP] [Github Address](https://github.com/gluestack/react-native-aria/tree/main)
-## Installation and Usage
+## Installation & Usage
-React Native ARIA是可增量采用的。每个组件都作为单独的包发布,因此您可以在单个组件中使用它,并随着时间的推移逐渐添加更多组件。所有这些包都在npm上的@react-native-aria范围内发布。
-> [!TIP] 该库已经不再维护,如果执行总包命令,项目运行缺失模块,就需要卸载旧包,在命令后增加--legacy-peer-deps,然后再次下载包文件
+Please check the corresponding version information in the third-party library's Releases:
-Go to the project directory and execute the following instruction:
+| Third-party Version | Release Information | Supported RN Version |
+| ------------------- | ------------------- | -------------------- |
+| 0.2.3 | [react-native-aria main](https://github.com/gluestack/react-native-aria/tree/main) | 0.72/0.77 |
+
+For older versions not published to npm, please refer to the [Installation Guide](/zh-cn/tgz-usage.md) to install the tgz package.
+
+Navigate to your project directory and run the following command:
#### **yarn**
@@ -27,17 +32,13 @@ Go to the project directory and execute the following instruction:
yarn add react-native-aria@0.2.3
```
-
-
#### **npm**
```bash
npm install react-native-aria@0.2.3
```
-
-
-除了总包之外,我们还提供了一些单独包,如:@react-native-aria/button
+In addition to the main package, we also provide some separate packages, such as: @react-native-aria/button
#### **yarn**
@@ -45,19 +46,13 @@ npm install react-native-aria@0.2.3
yarn add @react-native-aria/button@0.2.7
```
-
-
#### **npm**
```bash
npm install @react-native-aria/button@0.2.7
```
-
-
-The following code shows the basic use scenario of the repository:
-
-> [!WARNING] The name of the imported repository remains unchanged.
+The following code demonstrates the basic usage scenario of useToggleButton:
```js
import React from "react";
@@ -80,7 +75,7 @@ export function ToggleButton(props: any) {
padding: 5, width: 100, height: 30, justifyContent: 'center', alignItems: 'center'
}}
>
- 点击切换
+ Click to toggle
);
@@ -90,7 +85,7 @@ export default ToggleButton
```
-下面的代码展示了useCheckbox与useCheckboxGroup的基本使用场景:
+The following code demonstrates the basic usage scenario of useCheckbox and useCheckboxGroup:
```javascript
import React, { useContext, useRef } from 'react';
@@ -102,7 +97,7 @@ import { useFocusRing } from '@react-native-aria/focus';
let CheckboxGroupContext = React.createContext(null);
-const CheckboxItems = [{ key: 'soccer', value: '足球' }, { key: 'baseball', value: '棒球' }, { key: 'basketball', value: '篮球' }]
+const CheckboxItems = [{ key: 'soccer', value: 'Football' }, { key: 'baseball', value: 'Baseball' }, { key: 'basketball', value: 'Basketball' }]
const findName = (value: string) => {
const item = CheckboxItems.find(i => { return i.key === value; })
return item && item.value
@@ -119,7 +114,7 @@ export function CheckboxGroup(props: any) {
{children}
- 已经选择:{props.value.map(i=>{
+ Selected:{props.value.map(i=>{
return {findName(i)}
})}
@@ -177,7 +172,7 @@ export default CheckboxExample
```
-下面的代码展示了useRadio与useRadioGroup的基本使用场景:
+The following code demonstrates the basic usage scenario of useRadio and useRadioGroup:
```javascript
import React from "react";
@@ -188,7 +183,7 @@ import { useFocusRing } from "@react-native-aria/focus";
let RadioContext = React.createContext({});
-const radioItems = [{ key: 'dogs', value: '狗子' }, { key: 'cats', value: '猫儿' }]
+const radioItems = [{ key: 'dogs', value: 'Dogs' }, { key: 'cats', value: 'Cats' }]
const findName = (value: string) => {
const item = radioItems.find(i => { return i.key === value; })
return item && item.value
@@ -211,7 +206,7 @@ export function RadioGroup(props: any) {
>
{children}
- 已经选择:{findName(state.selectedValue as string)}
+ Selected:{findName(state.selectedValue as string)}
);
}
@@ -250,7 +245,7 @@ export default RadioExample
```
-下面的代码展示了useSwitch的基本使用场景:
+The following code demonstrates the basic usage scenario of useSwitch:
```javascript
import { useToggleState } from "@react-stately/toggle";
@@ -368,7 +363,7 @@ export function Switch(origProps: any) {
{icon}
- {isOn ? "开" : "关"}
+ {isOn ? "On" : "Off"}
);
}
@@ -403,7 +398,7 @@ export default ControlledSwitch
```
-下面的代码展示了useOverlayPosition的基本使用场景:
+The following code demonstrates the basic usage scenario of useOverlayPosition:
```javascript
import React from "react";
@@ -494,7 +489,7 @@ export function Trigger({ placement }: any) {
paddingVertical: 10,
}}
>
- 点我一下
+ Click me
@@ -511,40 +506,40 @@ export default TriggerWrapper
```
-更多hooks请参考[react-native-aria官方文档](https://geekyants.github.io/react-native-aria/docs/)
+For more hooks, please refer to the [react-native-aria official documentation](https://geekyants.github.io/react-native-aria/docs/)
-## Constraints
+## Constraints & Limitations
### Compatibility
-This document is verified based on the following versions:
+This document content has been verified with the following versions:
-1. RNOH:0.72.13; SDK:HarmonyOS NEXT Developer Preview1; IDE:DevEco Studio 4.1.3.500; ROM:2.0.0.59;
-2. RNOH:0.72.27; SDK:HarmonyOS-Next-DB1 5.0.0.29(SP1) ; IDE:DevEco Studio 5.0.3.400; ROM:3.0.0.25;
-3. RNOH:0.72.29; SDK:HarmonyOS NEXT Developer Beta6; IDE:DevEco Studio 5.0.3.706; ROM:3.0.0.61;
-4. RNOH:0.72.33; SDK:OpenHarmony 5.0.0.71(API Version 12 Release); IDE:DevEco Studio 5.0.3.900; ROM:NEXT.0.0.71;
+1. RNOH: 0.72.13; SDK: HarmonyOS NEXT Developer Preview1; IDE: DevEco Studio 4.1.3.500; ROM: 2.0.0.59;
+2. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.400; ROM: 3.0.0.25;
+3. RNOH: 0.72.29; SDK: HarmonyOS NEXT Developer Beta6; IDE: DevEco Studio 5.0.3.706; ROM: 3.0.0.61;
+4. RNOH: 0.72.33; SDK: OpenHarmony 5.0.0.71(API Version 12 Release); IDE: DevEco Studio 5.0.3.900; ROM: NEXT.0.0.71;
## Hooks
-> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library.
+> [!TIP] The "Platform" column indicates the platforms supported by the original third-party library for that property.
-> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android.
+> [!TIP] The "HarmonyOS Support" column: 'Yes' means the property is supported on the HarmonyOS platform; 'No' means it is not supported; 'partially' means partial support. The usage method is consistent across platforms, with effects benchmarked against iOS or Android.
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|----------|----------|-------------------|
-| useToggleButton | Provides the behavior and accessibility implementation for a toggle button component. ToggleButtons allow users to toggle a selection on or off, for example switching between two states or modes. | Function | no | iOS,Android | yes |
-| useCheckbox | Provides the behavior and accessibility implementation for a checkbox component. Checkboxes allow users to select multiple items from a list of individual items, or to mark one individual item as selected. | Function | no | iOS,Android | yes |
-| useCheckboxGroup | Provides the behavior and accessibility implementation for a checkbox group component. Checkbox groups allow users to select multiple items from a list of options. | Function | no | iOS,Android | yes |
-| useRadioGroup | Provides the behavior and accessibility implementation for a radio group component. Radio groups allow users to select a single item from a list of mutually exclusive options. | Function | no | iOS,Android | yes |
-| useSwitch | Provides the behavior and accessibility implementation for a switch component. A switch is similar to a checkbox, but represents on/off values as opposed to selection. | Function | no | iOS,Android | yes |
-| OverlayContainer | Provides React Portal like functionality for React Native apps which can be useful for displaying absolutely positioned components like Menu, Tooltip, Popover. | Function | no | iOS,Android | yes |
-| useOverlayPosition | Handles positioning overlays like popovers and menus relative to a trigger element, and updating the position when the window resizes. | Function | no | iOS,Android | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|----------|-------------|-------------------|
+| useToggleButton | Provides the behavior and accessibility implementation for a toggle button component. ToggleButtons allow users to toggle a selection on or off, for example switching between two states or modes. | Function | No | iOS,Android | Yes |
+| useCheckbox | Provides the behavior and accessibility implementation for a checkbox component. Checkboxes allow users to select multiple items from a list of individual items, or to mark one individual item as selected. | Function | No | iOS,Android | Yes |
+| useCheckboxGroup | Provides the behavior and accessibility implementation for a checkbox group component. Checkbox groups allow users to select multiple items from a list of options. | Function | No | iOS,Android | Yes |
+| useRadioGroup | Provides the behavior and accessibility implementation for a radio group component. Radio groups allow users to select a single item from a list of mutually exclusive options. | Function | No | iOS,Android | Yes |
+| useSwitch | Provides the behavior and accessibility implementation for a switch component. A switch is similar to a checkbox, but represents on/off values as opposed to selection. | Function | No | iOS,Android | Yes |
+| OverlayContainer | Provides React Portal like functionality for React Native apps which can be useful for displaying absolutely positioned components like Menu, Tooltip, Popover. | Function | No | iOS,Android | Yes |
+| useOverlayPosition | Handles positioning overlays like popovers and menus relative to a trigger element, and updating the position when the window resizes. | Function | No | iOS,Android | Yes |
## Known Issues
+1. Immediate voice reading after toggling selection state is currently not supported.
## Others
## License
-This project is licensed under [The MIT License (MIT)](https://github.com/gluestack/react-native-aria/blob/main/LICENSE).
-
+This project is based on [The MIT License (MIT)](https://github.com/gluestack/react-native-aria/blob/main/LICENSE). Feel free to enjoy and contribute to open source.
\ No newline at end of file
diff --git a/en/react-native-community-toolbar-android.md b/en/react-native-community-toolbar-android.md
index 78e9550c797c31cd311f571c3d53970b766daa34..dcd9aba42d72a92c129ca880f11f7147fa002931 100644
--- a/en/react-native-community-toolbar-android.md
+++ b/en/react-native-community-toolbar-android.md
@@ -1,4 +1,4 @@
-> Template version: v0.3.0
+> Template Version: v0.3.0
@react-native-community/toolbar-android
@@ -6,36 +6,42 @@
This project is based on [@react-native-toolbar-android/toolbar-android@v0.2.1](https://github.com/react-native-toolbar-android/toolbar-android/tree/v0.2.1).
-This third-party library has been migrated to Gitee and is now available for direct download from npm, the new package name is: `@react-native-ohos/toolbar-android`, The version correspondence details are as follows:
+The third-party library repository has been migrated to Gitee and supports direct download from npm. The new package name is: `@react-native-ohos/toolbar-android`. The specific version relationships are as follows:
-| Version | Package Name | Repository | Release |
-|-----------------| ------------------------------------------------- | ------------------ | -------------------------- |
-| <= 0.2.1-0.0.4 | @react-native-oh-tpl/toolbar-android | [Github(deprecated)](https://github.com/react-native-oh-library/toolbar-android) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/toolbar-android/releases) |
-| >= 0.2.2 | @react-native-ohos/toolbar-android | [Gitee](https://gitee.com/openharmony-sig/rntpc_toolbar-android) | [Gitee Releases](https://gitee.com/openharmony-sig/rntpc_toolbar-android/releases) |
+| Third-party Version | Release Information | Supported RN Version |
+|---------------------|---------------------|----------------------|
+| <= 0.2.1 | [toolbar-android Releases(deprecated)](https://github.com/react-native-oh-library/toolbar-android/releases) | 0.72 |
+| >= 0.2.2 | [toolbar-android Releases](https://gitee.com/openharmony-sig/rntpc_toolbar-android/releases) | 0.77 |
-## 1.Installation and Usage
+## 1. Installation & Usage
-Go to the project directory and execute the following instruction:
+Navigate to your project directory and run the following command:
-#### npm
+#### **npm**
```bash
+# 0.72
+npm install @react-native-oh-tpl/toolbar-android
+# 0.77
npm install @react-native-ohos/toolbar-android
```
-#### yarn
+#### **yarn**
```bash
+# 0.72
+yarn add @react-native-oh-tpl/toolbar-android
+# 0.77
yarn add @react-native-ohos/toolbar-android
```
-The following code shows the basic use scenario of the repository:
+The following code demonstrates basic usage scenarios of this library:
-> [!WARNING] The name of the imported repository remains unchanged.
+> [!WARNING] The import library name remains unchanged during use.
```js
import React, { useState } from "react";
@@ -114,66 +120,74 @@ const styles = StyleSheet.create({
export default App;
```
-## 2.Manual Link
+## 2. Manual Link
This step provides guidance for manually configuring native dependencies.
-Open the `harmony` directory of the HarmonyOS project in DevEco Studio.
+First, you need to open the HarmonyOS project `harmony` within your project using DevEco Studio.
-### 2.1.Overrides RN SDK
+### 2.1. Overrides RN SDK
-To ensure the project relies on the same version of the RN SDK, you need to add an `overrides` field in the project's root `oh-package.json5` file, specifying the RN SDK version to be used. The replacement version can be a specific version number, a semver range, or a locally available HAR package or source directory.
+To ensure the project depends on the same version of RN SDK, you need to add the overrides field to the root `oh-package.json5`, pointing to the RN SDK version required by the project. The replaced version can be a specific version number, a fuzzy version, or a locally existing HAR package or source code directory.
-For more information about the purpose of this field, please refer to the [official documentation](https://developer.huawei.com/consumer/en/doc/harmonyos-guides-V5/ide-oh-package-json5-V5#en-us_topic_0000001792256137_overrides).
+For details about this field, please read the [official documentation](https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/ide-oh-package-json5-V5#zh-cn_topic_0000001792256137_overrides)
```json
{
...
"overrides": {
- "@rnoh/react-native-openharmony": "^0.72.38" // ohpm version
- // "@rnoh/react-native-openharmony" : "./react_native_openharmony.har" // a locally available HAR package
- // "@rnoh/react-native-openharmony" : "./react_native_openharmony" // source code directory
+ "@rnoh/react-native-openharmony": "^0.72.38" // ohpm online version
+ // "@rnoh/react-native-openharmony" : "./react_native_openharmony.har" // path to local har package
+ // "@rnoh/react-native-openharmony" : "./react_native_openharmony" // path to source code
}
}
```
-### 2.2.Introducing Native Code
+### 2.2. Import Native Code
-Currently, two methods are available:
+There are currently two methods:
-- Use the HAR file.
-- Directly link to the source code。
+- Import via har package;
+- Link source code directly.
-Method 1 (recommended): Use the HAR file.
+Method 1: Import via har package (Recommended)
-> [!TIP] The HAR file is stored in the `harmony` directory in the installation path of the third-party library.
+> [!TIP] The har package is located in the `harmony` folder of the installed third-party library path.
-Open `entry/oh-package.json5` file and add the following dependencies:
+Open `entry/oh-package.json5` and add the following dependencies:
+<= 0.2.1
+```json
+"dependencies": {
+ "@react-native-oh-tpl/toolbar-android": "file:../../node_modules/@react-native-oh-tpl/toolbar-android/harmony/toolbar_android.har"
+ }
+```
+
+>= 0.2.2
```json
"dependencies": {
"@react-native-ohos/toolbar-android": "file:../../node_modules/@react-native-ohos/toolbar-android/harmony/toolbar_android.har"
}
```
-Click the `sync` button in the upper right corner.
+Click the `sync` button in the top right corner.
-Alternatively, run the following instruction on the terminal:
+Or execute in the terminal:
```bash
cd entry
ohpm install
```
-Method 2: Directly link to the source code.
+Method 2: Link Source Code Directly
-> [!TIP] For details, see [Directly Linking Source Code](/en/link-source-code.md).
+> [!TIP] If you need to link source code directly, please refer to the [Direct Link Source Code Guide](/zh-cn/link-source-code.md)
-### 2.3.Configuring CMakeLists and Introducing ToolbarAndroidPackage
+### 2.3. Configure CMakeLists and Import ToolbarAndroidPackage
-Open `entry/src/main/cpp/CMakeLists.txt` and add the following code:
+Open `entry/src/main/cpp/CMakeLists.txt` and add:
-```diff
+```cmake
project(rnapp)
cmake_minimum_required(VERSION 3.4.1)
set(CMAKE_SKIP_BUILD_RPATH TRUE)
@@ -189,6 +203,9 @@ add_compile_definitions(WITH_HITRACE_SYSTRACE)
# RNOH_BEGIN: manual_package_linking_1
add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package)
+// <= 0.2.1
++ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/toolbar-android/src/main/cpp" ./toolbar-android)
+// >= 0.2.2
+ add_subdirectory("${OH_MODULES}/@react-native-ohos/toolbar-android/src/main/cpp" ./toolbar-android)
# RNOH_END: manual_package_linking_1
@@ -205,9 +222,9 @@ target_link_libraries(rnoh_app PUBLIC rnoh_sample_package)
# RNOH_END: link_packages
```
-Open `entry/src/main/cpp/PackageProvider.cpp` and add the following code:
+Open `entry/src/main/cpp/PackageProvider.cpp` and add:
-```diff
+```c++
...
+ #include "ToolbarAndroidPackage.h"
@@ -221,14 +238,17 @@ std::vector> PackageProvider::getPackages(Package::Cont
}
```
-### 2.4.Introducing RNCCheckBoxPackage to ArkTS
+### 2.4. Import RNCCheckBoxPackage on the ArkTS Side
-> [!TIP] Required for version `v0.2.22` and above
+> [!TIP] Required for version v0.2.22 and above
Open `entry/src/main/ets/RNPackagesFactory.ts` and add:
-```diff
+```typescript
...
+// <=0.2.1
++ import {ToolbarAndroidPackage} from '@react-native-oh-tpl/toolbar-android/src/main/ets/ToolbarAndroidPackage';
+// >=0.2.2
+ import {ToolbarAndroidPackage} from '@react-native-ohos/toolbar-android/src/main/ets/ToolbarAndroidPackage';
export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
@@ -236,15 +256,17 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
+ return [new ToolbarAndroidPackage(ctx)];
];
}
-
```
-### 2.5.Introducing RNCToolbarAndroid Component to ArkTS
+### 2.5. Import RNCToolbarAndroid Component on the ArkTS Side
-Find `function buildCustomRNComponent()`, which is usually located in `entry/src/main/ets/pages/index.ets` or `entry/src/main/ets/rn/LoadBundle.ets`, and add the following code:
+Find **function buildCustomRNComponent()**, usually located in `entry/src/main/ets/pages/index.ets` or `entry/src/main/ets/rn/LoadBundle.ets`, and add:
-```diff
+```typescript
...
+// <=0.2.1
++ import { RNCToolbarAndroid} from '@react-native-oh-tpl/toolbar-android/src/main/ets/RNCToolbarAndroid'
+// >=0.2.2
+ import { RNCToolbarAndroid} from '@react-native-ohos/toolbar-android/src/main/ets/RNCToolbarAndroid'
@Builder
@@ -261,74 +283,77 @@ Find `function buildCustomRNComponent()`, which is usually located in `entry/src
...
```
-> [!TIP] If the repository uses a mixed solution, the component name needs to be added.
+> [!TIP] This library uses a hybrid solution and requires adding the component name.
-Find the constant `arkTsComponentNames` in `entry/src/main/ets/pages/index.ets` or `entry/src/main/ets/rn/LoadBundle.ets` and add the component name to the array.
+Find the constant `arkTsComponentNames` in `entry/src/main/ets/pages/index.ets` or `entry/src/main/ets/rn/LoadBundle.ets` and add the component name to the array:
-```diff
+```typescript
const arkTsComponentNames: Array = [
...
+ RNCToolbarAndroid.NAME
];
```
-### 2.6.Running
+### 2.6. Run
-Click the `sync` button in the upper right corner.
+Click the `sync` button in the top right corner.
-Alternatively, run the following instruction on the terminal:
+Or execute in the terminal:
```bash
cd entry
ohpm install
```
-Then build and run the code.
+Then compile and run.
+
+## 3. Constraints & Limitations
-## 3.Constraints
+### 3.1 Compatibility
-### 3.1Compatibility
+To use this library, you need the correct React-Native and RNOH versions. Additionally, you need to use the matching DevEco Studio and phone ROM.
-To use this repository, you need to use the correct React-Native and RNOH versions. In addition, you need to use DevEco Studio and the ROM on your phone.
+Verified in the following versions:
-Check the release version information in the release address of the third-party library: [@react-native-ohos/toolbar-android Releases](https://gitee.com/openharmony-sig/rntpc_toolbar-android/releases)
+1. RNOH: 0.72.38; SDK: HarmonyOS-5.0.0(API12); ROM: 5.0.0.107;
+2. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.868; ROM: 6.0.0.112;
-## 4.Properties
+## 4. Props
-> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library.
+> [!TIP] The "Platform" column indicates the platforms supported by the original third-party library for that property.
-> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android.
+> [!TIP] The "HarmonyOS Support" column: 'Yes' means the property is supported on the HarmonyOS platform; 'No' means it is not supported; 'partially' means partial support. The usage method is consistent across platforms, with effects benchmarked against iOS or Android.
Inherits [View Props](https://reactnative.dev/docs/view#props).
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ----------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- |-----------| -------- | ----------------- |
-| actions | Sets possible actions on the toolbar as part of the action menu. These are displayed as icons or text on the right side of the widget. If they don't fit they are placed in an 'overflow' menu. | array of object: {title: string,icon: ImageSource,show: enum('always', 'ifRoom', 'never'),showWithText: bool} | No | Android | yes |
-| contentInsetStart | Sets the content inset for the toolbar starting edge. | number | No | Android | yes |
-| contentInsetEnd | Sets the content inset for the toolbar ending edge. | number | No | Android | yes |
-| logo | Sets the toolbar logo. | ImageSource | No | Android | yes |
-| navIcon | Sets the navigation icon. | ImageSource | No | Android | yes |
-| onActionSelected | Callback that is called when an action is selected. The only argument that is passed to the callback is the position of the action in the actions array. | function | No | Android | yes |
-| onIconClicked | Callback called when the icon is selected. | function | No | Android | yes |
-| overflowIcon | Sets the overflow icon. | ImageSource | No | Android | yes |
-| rtl | Used to set the toolbar direction to RTL. | bool | No | Android | yes |
-| subtitle | Sets the toolbar subtitle. | string | No | Android | yes |
-| subtitleColor | Sets the toolbar subtitle color. | string | No | Android | yes |
-| title | Sets the toolbar title. | string | No | Android | yes |
-| titleColor | Sets the toolbar title color. | string | No | Android | yes |
-
-#### 4.1.Props of ImageSource
-
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------ | ------------------------------------------------------ | ------ | -------- | -------- | ----------------- |
-| uri | load image from a url, e.g. require('./some_icon.png') | string | Yes | android | yes |
-| width | the width of the image | number | No | android | yes |
-| height | the height of the image | number | No | android | yes |
-
-## 5.Known Issues
-
-## 6.Others
-
-## 7.License
-
-This project is licensed under [The MIT License (MIT)](https://gitee.com/openharmony-sig/rntpc_toolbar-android/blob/master/LICENSE).
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+|-----------------|---------------------------------------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------------------------------|-----------|----------|-------------------|
+| actions | Sets possible actions on the toolbar as part of the action menu. These are displayed as icons or text on the right side of the widget. If they don't fit they are placed in an 'overflow' menu. | array of object: {title: string,icon: ImageSource,show: enum('always', 'ifRoom', 'never'),showWithText: bool} | No | Android | Yes |
+| contentInsetStart | Sets the content inset for the toolbar starting edge. | number | No | Android | Yes |
+| contentInsetEnd | Sets the content inset for the toolbar ending edge. | number | No | Android | Yes |
+| logo | Sets the toolbar logo. | ImageSource | No | Android | Yes |
+| navIcon | Sets the navigation icon. | ImageSource | No | Android | Yes |
+| onActionSelected | Callback that is called when an action is selected. The only argument that is passed to the callback is the position of the action in the actions array. | function | No | Android | Yes |
+| onIconClicked | Callback called when the icon is selected. | function | No | Android | Yes |
+| overflowIcon | Sets the overflow icon. | ImageSource | No | Android | Yes |
+| rtl | Used to set the toolbar direction to RTL. | bool | No | Android | Yes |
+| subtitle | Sets the toolbar subtitle. | string | No | Android | Yes |
+| subtitleColor | Sets the toolbar subtitle color. | string | No | Android | Yes |
+| title | Sets the toolbar title. | string | No | Android | Yes |
+| titleColor | Sets the toolbar title color. | string | No | Android | Yes |
+
+#### 4.1. Props of ImageSource
+
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+|------|---------------------------------------------------------------------------------------------------------------------------------------|--------|----------|----------|-------------------|
+| uri | load image from a url, e.g. require('./some_icon.png') | string | Yes | android | Yes |
+| width | the width of the image | number | No | android | Yes |
+| height | the height of the image | number | No | android | Yes |
+
+## 5. Known Issues
+
+## 6. Others
+
+## 7. License
+
+This project is based on [The MIT License (MIT)](https://gitee.com/openharmony-sig/rntpc_toolbar-android/blob/master/LICENSE). Feel free to enjoy and contribute to open source.
\ No newline at end of file
diff --git a/en/react-native-keys.md b/en/react-native-keys.md
index 2653c5ab5f8482ba213dc2d09149747ac40695da..f614bd17247cda008d3b93c44b422bc1e42ccefd 100644
--- a/en/react-native-keys.md
+++ b/en/react-native-keys.md
@@ -1,4 +1,4 @@
-> Template version: v0.2.2
+> Template Version: v0.2.2
react-native-keys
@@ -12,37 +12,50 @@
-> [!TIP] [GitHub address](https://github.com/react-native-oh-library/react-native-keys)
+> [!TIP] [Github Address](https://github.com/react-native-oh-library/react-native-keys)
-## Installation and Usage
+## Installation & Usage
-Find the matching version information in the release address of a third-party library: [@react-native-oh-library/react-native-keys Releases](https://github.com/react-native-oh-library/react-native-keys/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package.
+Please check the corresponding version information in the third-party library's Releases:
-Go to the project directory and execute the following instruction:
+| Third-party Version | Release Information | Supported RN Version |
+| ------------------- | ------------------- | -------------------- |
+| 0.7.11 | [@react-native-oh-library/react-native-keys Releases](https://github.com/react-native-oh-library/react-native-keys/releases) | 0.72 |
+| 0.8.0 | [@react-native-ohos/react-native-keys Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-keys/releases) | 0.77 |
+For older versions not published to npm, please refer to the [Installation Guide](/zh-cn/tgz-usage.md) to install the tgz package.
+Navigate to your project directory and run the following command:
-#### npm
+#### **npm**
```bash
+# 0.72
npm install @react-native-oh-tpl/react-native-keys
+
+# 0.77
+npm install @react-native-ohos/react-native-keys
```
-#### yarn
+#### **yarn**
```bash
+# 0.72
yarn add @react-native-oh-tpl/react-native-keys
+
+# 0.77
+yarn add @react-native-ohos/react-native-keys
```
-The following code shows the basic use scenario of the repository:
+The following code demonstrates basic usage scenarios of this library:
-> [!WARNING] The name of the imported repository remains unchanged.
+> [!WARNING] The import library name remains unchanged during use.
-1. Create a new file keys.development.json in the root of your React Native app and add Envs in secure object for protected envs variables and add Envs in public for public usage this:
+1. Create a new file named `keys.development.json` in the root directory of your React Native app. Add environment variables that need protection in the secure object, and add environment variables for public use in the public object, as shown below:
```json
{
@@ -62,23 +75,23 @@ The following code shows the basic use scenario of the repository:
2. Use Public Keys & Secure Keys
```js
-import Keys from "react-native-keys";
+import Keys from 'react-native-keys';
Keys.API_URL;
Keys.URI_SCHEME;
-Keys.secureFor("API_TOKEN");
-Keys.secureFor("GOOGLE_API_KEY");
-Keys.secureFor("SECRET_KEY");
+Keys.secureFor('API_TOKEN');
+Keys.secureFor('GOOGLE_API_KEY');
+Keys.secureFor('SECRET_KEY');
```
## Link
-Currently, HarmonyOS does not support AutoLink. Therefore, you need to manually configure the linking.
+Currently, HarmonyOS does not support AutoLink, so the Link step requires manual configuration.
-Open the `harmony` directory of the HarmonyOS project in DevEco Studio.
+First, you need to open the HarmonyOS project `harmony` within your project using DevEco Studio.
-### 1. Adding the overrides Field to oh-package.json5 File in the Root Directory of the Project
+### 1. Add the overrides field to the root `oh-package.json`
```json
{
@@ -89,15 +102,20 @@ Open the `harmony` directory of the HarmonyOS project in DevEco Studio.
}
```
-### 2. Introducing Native Code
+### 2. Import Native Code
+
+There are currently two methods:
-Currently, two methods are available:
+1. Import via har package (Recommended until IDE functionality is improved);
+2. Link source code directly.
-Method 1 (recommended): Use the HAR file. (Recommended)
+Method 1: Import via har package (Recommended)
-> [!TIP] The HAR file is stored in the `harmony` directory in the installation path of the third-party library.
+> [!TIP] The har package is located in the `harmony` folder of the installed third-party library path.
-Open `entry/oh-package.json5` file and add the following dependencies:
+Open `entry/oh-package.json5` and add the following dependencies:
+
+v0.7.11
```json
"dependencies": {
@@ -106,24 +124,33 @@ Open `entry/oh-package.json5` file and add the following dependencies:
}
```
-Click the `sync` button in the upper right corner.
+v0.8.0
+
+```json
+"dependencies": {
+ "@rnoh/react-native-openharmony": "file:../react_native_openharmony",
+ "@react-native-ohos/react-native-keys": "file:../../node_modules/@react-native-ohos/react-native-keys/harmony/rnoh_keys.har"
+ }
+```
+
+Click the `sync` button in the top right corner.
-Alternatively, run the following instruction on the terminal:
+Or execute in the terminal:
```bash
cd entry
ohpm install
```
-Method 2: Directly link to the source code.
+Method 2: Link Source Code Directly
-> [!TIP] For details, see [Directly Linking Source Code](/en/link-source-code.md).
+> [!TIP] If you need to link source code directly, please refer to the [Direct Link Source Code Guide](/zh-cn/link-source-code.md).
-### 3. Configuring CMakeLists and Introducing RNOHKeysPackage
+### 3. Configure CMakeLists and Import RNOHKeysPackage
-Open `entry/src/main/cpp/CMakeLists.txt` and add the following code:
+Open `entry/src/main/cpp/CMakeLists.txt` and add:
-```diff
+```cmake
project(rnapp)
cmake_minimum_required(VERSION 3.4.1)
set(CMAKE_SKIP_BUILD_RPATH TRUE)
@@ -141,7 +168,10 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn)
# RNOH_BEGIN: manual_package_linking_1
add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package)
+// v0.77.11
+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-keys/src/main/cpp" ./rnohkeys)
+// v0.8.0
++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-keys/src/main/cpp" ./rnohkeys)
# RNOH_END: manual_package_linking_1
file(GLOB GENERATED_CPP_FILES "./generated/*.cpp")
@@ -159,9 +189,9 @@ target_link_libraries(rnoh_app PUBLIC rnoh_sample_package)
# RNOH_END: manual_package_linking_2
```
-Open `entry/src/main/cpp/PackageProvider.cpp` and add the following code:
+Open `entry/src/main/cpp/PackageProvider.cpp` and add:
-```diff
+```c++
#include "RNOH/PackageProvider.h"
#include "generated/RNOHGeneratedPackage.h"
#include "SamplePackage.h"
@@ -178,13 +208,16 @@ std::vector> PackageProvider::getPackages(Package::Cont
}
```
-### 4. Introducing RNKeysPackage to ArkTS
+### 4. Import RNKeysPackage on the ArkTS Side
-Open the `entry/src/main/ets/RNPackagesFactory.ts` file and add the following code:
+Open `entry/src/main/ets/RNPackagesFactory.ts` and add:
-```diff
+```typescript
...
+ // v0.7.11
+ import { RNKeysPackage } from '@react-native-oh-tpl/react-native-keys';
+ // v0.8.0
++ import { RNKeysPackage } from '@react-native-ohos/react-native-keys';
export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
return [
@@ -194,48 +227,51 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
}
```
-### 5. Creating a Pre-running Script in DevEco (Generating the Encryption/Decryption Code and Compiling Configuration Files)
+### 5. Create Pre-run Script in DevEco (Generate Encryption/Decryption Code and Build Configuration Files)
-> [!TIP] After the configuration is complete, click **Apply** for the configuration to take effect.
+> [!TIP] Remember to click the Apply button to make the configuration take effect after completing the following steps.
-1. Click **Entry** in the upper right corner and choose **Edit Configurations** to open the configuration panel.
-2. Click **+** in the upper left corner of the panel, select **Shell Script**, open the configuration panel of the new script, and configure the script as prompted.
+1. Click entry in the top right corner -> Edit Configurations... to open the configuration panel
+2. Click the + in the top left corner of the panel, select Shell Script, open the new script configuration panel, and configure according to the following image prompts:

-3. Choose **Entry** > **Before Lunch**, click **+**, select **Run Another Configuration**, select the **Shell Script** configured in the previous step, and drag the configuration to the upper part of **Hvigor-Build Make**.
+3. Configure entry -> Before Launch, click the plus sign to select Run Another Configuration, select the Shell Script configured in the previous step, and drag the configuration above Hvigor-Build Make:

-### 6. Running
+### 6. Run
-Click the `sync` button in the upper right corner.
+Click the `sync` button in the top right corner.
-Alternatively, run the following instruction on the terminal:
+Or execute in the terminal:
```bash
cd entry
ohpm install
```
-Then build and run the code.
+Then compile and run.
-## Constraints
+## Constraints & Limitations
### Compatibility
-To use this repository, you need to use the correct React-Native and RNOH versions. In addition, you need to use DevEco Studio and the ROM on your phone.
+To use this library, you need the correct React-Native and RNOH versions. Additionally, you need to use the matching DevEco Studio and phone ROM.
+
+Verified in the following versions:
-Check the release version information in the release address of the third-party library: [@react-native-oh-library/react-native-keys Releases](https://github.com/react-native-oh-library/react-native-keys/releases)
+1. RNOH: 0.72.38; SDK: HarmonyOS-5.0.0(API12); ROM: 5.0.0.107;
+2. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.868; ROM: 6.0.0.112;
## API
-> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library.
+> [!TIP] The "Platform" column indicates the platforms supported by the original third-party library for that property.
-> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android.
+> [!TIP] The "HarmonyOS Support" column: 'Yes' means the property is supported on the HarmonyOS platform; 'No' means it is not supported; 'partially' means partial support. The usage method is consistent across platforms, with effects benchmarked against iOS or Android.
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| --------------- | -------------------- | -------- | -------- | ----------- | ----------------- |
-| Keys attributes | Get public value | object | no | iOS/Android | yes |
-| Keys.publicKeys | Get all public value | function | no | iOS/Android | yes |
-| Keys.secureFor | Get secret value | function | no | iOS/Android | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+|-----------------|----------------------|----------|----------|-------------|-------------------|
+| Keys attributes | Get public value | object | No | iOS/Android | Yes |
+| Keys.publicKeys | Get all public values | function | No | iOS/Android | Yes |
+| Keys.secureFor | Get secret value | function | No | iOS/Android | Yes |
## Known Issues
@@ -243,4 +279,4 @@ Check the release version information in the release address of the third-party
## License
-This project is licensed under [The MIT License (MIT)](https://github.com/numandev1/react-native-keys/blob/main/LICENSE).
+This project is based on [The MIT License (MIT)](https://github.com/numandev1/react-native-keys/blob/main/LICENSE). Feel free to enjoy and contribute to open source.
\ No newline at end of file
diff --git a/en/react-native-mqtt.md b/en/react-native-mqtt.md
index db577b59605647b29e1eb149411a6f65eb52f00d..effebf6058c71a01bb6908c09aa2d0857d4cfc57 100644
--- a/en/react-native-mqtt.md
+++ b/en/react-native-mqtt.md
@@ -1,14 +1,19 @@
-> Template version: v0.3.0
+> Template version: v0.2.2
react-native-mqtt
+
+
+
+
+
+
+
+
-Please go to the Releases release address of the third-party library to view the supporting version information: [react-native-mqtt Releases](https://github.com/Introvertuous/react-native-mqtt/releases). For older versions that are not published to npm, install the tgz package by referring to the [Installation Guide](/en/tgz-usage-en.md).
-| Version | Support RN version|
-| ---------- |---------- |
-| 1.3.1 | 0.72/0.77 |
+> [!TIP] [GitHub address](https://github.com/Introvertuous/react-native-mqtt)
## Installation and Usage
@@ -124,7 +129,7 @@ This document is verified based on the following versions:
1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.25; IDE: DevEco Studio 5.0.3.400; ROM: 3.0.0.25;
2. RNOH: 0.72.33; SDK: OpenHarmony 5.0.0.71(API Version 12 Release); IDE: DevEco Studio 5.0.3.900; ROM: NEXT.0.0.71;
-3. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0.47 (API Version 20 Release); IDE: DevEco Studio 6.0.0 Release; ROM: 6.0.0.108 SP6;
+
## Properties
> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library.
diff --git a/en/react-native-progress.md b/en/react-native-progress.md
index 514d371b847654c4427dd59a10d084a1d760b64e..32849230460d8cce2fb067f1eb8676e5767788bf 100644
--- a/en/react-native-progress.md
+++ b/en/react-native-progress.md
@@ -4,7 +4,7 @@
react-native-progress
-
+
@@ -14,15 +14,9 @@
> [!TIP] [GitHub address](https://github.com/react-native-oh-library/react-native-progress)
-| Version | Package Name | Repository | Release | Support RN version |
-| ------- | ------------ | ----------- |----------|--------------------|
-| 5.0.1 | @react-native-oh-tpl/react-native-progress |[Github](https://github.com/react-native-oh-library/react-native-progress) | [Github Releases](https://github.com/react-native-oh-library/react-native-progress) | 0.72 |
-| 5.1.0 | @react-native-ohos/react-native-progress |[GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-progress) |[GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-audio/releases) | 0.77 |
-
## Installation and Usage
-Please go to the Releases release address of the third-party library to view the supporting version information: [@react-native-ohos/react-native-progress Releases](https://github.com/react-native-oh-library/react-native-progress/releases).
-
+Find the matching version information in the release address of a third-party library: [@react-native-oh-tpl/react-native-progress Releases](https://github.com/react-native-oh-library/react-native-progress/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package.
Go to the project directory and execute the following instruction:
@@ -33,21 +27,13 @@ Go to the project directory and execute the following instruction:
#### **npm**
```bash
-# V0.72
npm install @react-native-oh-tpl/react-native-progress
-
-# V0.77
-npm install @react-native-ohos/react-native-progress
```
#### **yarn**
```bash
-# V0.72
-yarn install @react-native-oh-tpl/react-native-progress
-
-#V0.77
-yarn install @react-native-ohos/react-native-progress
+yarn add @react-native-oh-tpl/react-native-progress
```
@@ -154,10 +140,7 @@ The HarmonyOS implementation of this library depends on the native code from @re
To use this repository, you need to use the correct React-Native and RNOH versions. In addition, you need to use DevEco Studio and the ROM on your phone.
-Please go to the Releases release address of the third-party library to view the supporting version information: [@react-native-ohos/react-native-progress Releases](https://github.com/react-native-oh-library/react-native-progress/releases).
-
-1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.403; ROM: 3.0.0.25;
-2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
+Check the release version information in the release address of the third-party library: [@react-native-oh-tpl/react-native-progress Releases](https://github.com/react-native-oh-library/react-native-progress/releases)
## Properties
diff --git a/en/react-native-sticky-parallax-header.md b/en/react-native-sticky-parallax-header.md
index 12e6a604bd7b0e0992ad37f67d1e59d13bab0340..7ed9cf630d04f609b80e7f02b4297d9d6499f6d6 100644
--- a/en/react-native-sticky-parallax-header.md
+++ b/en/react-native-sticky-parallax-header.md
@@ -12,17 +12,11 @@
-> [!TIP] [GitHub address](https://github.com/netguru/sticky-parallax-header)
-
-| Version | Package Name | Repository | Release | Support RN version |
-| ------- | ------------ | ----------- |----------|--------------------|
-| 1.1.1 | @react-native-oh-tpl/react-native-sticky-parallax-header | [Github](https://github.com/react-native-oh-library/react-native-sticky-parallax-header)| [GitHub Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases) | 0.72 |
-| 1.2.0 | @react-native-ohos/react-native-sticky-parallax-header | [Github ](https://github.com/react-native-oh-library/react-native-sticky-parallax-header)|[GitHub Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases) | 0.77 |
-
+> [!TIP] [GitHub address](https://github.com/react-native-oh-library/react-native-sticky-parallax-header)
## Installation and Usage
-Please go to the Releases address of the third-party library to view the corresponding version information:[@react-native-oh-tpl/react-native-sticky-parallax-header Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases).
+Find the matching version information in the release address of a third-party library and download an applicable .tgz package: [@react-native-oh-tpl/react-native-sticky-parallax-header Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases).
Go to the project directory and execute the following instruction:
@@ -33,21 +27,13 @@ Go to the project directory and execute the following instruction:
#### **npm**
```bash
-# 0.72
npm install @react-native-oh-tpl/react-native-sticky-parallax-header
-
-#0.77
-npm install @react-native-ohos/react-native-sticky-parallax-header
```
#### **yarn**
```bash
-# 0.72
-yarn install @react-native-oh-tpl/react-native-sticky-parallax-header
-
-#0.77
-yarn install @react-native-ohos/react-native-sticky-parallax-header
+yarn add @react-native-oh-tpl/react-native-sticky-parallax-header
```
@@ -171,10 +157,7 @@ If it is not included, follow the guide provided in [@react-native-oh-tpl/react-
To use this repository, you need to use the correct React-Native and RNOH versions. In addition, you need to use DevEco Studio and the ROM on your phone.
-Please go to the Releases address of the third-party library to view the corresponding version information:[@react-native-oh-tpl/react-native-sticky-parallax-header Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases).
-
-1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.403; ROM: 3.0.0.25;
-2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
+Find the matching version information in the release address of a third-party library and download an applicable .tgz package: [@react-native-oh-tpl/react-native-sticky-parallax-header Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases).
## Headers
diff --git a/en/react-native-tcp-socket.md b/en/react-native-tcp-socket.md
index cc0103b9dae71a21e35f44cdf551d2c595bbaa6e..0259565354e21776de9f18c614efe4aee423bf1c 100644
--- a/en/react-native-tcp-socket.md
+++ b/en/react-native-tcp-socket.md
@@ -1,4 +1,4 @@
-> Template version: v0.2.2
+> Template Version: v0.2.2
react-native-tcp-socket
@@ -7,40 +7,53 @@
-
+
-> [!TIP] [GitHub address](https://github.com/react-native-oh-library/react-native-tcp-socket)
+> [!TIP] [Github Address](https://github.com/react-native-oh-library/react-native-tcp-socket)
-## Installation and Usage
+## Installation & Usage
-Find the matching version information in the release address of a third-party library: [@react-native-oh-tpl/react-native-tcp-socket Releases](https://github.com/react-native-oh-library/react-native-tcp-socket/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package.
+Please check the corresponding version information in the third-party library's Releases:
-Go to the project directory and execute the following instruction:
+| Third-party Version | Release Information | Supported RN Version |
+| ------------------- | ------------------- | -------------------- |
+| 6.2.0 | [@react-native-oh-tpl/react-native-tcp-socket Releases](https://github.com/react-native-oh-library/react-native-tcp-socket/releases) | 0.72 |
+| 6.3.1 | [@react-native-ohos/react-native-tcp-socket Releases]() | 0.77 |
+For older versions not published to npm, please refer to the [Installation Guide](/zh-cn/tgz-usage.md) to install the tgz package.
+Navigate to your project directory and run the following command:
#### **npm**
```bash
+# V0.72
npm install @react-native-oh-tpl/react-native-tcp-socket
+
+# V0.77
+npm install @react-native-ohos/react-native-tcp-socket
```
#### **yarn**
```bash
+# V0.72
yarn add @react-native-oh-tpl/react-native-tcp-socket
+
+# V0.77
+yarn add @react-native-ohos/react-native-tcp-socket
```
-The following code shows the basic use scenario of the repository:
+The following code demonstrates basic usage scenarios of this library:
-> [!WARNING] The name of the imported repository remains unchanged.
+> [!WARNING] The import library name remains unchanged during use.
```js
import React, {useState} from 'react';
@@ -509,28 +522,28 @@ export const TcpSocketDemo = () => {
keyExtractor={item => item.id.toString()}
/>
- creating a tcp server
+ Create TCP Server
- creating a tcp client
+ Create TCP Client
- client and server communication
+ Client-Server Communication
- pause and resume of data
+ Data Pause & Resume
- long data transmission
+ Long Data Transfer
- close link
+ Close Connection
- creating a TLS server
+ Create TLS Server
- creating a TLS client
+ Create TLS Client
);
@@ -567,17 +580,19 @@ const styles = StyleSheet.create({
});
```
-## Use Codegen
+## Using Codegen
-If this repository has been adapted to `Codegen`, generate the bridge code of the third-party library by using the `Codegen`. For details, see [Codegen Usage Guide](/en/codegen.md).
+> [!TIP] V6.3.1 does not require executing Codegen
+
+This library has been adapted for `Codegen`. Before use, you need to actively execute the command to generate the third-party library bridging code. Please refer to the [Codegen Usage Documentation](/zh-cn/codegen.md) for details.
## Link
-Currently, HarmonyOS does not support AutoLink. Therefore, you need to manually configure the linking.
+Currently, HarmonyOS does not support AutoLink, so the Link step requires manual configuration.
-Open the `harmony` directory of the HarmonyOS project in DevEco Studio.
+First, you need to open the HarmonyOS project `harmony` within your project using DevEco Studio.
-### 1. Adding the overrides Field to oh-package.json5 File in the Root Directory of the Project
+### 1. Add the overrides field to the root `oh-package.json5`
```json
{
@@ -588,15 +603,20 @@ Open the `harmony` directory of the HarmonyOS project in DevEco Studio.
}
```
-### 2. Introducing Native Code
+### 2. Import Native Code
+
+There are currently two methods:
-Currently, two methods are available:
+1. Import via har package (Recommended until IDE functionality is improved);
+2. Link source code directly.
-Method 1 (recommended): Use the HAR file.
+Method 1: Import via har package (Recommended)
-> [!TIP] The HAR file is stored in the `harmony` directory in the installation path of the third-party library.
+> [!TIP] The har package is located in the `harmony` folder of the installed third-party library path.
-Open `entry/oh-package.json5` file and add the following dependencies:
+Open `entry/oh-package.json5` and add the following dependencies:
+
+- V6.2.0
```json
"dependencies": {
@@ -605,27 +625,101 @@ Open `entry/oh-package.json5` file and add the following dependencies:
}
```
-Click the `sync` button in the upper right corner.
+- V6.3.1
+
+```JSON
+"dependencies": {
+ "@rnoh/react-native-openharmony" : "file:../react_native_openharmony",
+ "@react-native-ohos/react-native-tcp-socket": "file:../../node_modules/@react-native-ohos/react-native-tcp-socket/harmony/tcp_socket.har"
+ }
+```
+
+Click the `sync` button in the top right corner.
-Alternatively, run the following instruction on the terminal:
+Or execute in the terminal:
```bash
cd entry
ohpm install
```
-Method 2: Directly link to the source code.
+Method 2: Link Source Code Directly
+
+> [!TIP] If you need to link source code directly, please refer to the [Direct Link Source Code Guide](/zh-cn/link-source-code.md).
+
+### 3. Configure CMakeLists and Import TcpSocketPackage
+
+> [!TIP] If using version 6.2.0, skip this chapter.
+
+Open `entry/src/main/cpp/CMakeLists.txt` and add:
+
+```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)
-> [!TIP] For details, see [Directly Linking Source Code](/en/link-source-code.md).
+add_subdirectory("${RNOH_CPP_DIR}" ./rn)
-### 3. Introducing TcpSocketPackage to ArkTS
+# RNOH_BEGIN: manual_package_linking_1
+add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package)
++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-tcp-socket/src/main/cpp" ./tcp-socket)
+# RNOH_END: manual_package_linking_1
-Open the `entry/src/main/ets/RNPackagesFactory.ts` file and add the following code:
+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_tcp_socket)
+# RNOH_END: manual_package_linking_2
+```
+
+Open `entry/src/main/cpp/PackageProvider.cpp` and add:
+
+```c++
+#include "RNOH/PackageProvider.h"
+#include "generated/RNOHGeneratedPackage.h"
+#include "SamplePackage.h"
++ #include "TcpSocketPackage.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. Import TcpSocketPackage on the ArkTS Side
+
+Open `entry/src/main/ets/RNPackagesFactory.ts` and add:
```diff
...
+// v6.2.0
+ import {TcpSocketPackage} from '@react-native-oh-tpl/react-native-tcp-socket/ts';
+// v6.3.1
++ import {TcpSocketPackage} from '@react-native-ohos/react-native-tcp-socket/ts';
+
export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
return [new SamplePackage(ctx),
+ new TcpSocketPackage(ctx)
@@ -633,32 +727,35 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
}
```
-### 4. Running
+### 5. Run
-Click the `sync` button in the upper right corner.
+Click the `sync` button in the top right corner.
-Alternatively, run the following instruction on the terminal:
+Or execute in the terminal:
```bash
cd entry
ohpm install
```
-Then build and run the code.
+Then compile and run.
-## Constraints
+## Constraints & Limitations
### Compatibility
-To use this repository, you need to use the correct React-Native and RNOH versions. In addition, you need to use DevEco Studio and the ROM on your phone.
+To use this library, you need the correct React-Native and RNOH versions. Additionally, you need to use the matching DevEco Studio and phone ROM.
+
+Verified in the following versions:
-Check the release version information in the release address of the third-party library: [@react-native-oh-tpl/react-native-tcp-socket Releases](https://github.com/react-native-oh-library/react-native-tcp-socket/releases)
+1. RNOH: 0.72.38; SDK: HarmonyOS-5.0.0(API12); ROM: 5.0.0.107;
+2. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.868; ROM: 6.0.0.112;
### Permission Requirements
-需要获取网络信息权限:"ohos.permission.GET_NETWORK_INFO"和使用网络权限:"ohos.permission.INTERNET",配置方法如下:
+Requires network information permission: "ohos.permission.GET_NETWORK_INFO" and internet usage permission: "ohos.permission.INTERNET". Configure as follows:
-打开`entry/src/main/module.json5`,添加:
+Open `entry/src/main/module.json5` and add:
```json
"requestPermissions": [
@@ -674,100 +771,100 @@ Check the release version information in the release address of the third-party
## API
-> [!TIP] The **Platform** column indicates the platform where the properties are supported in the original third-party library.
-
-> [!TIP] If the value of **HarmonyOS Support** is **yes**, it means that the HarmonyOS platform supports this property; **no** means the opposite; **partially** means some capabilities of this property are supported. The usage method is the same on different platforms and the effect is the same as that of iOS or Android.
-
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| -------------------------------------------- | --------------------------------------------------- | -------- | -------- | ----------- | ----------------- |
-| connect(options, callback) | Same as createConnection,Creating a TCP Socket | function | no | Android,iOS | yes |
-| createServer(connectionListener) | Creating a TCP Server | function | no | Android,iOS | yes |
-| createConnection(options, callback) | Creating a TCP Socket | function | no | Android,iOS | yes |
-| createTLSServer(options, connectionListener) | Creating a TLS-based TCP Server | function | no | Android,iOS | yes |
-| connectTLS | Creating a TLS-based encrypted connection | function | no | Android,iOS | yes |
-| isIP | Check whether a character string is an IP address | function | no | Android,iOS | yes |
-| isIPv4 | Check whether a character string is an IPv4 address | function | no | Android,iOS | yes |
-| isIPv6 | Check whether a character string is an IPv6 address | function | no | Android,iOS | yes |
-| Server | TCP Server Object | object | no | Android,iOS | yes |
-| Socket | TCP Socket Object | object | no | Android,iOS | yes |
-| TLSServer | TLS Server Object | object | no | Android,iOS | yes |
-| TLSSocket | TLS Socket Object | object | no | Android,iOS | yes |
+> [!TIP] The "Platform" column indicates the platforms supported by the original third-party library for that property.
+
+> [!TIP] The "HarmonyOS Support" column: 'Yes' means the property is supported on the HarmonyOS platform; 'No' means it is not supported; 'partially' means partial support. The usage method is consistent across platforms, with effects benchmarked against iOS or Android.
+
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---------------------------------------------------------- | --------------------------------------------------- | -------- | -------- | ----------- | ----------------- |
+| connect(options, callback) | Same as createConnection, Creating a TCP Socket | function | No | Android,iOS | Yes |
+| createServer(connectionListener) | Creating a TCP Server | function | No | Android,iOS | Yes |
+| createServer(options,connectionListener)6.3.1+ | Creating a TCP Server | function | No | Android,iOS | Yes |
+| createConnection(options, callback) | Creating a TCP Socket | function | No | Android,iOS | Yes |
+| createTLSServer(options, connectionListener) | Creating a TLS-based TCP Server | function | No | Android,iOS | Yes |
+| connectTLS | Creating a TLS-based encrypted connection | function | No | Android,iOS | Yes |
+| isIP | Check whether a character string is an IP address | function | No | Android,iOS | Yes |
+| isIPv4 | Check whether a character string is an IPv4 address | function | No | Android,iOS | Yes |
+| isIPv6 | Check whether a character string is an IPv6 address | function | No | Android,iOS | Yes |
+| Server | TCP Server Object | object | No | Android,iOS | Yes |
+| Socket | TCP Socket Object | object | No | Android,iOS | Yes |
+| TLSServer | TLS Server Object | object | No | Android,iOS | Yes |
+| TLSSocket | TLS Socket Object | object | No | Android,iOS | Yes |
### Server
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- | ----------- | ----------------- |
-| address() | Returns the bound `address`, the address `family` name, and `port` of the server as reported by the operating system if listening | function | no | Android,iOS | yes |
-| listen(options, callback) | Start a server listening for connections | function | no | Android,iOS | yes |
-| close(callback) | Stops the server from accepting new connections and keeps existing connections | function | no | Android,iOS | yes |
-| getConnections(callback) | Asynchronously get the number of concurrent connections on the server | function | no | Android,iOS | yes |
-| listening | whether to enable the listening | boolean | no | Android,iOS | yes |
-| on('close') | Triggered when the server is shut down | event | no | Android,iOS | yes |
-| on('connection') | Triggered when the server receives a new connection | event | no | Android,iOS | yes |
-| on('error') | Triggered when an error occurs on the server | event | no | Android,iOS | yes |
-| on('listening') | Triggered when the server starts listening | event | no | Android,iOS | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ----------------- |
+| address() | Returns the bound address, address family name, and port of the server | function | No | Android,iOS | Yes |
+| listen(options, callback) | Start a server listening for connections | function | No | Android,iOS | Yes |
+| close(callback) | Stops the server from accepting new connections and keeps existing connections | function | No | Android,iOS | Yes |
+| getConnections(callback) | Asynchronously get the number of concurrent connections on the server | function | No | Android,iOS | Yes |
+| listening | whether to enable the listening | boolean | No | Android,iOS | Yes |
+| on('close') | Triggered when the server is shut down | event | No | Android,iOS | Yes |
+| on('connection') | Triggered when the server receives a new connection | event | No | Android,iOS | Yes |
+| on('error') | Triggered when an error occurs on the server | event | No | Android,iOS | Yes |
+| on('listening') | Triggered when the server starts listening | event | No | Android,iOS | Yes |
### Socket
-
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| --------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- | ----------- | ----------------- |
-| address() | Returns the bound `address`, the address `family` name and `port` of the socket as reported | function | no | Android,iOS | yes |
-| destroy() | Ensures that no more I/O activity happens on this socket. Destroys the stream and closes the connection | function | no | Android,iOS | yes |
-| end() | Half-closes the socket. i.e., it sends a FIN packet. It is possible the server will still send some data | function | no | Android,iOS | yes |
-| setEncoding(encoding) | Set the encoding for the socket as a Readable Stream. By default, no encoding is assigned and stream data will be returned as `Buffer` objects | function | no | Android,iOS | yes |
-| setNoDelay(noDelay) | Set no delay | function | no | Android,iOS | yes |
-| setTimeout() | Sets the socket to timeout after `timeout` milliseconds of inactivity on the socket. By default `TcpSocket` do not have a timeout | function | no | Android,iOS | yes |
-| write(buffer, encoding, cb) | Sends data on the socket. The second parameter specifies the encoding in the case of a string — it defaults to UTF8 encoding | function | no | Android,iOS | yes |
-| pause() | Pauses the reading of data. That is, `'data'` events will not be emitted. Useful to throttle back an upload | function | no | Android,iOS | yes |
-| resume() | Resumes reading after a call to `socket.pause()` | function | no | Android,iOS | yes |
-| writableNeedDrain | whether need to wait for data to be written to the socket | boolean | no | Android,iOS | yes |
-| bytesRead | Indicates the number of bytes of data that have been read from the socket | number | no | Android,iOS | yes |
-| bytesWritten | get the number of bytes last written to the socket | number | no | Android,iOS | yes |
-| connecting | whether the current socket is being connected | boolean | no | Android,iOS | yes |
-| destroyed | Whether the socket has been destroyed | boolean | no | Android,iOS | yes |
-| localAddress | Local ip address | string | no | Android,iOS | yes |
-| localPort | Local port | number | no | Android,iOS | yes |
-| remoteAddress | remote server IP address | string | no | Android,iOS | yes |
-| remoteFamily | remote server IP address type | string | no | Android,iOS | yes |
-| remotePort | remote server port | number | no | Android,iOS | yes |
-| pending | Whether has pending data to be sent to the remote server | boolean | no | Android,iOS | yes |
-| timeout | The timeout period for the socket, in milliseconds. The default timeout period is 30 seconds | number | no | Android,iOS | yes |
-| readyState | the state of socket,`0`: not connected,`1`:connected,2: closing,3:closed | number | no | Android,iOS | yes |
-| on('pause') | Triggered when pauses the reading of data | event | no | Android,iOS | yes |
-| on('resume') | Triggered when Resumes the reading of data | event | no | Android,iOS | yes |
-| on('close') | Triggered when socket is closed | event | no | Android,iOS | yes |
-| on('connect') | Triggered when socket is connected | event | no | Android,iOS | yes |
-| on('data') | Triggered when socket receives data | event | no | Android,iOS | yes |
-| on('drain') | Triggered when the buffer becomes empty, indicating that data can be written to the socke | event | no | Android,iOS | yes |
-| on('error') | Triggered when an error occurs on the socket | event | no | Android,iOS | yes |
-| on('timeout') | Triggered When the connection or data transmission times out | event | no | Android,iOS | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ---- | ---- | -------- | ---- | -------- |
+| address() | Returns the bound address, address family name and port of the socket | function | No | Android,iOS | Yes |
+| destroy() | Ensures that no more I/O activity happens on this socket. Destroys the stream and closes the connection | function | No | Android,iOS | Yes |
+| end() | Half-closes the socket. i.e., it sends a FIN packet. It is possible the server will still send some data | function | No | Android,iOS | Yes |
+| setEncoding(encoding) | Set the encoding for the socket as a Readable Stream. By default, no encoding is assigned and stream data will be returned as `Buffer` objects | function | No | Android,iOS | Yes |
+| setNoDelay(noDelay) | Set no delay | function | No | Android,iOS | Yes |
+| setTimeout() | Sets the socket to timeout after `timeout` milliseconds of inactivity on the socket. By default `TcpSocket` do not have a timeout | function | No | Android,iOS | Yes |
+| write(buffer, encoding, cb) | Sends data on the socket. The second parameter specifies the encoding in the case of a string — it defaults to UTF8 encoding | function | No | Android,iOS | Yes |
+| pause() | Pauses the reading of data. That is, `'data'` events will not be emitted. Useful to throttle back an upload | function | No | Android,iOS | Yes |
+| resume() | Resumes reading after a call to `socket.pause()` | function | No | Android,iOS | Yes |
+| writableNeedDrain | whether need to wait for data to be written to the socket | boolean | No | Android,iOS | Yes |
+| bytesRead | Indicates the number of bytes of data that have been read from the socket | number | No | Android,iOS | Yes |
+| bytesWritten | get the number of bytes last written to the socket | number | No | Android,iOS | Yes |
+| connecting | whether the current socket is being connected | boolean | No | Android,iOS | Yes |
+| destroyed | Whether the socket has been destroyed | boolean | No | Android,iOS | Yes |
+| localAddress | Local ip address | string | No | Android,iOS | Yes |
+| localPort | Local port | number | No | Android,iOS | Yes |
+| remoteAddress | remote server IP address | string | No | Android,iOS | Yes |
+| remoteFamily | remote server IP address type | string | No | Android,iOS | Yes |
+| remotePort | remote server port | number | No | Android,iOS | Yes |
+| pending | Whether has pending data to be sent to the remote server | boolean | No | Android,iOS | Yes |
+| timeout | The timeout period for the socket, in milliseconds. The default timeout period is 30 seconds | number | No | Android,iOS | Yes |
+| readyState | the state of socket,`0`: not connected,`1`:connected,2: closing,3:closed | number | No | Android,iOS | Yes |
+| on('pause') | Triggered when pauses the reading of data | event | No | Android,iOS | Yes |
+| on('resume') | Triggered when Resumes the reading of data | event | No | Android,iOS | Yes |
+| on('close') | Triggered when socket is closed | event | No | Android,iOS | Yes |
+| on('connect') | Triggered when socket is connected | event | No | Android,iOS | Yes |
+| on('data') | Triggered when socket receives data | event | No | Android,iOS | Yes |
+| on('drain') | Triggered when the buffer becomes empty, indicating that data can be written to the socket | event | No | Android,iOS | Yes |
+| on('error') | Triggered when an error occurs on the socket | event | No | Android,iOS | Yes |
+| on('timeout') | Triggered When the connection or data transmission times out | event | No | Android,iOS | Yes |
### TLSServer
-[!TIP] TLSServer 继承自 Server 对象,拥有 Server 对象的所有 Properties、方法和事件,以下仅列出其独有的 Properties。
+[!TIP] TLSServer inherits from the Server object and has all properties, methods, and events of the Server object. Only its unique properties are listed below.
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------------- | ----------------------------------------------------- | -------- | -------- | ----------- | ----------------- |
-| setSecureContext(options) | Set Security Context | function | no | Android,iOS | yes |
-| on('secureConnection') | Triggered When a secure TLS connection is established | event | no | Android,iOS | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ---- | ---- | -------- | ---- | -------- |
+| setSecureContext(options) | Set Security Context | function | No | Android,iOS | Yes |
+| on('secureConnection') | Triggered When a secure TLS connection is established | event | No | Android,iOS | Yes |
### TLSSocket
-[!TIP] TLSSocket 继承自 Socket 对象,拥有 Socket 对象的所有 Properties、方法和事件,以下仅列出其独有的 Properties。
+[!TIP] TLSSocket inherits from the Socket object and has all properties, methods, and events of the Socket object. Only its unique properties are listed below.
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| -------------------- | ---------------------------------------------------- | -------- | -------- | ----------- | ----------------- |
-| getCertificate() | Get a Local Certificate Information | function | no | Android | yes |
-| getPeerCertificate() | Get the Certificate Information of the Remote Server | function | no | Android | yes |
-| on('secureConnect') | Triggered When a secure connection is established | event | no | Android,iOS | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ---- | ---- | -------- | ---- | -------- |
+| getCertificate() | Get Local Certificate Information | function | No | Android | Yes |
+| getPeerCertificate() | Get the Certificate Information of the Remote Server | function | No | Android | Yes |
+| on('secureConnect') | Triggered When a secure connection is established | event | No | Android,iOS | Yes |
## Known Issues
-- [ ] 目前无法实现多线程: [issue#3](https://github.com/react-native-oh-library/react-native-tcp-socket/issues/3)
-- [ ] 获取证书只有异步接口,目前返回值是一个 promise,与安卓上同步接口不一致: [issue#4](https://github.com/react-native-oh-library/react-native-tcp-socket/issues/4)
+- [ ] Currently unable to implement multithreading: [issue#3](https://github.com/react-native-oh-library/react-native-tcp-socket/issues/3)
+- [ ] Certificate retrieval only has an async interface, currently returns a promise, inconsistent with the synchronous interface on Android: [issue#4](https://github.com/react-native-oh-library/react-native-tcp-socket/issues/4)
## Others
## License
-This project is licensed under [The MIT License (MIT)](https://github.com/Rapsssito/react-native-tcp-socket/blob/master/LICENSE).
+This project is based on [The MIT License (MIT)](https://github.com/Rapsssito/react-native-tcp-socket/blob/master/LICENSE). Feel free to enjoy and contribute to open source.
\ No newline at end of file
diff --git a/en/react-native-text-gradient.md b/en/react-native-text-gradient.md
index fce166e198b1be644ee774620092a810fa89decc..1b80fbdd6c9cb01caf91afebf50fe4b9a3aa3c7e 100644
--- a/en/react-native-text-gradient.md
+++ b/en/react-native-text-gradient.md
@@ -14,16 +14,16 @@
> [!TIP] [Github address](https://github.com/react-native-oh-library/react-native-text-gradient)
-| Version | Package Name | Repository | Release | Support RN version |
-| ------- | ------------ | ----------- |----------|--------------------|
-| 0.1.7 | @react-native-oh-tpl/react-native-text-gradient |[GitHub ](https://github.com/react-native-oh-library/react-native-text-gradient)| [GitHub Release ](https://github.com/react-native-oh-library/react-native-text-gradient/releases)| 0.72 |
-| 0.2.0 | @react-native-ohos/react-native-text-gradient | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient) | [GitCode Release](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient/releases)| 0.77 |
-
## Installation and Usage
Please go to the corresponding Release release address of the third-party library to view the version information of the Release package:
+| version | Releases info | Support RN version |
+| ---------- | ------------------------------------------------------------ | ---------- |
+| 0.1.7-0.0.4 | [@react-native-oh-tpl/react-native-text-gradient Releases](https://github.com/react-native-oh-library/react-native-text-gradient/releases) | 0.72 |
+| 0.2.0 | [@react-native-ohos/react-native-text-gradient Releases]() | 0.77 |
+
Go to the project directory and execute the following instruction:
diff --git a/en/react-native-vision-camera.md b/en/react-native-vision-camera.md
index 6547a294263d7551efaa61eb2061354424623732..b316437b784664dc9ddb34dcba69419c02d1dac6 100644
--- a/en/react-native-vision-camera.md
+++ b/en/react-native-vision-camera.md
@@ -19,14 +19,7 @@
## Installation and Usage
-Please go to the corresponding Release release address of the third-party library to view the version information of the Release package:
-
-| version | Releases info | Support RN version |
-| ---------- | ------------------------------------------------------------ | ---------- |
-| 4.0.2 | [@react-native-oh-tpl/react-native-vision-camera Releases](https://github.com/react-native-oh-library/react-native-vision-camera/releases) | 0.72 |
-| 4.7.1 | [@react-native-ohos/react-native-vision-camera Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-vision-camera/blob/br_rnoh0.77/CHANGELOG.md) | 0.77 |
-
-For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package.
+Find the matching version information in the release address of a third-party library:[@react-native-oh-tpl/react-native-vision-camera Releases](https://github.com/react-native-oh-library/react-native-vision-camera/releases).For older versions that are not published to npm, please refer to the [installation guide](/en/tgz-usage-en.md) to install the tgz package.
Go to the project directory and execute the following instruction:
> [!TIP] Additional note: The installation commands differ between the 0.72 and 0.77 React Native framework versions, as follows:
@@ -295,10 +288,9 @@ Then build and run the code.
### Compatibility
-This document is verified based on the following versions:
+To use this repository, you need to use the correct React-Native and RNOH versions. In addition, you need to use DevEco Studio and the ROM on your phone.
-1. RNOH: 0.72.75; SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
-2. RNOH:0.77.18;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
+Check the release version information in the release address of the third-party library: [@react-native-oh-tpl/react-native-vision-camera Releases](https://github.com/react-native-oh-library/react-native-vision-camera/releases)
### Permission Requirements
diff --git a/en/victory-native-xl.md b/en/victory-native-xl.md
index 875469a293b75277767d8c344c4694c68adee5a5..132cddee88a2cd2335b01ecf6ce551413a4e99f4 100644
--- a/en/victory-native-xl.md
+++ b/en/victory-native-xl.md
@@ -15,36 +15,22 @@
> [!TIP] [GitHub address](https://github.com/react-native-oh-library/victory-native-xl)
-| Version | Package Name | Repository | Release | Support RN version |
-| ------- | ------------ | ----------- |----------|--------------------|
-| 41.1.0 | @react-native-oh-tpl/victory-native-xl | [Github](https://github.com/react-native-oh-library/victory-native-xl)| [Github Releases](https://github.com/react-native-oh-library/victory-native-xl/releases) | 0.72 |
-| 41.17.5 | @react-native-ohos/victory-native-xl | [Github](https://github.com/react-native-oh-library/victory-native-xl)| [Github Releases](https://github.com/react-native-oh-library/victory-native-xl/releases) | 0.77 |
-
## Installation and Usage
-Please go to the Releases address of the third-party library to view the corresponding version information:[@react-native-oh-tpl/victory-native-xl Releases](https://github.com/react-native-oh-library/victory-native-xl/releases).
-
+Find the matching version information in the release address of a third-party library and download an applicable .tgz package:[@react-native-oh-tpl/victory-native-xl Releases](https://github.com/react-native-oh-library/victory-native-xl/releases) 。对于未发布到npm的旧版本,请参考[安装指南](/en/tgz-usage-en.md)安装tgz包。
Go to the project directory and execute the following instruction:
#### **npm**
```bash
-# V0.72
npm install @react-native-oh-tpl/victory-native-xl
-
-# V0.77
-npm install @react-native-ohos/victory-native-xl
```
#### **yarn**
```bash
-# V0.72
yarn add @react-native-oh-tpl/victory-native-xl
-
-# V0.77
-yarn add @react-native-ohos/victory-native-xl
```
The following code shows the basic use scenario of the repository:
@@ -109,10 +95,7 @@ If it is not included, follow the guide provided in [@react-native-oh-tpl/react-
To use this repository, you need to use the correct React-Native and RNOH versions. In addition, you need to use DevEco Studio and the ROM on your phone.
-Please go to the Releases address of the third-party library to view the corresponding version information:[@react-native-oh-tpl/victory-native-xl Releases](https://github.com/react-native-oh-library/victory-native-xl/releases).
-
-1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.403; ROM: 3.0.0.25;
-2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
+Check the release version information in the release address of the third-party library: [@react-native-oh-tpl/victory-native-xl Releases](https://github.com/react-native-oh-library/victory-native-xl/releases)
## Properties (If Any)
@@ -124,129 +107,118 @@ See details [victory-native-xl](https://github.com/FormidableLabs/victory-native
### Cartesian Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| --------------------------------------- | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- |
-| data | An array of objects to be used as data points for the chart | array[] | yes | all | yes |
-| xKey | A string value indicating the key of each data[number] object to be used on the independent (x) axis for charting. E.g. "day" if you want to use the "day" field of the data points for the x-axis | string | yes | all | yes |
-| yKeys | A string[] array of string indicating the keys of each data[number] object to be used on the dependent (y) axis for charting. E.g. yKeys={["lowTmp", "highTmp"]} if you want to chart both high and low temperatures on the y-axis and those values have keys of lowTmp and highTmp respectively | string[] | yes | all | yes |
-| children | The children prop is a render function whose sole argument is an object that exposes transformed data for you to use in your drawing operations. For example, the children render function's argument has a points field that exposes a version of your input data that's transformed to be plotted on the Canvas (see the Example section above for an example of this) | function | yes | all | yes |
-| padding | A number or an object of shape { left?: number; right?: number; top?: number; bottom?: number; } that specifies that padding between the outer bounds of the Skia canvas and where the charting bounds will occur | number | no | all | yes |
-| domain | An object of shape { x?: [number] \| [number, number]; y?: [number] \| [number, number] } that can be specified to control the upper and lower bounds of each axis. It defaults to the min and max of each range respectively | object | no | all | yes |
-| domainPadding | A number or an object of shape { left?: number; right?: number; top?: number; bottom?: number; } that specifies that padding between the outer bounds of the charting area (e.g. where the axes lie) and where chart elements will be plotted | object | no | all | yes |
-| axisOptions | The axisOptions is an optional prop allows you to configure the axes and grid of the chart. If it is not present then the chart will not render any axes or grid | object | no | all | yes |
-| chartPressState | The chartPressState prop allows you to pass in Reanimated SharedValues that will be used to track the user's "press" gesture on the chart. This is generally used for creating some sort of tooltip/active value indicator. See the Chart Gestures page for more in-depth information on how to use this prop | object | no | all | yes |
-| renderOutside | The renderOutside prop is identical to the children prop in form, but it will render elements at the root of the Skia canvas (not inside of a clipping group). This allows you to render elements outside of the bounds of any axes that you have configured | object | no | all | yes |
-| onChartBoundsChange | The onChartBoundsChange prop is a function of the shape onChartBoundsChange?: (bounds: ChartBounds) => void; that exposes the chart bounds, useful if you need access to the chart's bounds for your own custom drawing purposes | function | no | all | yes |
-| gestureLongPressDelay | The gestureLongPressDelay prop allows you to set the delay in milliseconds before the pan gesture is activated. Defaults to 100 | number | no | all | yes |
-| viewport41.17.5+ | An object of shape { x?: [number, number]; y?: [number, number] } that controls the visible range of the chart. Unlike domain which sets the absolute bounds of the data, viewport determines what portion of the data is currently visible in the chart window. | object | no | all | yes |
-| xAxis41.17.5+ | The xAxis is an optional prop allows you to configure the X axis of the chart. If it is not present then the chart will not render any X axis. | object | no | all | yes |
-| yAxis41.17.5+ | The yAxis is an optional prop allows you to configure the Y axes of the chart. If it is not present then the chart will not render any Y-axis. To render multiple Y axes, pass in multiple Y axis objects to the array. | object | no | all | yes |
-| frame41.17.5+ | The frame is an optional prop allows you to configure the frame of the chart. If it is not present then the chart will not render any frame. | object | no | all | yes |
-| chartPressConfig41.17.5+ | The chartPressConfig prop allows you to configure the pan gesture handler used for chart interactions. | object | no | all | yes |
-| transformState41.17.5+ | The transformState prop allows you to pass in a transform state object that enables pan and zoom interactions with the chart. | object | no | all | yes |
-| transformConfig41.17.5+ | An optional configuration object for customizing transform behavior when transformState is provided. | object | no | all | yes |
-| customGestures41.17.5+ | The customGestures prop allows you to provide custom gesture handlers that will work alongside (or instead of) the default chart press gestures. It accepts a ComposedGesture from react-native-gesture-handler. | object | no | all | yes |
-| actionsRef41.17.5+ | The actionsRef prop allows you to get programmatic access to certain chart actions. It accepts a ref object that will be populated with methods to control chart behavior. | object | no | all | yes |
-| onScaleChange41.17.5+ | A callback 60function that is called whenever the chart's scales change, either due to data updates or zoom/pan transformations. The function receives two parameters: · xScale: The current x-axis scale (a d3 linear scale) · yScale: The current y-axis scale (a d3 linear scale). | function | no | all | yes |
-| gestureHandlerConfig41.17.5+ | The gestureHandlerConfig prop allows you to configure the underlying React Native Gesture Handler instance. This is useful for fine-tuning gesture interactions, such as enabling/disabling context menus or adjusting touch behavior on web platforms. | object | no | web | no |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| data | An array of objects to be used as data points for the chart | array[] | yes | all | yes
+| xKey | A string value indicating the key of each data[number] object to be used on the independent (x) axis for charting. E.g. "day" if you want to use the "day" field of the data points for the x-axis | string | yes | all | yes
+| yKeys | A string[] array of string indicating the keys of each data[number] object to be used on the dependent (y) axis for charting. E.g. yKeys={["lowTmp", "highTmp"]} if you want to chart both high and low temperatures on the y-axis and those values have keys of lowTmp and highTmp respectively | string[] | yes | all | yes
+| children | The children prop is a render function whose sole argument is an object that exposes transformed data for you to use in your drawing operations. For example, the children render function's argument has a points field that exposes a version of your input data that's transformed to be plotted on the Canvas (see the Example section above for an example of this)| function | yes | all | yes
+| padding | A number or an object of shape { left?: number; right?: number; top?: number; bottom?: number; } that specifies that padding between the outer bounds of the Skia canvas and where the charting bounds will occur | number | no | all | yes
+| domain | An object of shape { x?: [number] \| [number, number]; y?: [number] \| [number, number] } that can be specified to control the upper and lower bounds of each axis. It defaults to the min and max of each range respectively | object | no | all | yes
+| domainPadding | A number or an object of shape { left?: number; right?: number; top?: number; bottom?: number; } that specifies that padding between the outer bounds of the charting area (e.g. where the axes lie) and where chart elements will be plotted | object | no | all | yes
+| axisOptions | The axisOptions is an optional prop allows you to configure the axes and grid of the chart. If it is not present then the chart will not render any axes or grid | object | no | all | yes
+| chartPressState | The chartPressState prop allows you to pass in Reanimated SharedValues that will be used to track the user's "press" gesture on the chart. This is generally used for creating some sort of tooltip/active value indicator. See the Chart Gestures page for more in-depth information on how to use this prop | object | no | all | yes
+| renderOutside | The renderOutside prop is identical to the children prop in form, but it will render elements at the root of the Skia canvas (not inside of a clipping group). This allows you to render elements outside of the bounds of any axes that you have configured | object | no | all | yes
+| onChartBoundsChange | The onChartBoundsChange prop is a function of the shape onChartBoundsChange?: (bounds: ChartBounds) => void; that exposes the chart bounds, useful if you need access to the chart's bounds for your own custom drawing purposes | function | no | all | yes
+| gestureLongPressDelay | The gestureLongPressDelay prop allows you to set the delay in milliseconds before the pan gesture is activated. Defaults to 100 | number | no | all | yes
+
### Line Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------ | ------------------------------------------------------------ | ------- | -------- | -------- | ----------------- |
-| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes |
-| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points changes | object | no | all | yes |
-| curveType | A CurveType value that indicates the type of curve should be drawn (e.g. linear or natural) | string | no | all | yes |
-| connectMissingData | The connectMissingData: boolean value that indicates whether missing data should be interpolated for the resulting Path. If set to true, the output will be a single, connected line chart path (even if there are missing data values). If set to false, if there is missing data values – the path will consist of multiple disconnected "parts" | boolean | no | all | yes |
-| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes |
-| strokeWidth | Set the width of the line | number | no | all | yes |
-| color | Set the color of the line | string | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes
+| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points changes | object | no | all | yes
+| curveType | A CurveType value that indicates the type of curve should be drawn (e.g. linear or natural) | string | no | all | yes
+| connectMissingData | The connectMissingData: boolean value that indicates whether missing data should be interpolated for the resulting Path. If set to true, the output will be a single, connected line chart path (even if there are missing data values). If set to false, if there is missing data values – the path will consist of multiple disconnected "parts"| boolean | no | all | yes
+| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes
+| strokeWidth| Set the width of the line | number| no | all | yes
+| color| Set the color of the line | string| no | all | yes
+
### Area Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------ | ------------------------------------------------------------ | ------- | -------- | -------- | ----------------- |
-| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes |
-| y0 | A number that indicates where the "bottom" of the area path should run. This number should be in canvas coordinates | number | no | all | yes |
-| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points changes | object | no | all | yes |
-| curveType | A CurveType value that indicates the type of curve should be drawn (e.g. linear or natural) | string | no | all | yes |
-| connectMissingData | The connectMissingData: boolean value that indicates whether missing data should be interpolated for the resulting Path. If set to true, the output will be a single, connected area chart path (even if there are missing data values). If set to false, if there is missing data values – the path will consist of multiple disconnected "parts" | boolean | no | all | yes |
-| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes |
-| color | Set the color of the area | string | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes
+| y0 | A number that indicates where the "bottom" of the area path should run. This number should be in canvas coordinates | number | no | all | yes
+| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points changes | object | no | all | yes
+| curveType | A CurveType value that indicates the type of curve should be drawn (e.g. linear or natural) | string | no | all | yes
+| connectMissingData | The connectMissingData: boolean value that indicates whether missing data should be interpolated for the resulting Path. If set to true, the output will be a single, connected area chart path (even if there are missing data values). If set to false, if there is missing data values – the path will consist of multiple disconnected "parts" | boolean | no | all | yes
+| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes
+| color| Set the color of the area | string| no | all | yes
+
### Bar Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------------- | ------------------------------------------------------------ | ------- | -------- | -------- | ----------------- |
-| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes |
-| chartBounds | A ChartBounds object needed to appropriately draw the bars. This generally comes from the chartBounds render argument of CartesianChart | object | no | all | yes |
-| innerPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bars should be "white space". Defaults to 0.2. Use 0 for no gap between bars, and values closer to 1 to make bars increasingly narrow | number | no | all | yes |
-| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points change | object | no | all | yes |
-| roundedCorners | The roundedCorners prop allows you to customize the roundedness of each corner of the Bar component. It's an object type that defines the radii for the top-left, top-right, bottom-right, and bottom-left corners | object | no | all | yes |
-| barWidth | The barWidth prop takes a number and sets the width of the bar to that number. If not provided, the default is determined by the chartBounds and number of data points. Takes precendence over the barCount prop. Use this for the most fine grained control of bar width | number | no | all | yes |
-| barCount | The barCount prop takes a number and sets the width of the bar as if there X data points. If not provided, the default is determined by the chartBounds and number of data points. Useful for getting a fixed bar width regardless of the number of data points. Use this for a more general control of bar width | number | no | all | yes |
-| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes |
-| color | Set the color of the bar | string | no | all | yes |
-| labels41.17.5+ | The labels prop allows you to enable and customize the data label of the Bar component. The data label text is the Y-axis value associated with the Bar component. | object | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes
+| chartBounds | A ChartBounds object needed to appropriately draw the bars. This generally comes from the chartBounds render argument of CartesianChart | object | no | all | yes
+| innerPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bars should be "white space". Defaults to 0.2. Use 0 for no gap between bars, and values closer to 1 to make bars increasingly narrow | number | no | all | yes
+| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points change | object | no | all | yes
+| roundedCorners | The roundedCorners prop allows you to customize the roundedness of each corner of the Bar component. It's an object type that defines the radii for the top-left, top-right, bottom-right, and bottom-left corners | object | no | all | yes
+| barWidth | The barWidth prop takes a number and sets the width of the bar to that number. If not provided, the default is determined by the chartBounds and number of data points. Takes precendence over the barCount prop. Use this for the most fine grained control of bar width | number | no | all | yes
+| barCount | The barCount prop takes a number and sets the width of the bar as if there X data points. If not provided, the default is determined by the chartBounds and number of data points. Useful for getting a fixed bar width regardless of the number of data points. Use this for a more general control of bar width | number | no | all | yes
+| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes
+| color| Set the color of the bar| string| no | all | yes
+
### BarGroup Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------- | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- |
-| chartBounds | A ChartBounds object needed to appropriately draw the bars. This generally comes from the chartBounds render argument of CartesianChart | object | no | all | yes |
-| betweenGroupPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bar groups should be "white space". Defaults to 0.2. Use 0 for no gap between groups, and values closer to 1 to make bars increasingly narrow | number | no | all | yes |
-| withinGroupPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bars within a group should be "white space". Defaults to 0.2. Use 0 for no gap between bars within a group, and values closer to 1 to make bars increasingly narrow | number | no | all | yes |
-| barWidth | The barWidth prop takes a number and sets the width of the bar to that number. If not provided, the default is determined by a combination of the total available width for the group of bars, the number of bars in the group, and the padding between the bars within the group. Takes precedence over barCount prop. Use this for the most fine grained control of bar width | number | no | all | yes |
-| barCount | The barCount prop takes a number and sets the width of the bar as if there X data points. If not provided, the default is determined by the chartBounds and number of data points. Useful for getting a fixed bar width regardless of the number of data points. Use this for a more general control of bar width | number | no | all | yes |
-| onBarSizeChange | That alerts the consumer when the size of the bars/groups changes, useful for if you're building a custom tooltip and need to know the size of the groups/bars | function | no | all | yes |
-| roundedCorners | The roundedCorners prop allows you to customize the roundedness of each corner of a BarGroup.Bar component. It's an object type that defines the radii for the top-left, top-right, bottom-right, and bottom-left corners | object | no | all | yes |
-| children | An array of BarGroup.Bar elements (see below) that represent the bars to add to the bar group | object | no | all | yes |
-| color | Set the color of the bar | string | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| chartBounds | A ChartBounds object needed to appropriately draw the bars. This generally comes from the chartBounds render argument of CartesianChart | object | no | all | yes
+| betweenGroupPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bar groups should be "white space". Defaults to 0.2. Use 0 for no gap between groups, and values closer to 1 to make bars increasingly narrow | number | no | all | yes
+| withinGroupPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bars within a group should be "white space". Defaults to 0.2. Use 0 for no gap between bars within a group, and values closer to 1 to make bars increasingly narrow | number | no | all | yes
+| barWidth | The barWidth prop takes a number and sets the width of the bar to that number. If not provided, the default is determined by a combination of the total available width for the group of bars, the number of bars in the group, and the padding between the bars within the group. Takes precedence over barCount prop. Use this for the most fine grained control of bar width | number | no | all | yes
+| barCount | The barCount prop takes a number and sets the width of the bar as if there X data points. If not provided, the default is determined by the chartBounds and number of data points. Useful for getting a fixed bar width regardless of the number of data points. Use this for a more general control of bar width | number | no | all | yes
+| onBarSizeChange | That alerts the consumer when the size of the bars/groups changes, useful for if you're building a custom tooltip and need to know the size of the groups/bars | function | no | all | yes
+| roundedCorners | The roundedCorners prop allows you to customize the roundedness of each corner of a BarGroup.Bar component. It's an object type that defines the radii for the top-left, top-right, bottom-right, and bottom-left corners | object | no | all | yes
+| children | An array of BarGroup.Bar elements (see below) that represent the bars to add to the bar group | object | no | all | yes
+| color| Set the color of the bar | string| no | all | yes
+
### Scatter Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ----------- | ------------------------------------------------------------ | ------------ | -------- | -------- | ----------------- |
-| points | TA PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes |
-| radius | radius of the circle, half the width of the square | number | no | all | yes |
-| shape | One of the following ScatterShape values that determines the shape of each point to be drawn | ScatterShape | no | all | yes |
-| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points change | object | no | all | yes |
-| children | An array of BarGroup.Bar elements (see below) that represent the bars to add to the bar group | object | no | all | yes |
-| style | set style stroke or fill | string | no | all | yes |
-| strokeWidth | Set the width of the line | number | no | all | yes |
-| color | Set the color of the bar | string | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| points | TA PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes
+| radius | radius of the circle, half the width of the square | number | no | all | yes
+| shape | One of the following ScatterShape values that determines the shape of each point to be drawn | ScatterShape | no | all | yes
+| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points change | object | no | all | yes
+| children | An array of BarGroup.Bar elements (see below) that represent the bars to add to the bar group | object | no | all | yes
+| style| set style stroke or fill | string| no | all | yes
+| strokeWidth| Set the width of the line | number| no | all | yes
+| color| Set the color of the bar| string| no | all | yes
### Polar Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| -------------- | ------------------------------------------------------------ | ------- | -------- | -------- | ----------------- |
-| data | An array of objects to be used as data points for the chart | array[] | yes | all | yes |
-| labelKey | A string value indicating the key of each data[number] object to be used. Currently only used on the legend part of the chart. In the future we may add support for a variety of labels within the chart | string | yes | all | yes |
-| valueKey | A string value indicating the key of each data[number] object to be used to draw a slice of the Pie | string | yes | all | yes |
-| colorKey | A string value indicating the key of each data[number] object to be used to draw a slice of the Pie | string | yes | all | yes |
-| children | The only supported children of a PolarChart is currently a Pie.Chart See the Pie Chart for more details | object | no | all | yes |
-| containerStyle | A StyleProp that styles the View which wraps the Canvas of the Polar chart | object | no | all | yes |
-| canvasStyle | A StyleProp that styles the Canvas upon which the Polar chart is drawn | object | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| data | An array of objects to be used as data points for the chart | array[] | yes | all | yes
+| labelKey | A string value indicating the key of each data[number] object to be used. Currently only used on the legend part of the chart. In the future we may add support for a variety of labels within the chart | string | yes | all | yes
+| valueKey | A string value indicating the key of each data[number] object to be used to draw a slice of the Pie | string | yes | all | yes
+| colorKey | A string value indicating the key of each data[number] object to be used to draw a slice of the Pie | string | yes | all | yes
+| children | The only supported children of a PolarChart is currently a Pie.Chart See the Pie Chart for more details | object | no | all | yes
+| containerStyle | A StyleProp that styles the View which wraps the Canvas of the Polar chart | object | no | all | yes
+| canvasStyle | A StyleProp that styles the Canvas upon which the Polar chart is drawn | object | no | all | yes
### Pie.Chart
**Bar related props for making Capped Bar chart**
-
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------ | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- |
-| innerRadius | A number or string (as a percentage) which turns the Pie chart into a Donut chart. The innerRadius prop is the radius of the inner circle of the donut chart. If not provided, the chart will remain a Pie chart | number | no | all | yes |
-| circleSweepDegrees | A number which defines how many degrees of the chart should be drawn. The default is 360 which will draw a full circle. If you want to draw a partial circle, you can set this prop to a value between 0 and 360 | number | no | all | yes |
-| startAngle | A number which defines the starting angle of the chart. Changing this prop will rotate the chart | number | no | all | yes |
-| children | The children prop is a render function which maps through the data and whose sole argument is each individual slice of the pie, allowing you to customize each slice as needed. E.g. this slice will have all the data needed to render a Pie.Slice | function | no | all | yes |
-| angularStrokeWidth | A number which turns width of the Pie chart slice | number | no | all | yes |
-| angularStrokeColor | A string which turns color of the Pie chart slice | string | no | all | yes |
-
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| innerRadius | A number or string (as a percentage) which turns the Pie chart into a Donut chart. The innerRadius prop is the radius of the inner circle of the donut chart. If not provided, the chart will remain a Pie chart | number | no | all | yes
+| circleSweepDegrees | A number which defines how many degrees of the chart should be drawn. The default is 360 which will draw a full circle. If you want to draw a partial circle, you can set this prop to a value between 0 and 360 | number | no | all | yes
+| startAngle | A number which defines the starting angle of the chart. Changing this prop will rotate the chart | number | no | all | yes
+| children | The children prop is a render function which maps through the data and whose sole argument is each individual slice of the pie, allowing you to customize each slice as needed. E.g. this slice will have all the data needed to render a Pie.Slice | function | no | all | yes
+| angularStrokeWidth | A number which turns width of the Pie chart slice | number | no | all | yes
+| angularStrokeColor | A string which turns color of the Pie chart slice | string | no | all | yes
## Known Issues
## Others
-- V41.17.5 A new attribute, gestureHandlerConfig, has been added. This attribute is only supported on the web end and does not require HarmonyOS. For detailed information, please refer to it:
- [Cartesian Chart | Victory Native](https://nearform.com/open-source/victory-native/docs/cartesian/cartesian-chart/) 、 [GestureDetector | React Native Gesture Handler](https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/gesture-detector/#userselect-web-only)
## License
diff --git a/zh-cn/Parse-SDK-JS.md b/zh-cn/Parse-SDK-JS.md
index 15315eed220d1217d6f945a96b00578c02a538f7..26681cac3b49426e0e6971849dafd9c50618340e 100644
--- a/zh-cn/Parse-SDK-JS.md
+++ b/zh-cn/Parse-SDK-JS.md
@@ -28,12 +28,6 @@ Parse JS SDK 兼容以下版本的 Parse Server,Parse Server服务端搭建可
> [!TIP] 本库依赖[@react-native-oh-tpl/async-storage文档](/zh-cn/react-native-async-storage-async-storage.md) 和 [@react-native-oh-tpl/react-native-get-random-values 文档](/zh-cn/react-native-get-random-values.md)
-请到三方库的 Releases 发布地址查看配套的版本信息:
-
-| 三方库版本 | 支持RN版本 |
-| ---------- | ---------- |
-| 5.3.0 | 0.72/0.77 |
-
进入到工程目录并输入以下命令:
@@ -217,7 +211,7 @@ export default ParseExample;
本文档内容基于以下版本验证通过:
1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.403; ROM: 3.0.0.25;
-2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
+
## API
diff --git a/zh-cn/js/text-shadow-component.md b/zh-cn/js/text-shadow-component.md
index 7a1f803115894f32558149a8f21549c30c2c0567..b9a4cdd4ad57b39639e4ddf4ebdc2820980230a9 100644
--- a/zh-cn/js/text-shadow-component.md
+++ b/zh-cn/js/text-shadow-component.md
@@ -1,16 +1,20 @@
-> 模板版本:v0.3.0
+> 模板版本:v0.2.2
text-shadow-component
+
+
+
+
+
+
+
+
-请到三方库的 Releases 发布地址查看配套的版本信息:[text-shadow-component Releases](https://github.com/bswnth48/text-shadow-react-native/releases)。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
-
-| 三方库版本 | 支持RN版本 |
-| ---------- |---------- |
-| 1.0.7 | 0.72/0.77 |
+> [!TIP] [Github 地址](https://github.com/bswnth48/text-shadow-react-native)
-> [!TIP] 从 RNOH 0.72.97 版本开始,RNOH 0.72 支持阴影效果渲染。
+> [!TIP] 仅在 RNOH 0.77+ 呈现阴影效果,不支持 RNOH 0.72。
## 安装与使用
@@ -82,14 +86,16 @@ export default function App() {
本文档内容基于以下环境验证通过:
-1. RNOH: 0.77.18; SDK: HarmonyOS 5.0.0 Release(API Version 12 Release); IDE: DevEco Studio 5.1.1.830; ROM: 5.0.0.150 SP8;
-2. RNOH: 0.72.97; SDK: HarmonyOS 6.0.0.47 (API Version 20 Release); IDE: DevEco Studio 6.0.0 Release; ROM: 6.0.0.108 SP6;
+1. RNOH: 0.77.18; SDK:HarmonyOS 5.0.0 Release(API Version 12 Release); IDE:DevEco Studio 5.1.1.830; ROM:5.0.0.150 SP8
+
+> 说明:在 RNOH 0.77+ 上,原生已实现文本阴影绘制。早期版本(如:RNHO 0.72版本)不会呈现阴影效果。
## 属性
> [!TIP] "Platform" 列表示源库标注的平台;
> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性;no 则表示不支持;partially 表示部分支持。使用方法跨平台一致,效果对标 iOS 或 Android 的效果。
+> [!TIP] 本文档仅就 HarmonyOS(RNOH 0.77)给出支持结论。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
|--------------|-----------------------------------------------|--------|----------|-------------|-------------------|
@@ -99,10 +105,9 @@ export default function App() {
## 遗留问题
-
+在 RNOH 0.72 上不显示阴影效果。[issue#ID0FUU](https://gitee.com/react-native-oh-library/usage-docs/issues/ID0FUU)
## 其他
-从 RNOH 0.72.97 版本开始,RNOH 0.72 支持阴影效果渲染。
## 开源协议
diff --git a/zh-cn/react-native-aria.md b/zh-cn/react-native-aria.md
index 84140172335d4fee37b64a0c3e4cd5f82f30d4f4..92deb79ee3c03f479157e971b3a75b2e1b960210 100644
--- a/zh-cn/react-native-aria.md
+++ b/zh-cn/react-native-aria.md
@@ -16,8 +16,13 @@
## 安装与使用
-React Native ARIA是可增量采用的。每个组件都作为单独的包发布,因此您可以在单个组件中使用它,并随着时间的推移逐渐添加更多组件。所有这些包都在npm上的@react-native-aria范围内发布。
-> [!TIP] 该库已经不再维护,如果执行总包命令,项目运行缺失模块,就需要卸载旧包,在命令后增加--legacy-peer-deps,然后再次下载包文件
+请到三方库的 Releases 发布地址查看配套的版本信息:
+
+| 三方库版本 | 发布信息 | 支持RN版本 |
+| ---------- | ------------------------------------------------------------ | ---------- |
+| 0.2.3 | [react-native-aria main](https://github.com/gluestack/react-native-aria/tree/main) | 0.72/0.77 |
+
+对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
进入到工程目录并输入以下命令:
@@ -528,17 +533,18 @@ export default TriggerWrapper
> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性;no 则表示不支持;partially 表示部分支持。使用方法跨平台一致,效果对标 iOS 或 Android 的效果。
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|----------|----------|-------------------|
-| useToggleButton | Provides the behavior and accessibility implementation for a toggle button component. ToggleButtons allow users to toggle a selection on or off, for example switching between two states or modes. | Function | no | iOS,Android | yes |
-| useCheckbox | Provides the behavior and accessibility implementation for a checkbox component. Checkboxes allow users to select multiple items from a list of individual items, or to mark one individual item as selected. | Function | no | iOS,Android | yes |
-| useCheckboxGroup | Provides the behavior and accessibility implementation for a checkbox group component. Checkbox groups allow users to select multiple items from a list of options. | Function | no | iOS,Android | yes |
-| useRadioGroup | Provides the behavior and accessibility implementation for a radio group component. Radio groups allow users to select a single item from a list of mutually exclusive options. | Function | no | iOS,Android | yes |
-| useSwitch | Provides the behavior and accessibility implementation for a switch component. A switch is similar to a checkbox, but represents on/off values as opposed to selection. | Function | no | iOS,Android | yes |
-| OverlayContainer | Provides React Portal like functionality for React Native apps which can be useful for displaying absolutely positioned components like Menu, Tooltip, Popover. | Function | no | iOS,Android | yes |
-| useOverlayPosition | Handles positioning overlays like popovers and menus relative to a trigger element, and updating the position when the window resizes. | Function | no | iOS,Android | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+|--------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|----------|-------------|-------------------|
+| useToggleButton | 为切换按钮组件提供行为和可访问性实现。切换按钮允许用户打开或关闭选择,例如在两种状态或模式之间切换。 | Function | No | iOS,Android | Yes |
+| useCheckbox | 为复选框组件提供行为和可访问性实现。复选框允许用户从单个项目列表中选择多个项目,或将单个项目标记为已选择。 | Function | No | iOS,Android | Yes |
+| useCheckboxGroup | 为复选框组组件提供行为和可访问性实现。复选框组允许用户从选项列表中选择多个项目。 | Function | No | iOS,Android | Yes |
+| useRadioGroup | 为单选按钮组组件提供行为和可访问性实现。单选按钮组允许用户从互斥选项列表中选择单个项目。 | Function | No | iOS,Android | Yes |
+| useSwitch | 为开关组件提供行为和可访问性实现。开关类似于复选框,但表示开/关值而不是选择。 | Function | No | iOS,Android | Yes |
+| OverlayContainer | 为 React Native 应用提供类似 React Portal 的功能,可用于显示绝对定位的组件,如菜单、工具提示、弹出框。 | Function | No | iOS,Android | Yes |
+| useOverlayPosition | 处理相对于触发元素定位叠加层(如弹出框和菜单),并在窗口调整大小时更新位置。 | Function | No | iOS,Android | Yes |
## 遗留问题
+1. 切换勾选状态后立刻触发朗读暂时不支持。
## 其他
diff --git a/zh-cn/react-native-community-toolbar-android.md b/zh-cn/react-native-community-toolbar-android.md
index 698c930a7c8eb776fe68e943437ee54f5110cf18..ef79f58523c71f2e95c506fa86d4ec5b24680c0d 100644
--- a/zh-cn/react-native-community-toolbar-android.md
+++ b/zh-cn/react-native-community-toolbar-android.md
@@ -8,10 +8,10 @@
该第三方库的仓库已迁移至 Gitee,且支持直接从 npm 下载,新的包名为:`@react-native-ohos/toolbar-android`,具体版本所属关系如下:
-| Version | Package Name | Repository | Release |
-|-----------------| ------------------------------------------------- | ------------------ | -------------------------- |
-| <= 0.2.1-0.0.4 | @react-native-oh-tpl/toolbar-android | [Github(deprecated)](https://github.com/react-native-oh-library/toolbar-android) | [Github Releases(deprecated)](https://github.com/react-native-oh-library/toolbar-android/releases) |
-| >= 0.2.2 | @react-native-ohos/toolbar-android | [Gitee](https://gitee.com/openharmony-sig/rntpc_toolbar-android) | [Gitee Releases](https://gitee.com/openharmony-sig/rntpc_toolbar-android/releases) |
+| 三方库版本 | 发布信息 | 支持RN版本 |
+|-----------------| ------------------------------------------------- | ------------------ |
+| <= 0.2.1 | [toolbar-android Releases(deprecated)](https://github.com/react-native-oh-library/toolbar-android/releases) | 0.72
+| >= 0.2.2 | [toolbar-android Releases](https://gitee.com/openharmony-sig/rntpc_toolbar-android/releases) | 0.77
## 1.安装与使用
@@ -22,12 +22,18 @@
#### npm
```bash
+# 0.72
+npm install @react-native-oh-tpl/toolbar-android
+# 0.77
npm install @react-native-ohos/toolbar-android
```
#### yarn
```bash
+# 0.72
+yarn add @react-native-oh-tpl/toolbar-android
+# 0.77
yarn add @react-native-ohos/toolbar-android
```
@@ -150,6 +156,14 @@ export default App;
打开 `entry/oh-package.json5`,添加以下依赖
+<= 0.2.1
+```json
+"dependencies": {
+ "@react-native-oh-tpl/toolbar-android": "file:../../node_modules/@react-native-oh-tpl/toolbar-android/harmony/toolbar_android.har"
+ }
+```
+
+>= 0.2.2
```json
"dependencies": {
"@react-native-ohos/toolbar-android": "file:../../node_modules/@react-native-ohos/toolbar-android/harmony/toolbar_android.har"
@@ -189,6 +203,9 @@ add_compile_definitions(WITH_HITRACE_SYSTRACE)
# RNOH_BEGIN: manual_package_linking_1
add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package)
+// <= 0.2.1
++ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/toolbar-android/src/main/cpp" ./toolbar-android)
+// >= 0.2.2
+ add_subdirectory("${OH_MODULES}/@react-native-ohos/toolbar-android/src/main/cpp" ./toolbar-android)
# RNOH_END: manual_package_linking_1
@@ -229,6 +246,9 @@ std::vector> PackageProvider::getPackages(Package::Cont
```diff
...
+// <=0.2.1
++ import {ToolbarAndroidPackage} from '@react-native-oh-tpl/toolbar-android/src/main/ets/ToolbarAndroidPackage';
+// >=0.2.2
+ import {ToolbarAndroidPackage} from '@react-native-ohos/toolbar-android/src/main/ets/ToolbarAndroidPackage';
export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
@@ -245,6 +265,9 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
```diff
...
+// <=0.2.1
++ import { RNCToolbarAndroid} from '@react-native-oh-tpl/toolbar-android/src/main/ets/RNCToolbarAndroid'
+// >=0.2.2
+ import { RNCToolbarAndroid} from '@react-native-ohos/toolbar-android/src/main/ets/RNCToolbarAndroid'
@Builder
@@ -291,7 +314,10 @@ ohpm install
要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。
-请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息:[@react-native-ohos/toolbar-android Releases](https://gitee.com/openharmony-sig/rntpc_toolbar-android/releases)
+在以下版本验证通过:
+
+1. RNOH: 0.72.38; SDK: HarmonyOS-5.0.0(API12); ROM: 5.0.0.107;
+2. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.868; ROM: 6.0.0.112;
## 4.属性
@@ -301,29 +327,29 @@ ohpm install
Inherits [View Props](https://reactnative.dev/docs/view#props).
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ----------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- |-----------| -------- | ----------------- |
-| actions | Sets possible actions on the toolbar as part of the action menu. These are displayed as icons or text on the right side of the widget. If they don't fit they are placed in an 'overflow' menu. | array of object: {title: string,icon: ImageSource,show: enum('always', 'ifRoom', 'never'),showWithText: bool} | No | Android | yes |
-| contentInsetStart | Sets the content inset for the toolbar starting edge. | number | No | Android | yes |
-| contentInsetEnd | Sets the content inset for the toolbar ending edge. | number | No | Android | yes |
-| logo | Sets the toolbar logo. | ImageSource | No | Android | yes |
-| navIcon | Sets the navigation icon. | ImageSource | No | Android | yes |
-| onActionSelected | Callback that is called when an action is selected. The only argument that is passed to the callback is the position of the action in the actions array. | function | No | Android | yes |
-| onIconClicked | Callback called when the icon is selected. | function | No | Android | yes |
-| overflowIcon | Sets the overflow icon. | ImageSource | No | Android | yes |
-| rtl | Used to set the toolbar direction to RTL. | bool | No | Android | yes |
-| subtitle | Sets the toolbar subtitle. | string | No | Android | yes |
-| subtitleColor | Sets the toolbar subtitle color. | string | No | Android | yes |
-| title | Sets the toolbar title. | string | No | Android | yes |
-| titleColor | Sets the toolbar title color. | string | No | Android | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ----------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- |-----------| -------- | ----------------- |
+| actions | 在操作菜单中设置工具栏上的可能操作。这些操作以图标或文本形式显示在小部件右侧。如果空间不足,它们会被放入"溢出"菜单中。 | 对象数组: {title: string,icon: ImageSource,show: enum('always', 'ifRoom', 'never'),showWithText: bool} | No | Android | Yes |
+| contentInsetStart | 设置工具栏起始边缘的内容内边距。 | number | No | Android | Yes |
+| contentInsetEnd | 设置工具栏结束边缘的内容内边距。 | number | No | Android | Yes |
+| logo | 设置工具栏徽标。 | ImageSource | No | Android | Yes |
+| navIcon | 设置导航图标。 | ImageSource | No | Android | Yes |
+| onActionSelected | 选择操作时调用的回调函数。传递给回调的唯一参数是操作在操作数组中的位置。 | function | No | Android | Yes |
+| onIconClicked | 点击图标时调用的回调函数。 | function | No | Android | Yes |
+| overflowIcon | 设置溢出图标。 | ImageSource | No | Android | Yes |
+| rtl | 用于将工具栏方向设置为从右到左。 | bool | No | Android | Yes |
+| subtitle | 设置工具栏副标题。 | string | No | Android | Yes |
+| subtitleColor | 设置工具栏副标题颜色。 | string | No | Android | Yes |
+| title | 设置工具栏标题。 | string | No | Android | Yes |
+| titleColor | 设置工具栏标题颜色。 | string | No | Android | Yes |
#### 4.1.Props of ImageSource
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| ------ | ------------------------------------------------------ | ------ | -------- | -------- | ----------------- |
-| uri | load image from a url, e.g. require('./some_icon.png') | string | Yes | android | yes |
-| width | the width of the image | number | No | android | yes |
-| height | the height of the image | number | No | android | yes |
+| uri | 从URL加载图片,例如 require('./some_icon.png') | string | Yes | android | Yes |
+| width | 图片宽度 | number | No | android | Yes |
+| height | 图片高度 | number | No | android | Yes | | number | No | android | Yes |
## 5.遗留问题
diff --git a/zh-cn/react-native-keys.md b/zh-cn/react-native-keys.md
index 5acf29e0e6366f295958c8cb55409ed1f3b5dc57..1d020becf7e3120b43bb0b43ec4a9385f1f9f525 100644
--- a/zh-cn/react-native-keys.md
+++ b/zh-cn/react-native-keys.md
@@ -17,8 +17,14 @@
> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-keys)
## 安装与使用
+请到三方库的 Releases 发布地址查看配套的版本信息:
-请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-library/react-native-keys Releases](https://github.com/react-native-oh-library/react-native-keys/releases) 。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
+| 三方库版本 | 发布信息 | 支持RN版本 |
+| ---------- | ------------------------------------------------------------ | ---------- |
+| 0.7.11 | [@react-native-oh-library/react-native-keys Releases](https://github.com/react-native-oh-library/react-native-keys/releases) | 0.72 |
+| 0.8.0 | [@react-native-ohos/react-native-keys Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-keys/releases) | 0.77 |
+
+对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
进入到工程目录并输入以下命令:
@@ -29,13 +35,21 @@
#### npm
```bash
+# 0.72
npm install @react-native-oh-tpl/react-native-keys
+
+# 0.77
+npm install @react-native-ohos/react-native-keys
```
#### yarn
```bash
+# 0.72
yarn add @react-native-oh-tpl/react-native-keys
+
+# 0.77
+yarn add @react-native-ohos/react-native-keys
```
@@ -44,7 +58,7 @@ yarn add @react-native-oh-tpl/react-native-keys
>[!WARNING] 使用时 import 的库名不变。
-1. Create a new file keys.development.json in the root of your React Native app and add Envs in secure object for protected envs variables and add Envs in public for public usage this:
+1. 在 React Native 应用的根目录下创建一个名为 `keys.development.json` 的新文件,并在 secure 对象中添加需要保护的环境变量,在 public 对象中添加可供公开使用的环境变量,具体如下:
```json
{
@@ -62,7 +76,7 @@ yarn add @react-native-oh-tpl/react-native-keys
```
-2. Use Public Keys & Secure Keys
+2. 使用公共密钥和安全密钥
``` js
import Keys from 'react-native-keys';
@@ -106,12 +120,22 @@ Keys.secureFor('SECRET_KEY');
打开 `entry/oh-package.json5`,添加以下依赖
+v0.7.11
+
```json
"dependencies": {
"@rnoh/react-native-openharmony": "file:../react_native_openharmony",
"@react-native-oh-tpl/react-native-keys": "file:../../node_modules/@react-native-oh-tpl/react-native-keys/harmony/rnoh_keys.har"
}
```
+v0.8.0
+
+```json
+"dependencies": {
+ "@rnoh/react-native-openharmony": "file:../react_native_openharmony",
+ "@react-native-ohos/react-native-keys": "file:../../node_modules/@react-native-ohos/react-native-keys/harmony/rnoh_keys.har"
+ }
+```
点击右上角的 `sync` 按钮
@@ -148,7 +172,10 @@ add_subdirectory("${RNOH_CPP_DIR}" ./rn)
# RNOH_BEGIN: manual_package_linking_1
add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package)
+// v0.77.11
+ add_subdirectory("${OH_MODULES}/@react-native-oh-tpl/react-native-keys/src/main/cpp" ./rnohkeys)
+// v0.8.0
++ add_subdirectory("${OH_MODULES}/@react-native-ohos/react-native-keys/src/main/cpp" ./rnohkeys)
# RNOH_END: manual_package_linking_1
file(GLOB GENERATED_CPP_FILES "./generated/*.cpp")
@@ -191,7 +218,10 @@ std::vector> PackageProvider::getPackages(Package::Cont
```diff
...
+ // v0.7.11
+ import { RNKeysPackage } from '@react-native-oh-tpl/react-native-keys';
+ // v0.7.11
++ import { RNKeysPackage } from '@react-native-ohos/react-native-keys';
export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
return [
@@ -230,7 +260,10 @@ ohpm install
要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。
-请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息:[@react-native-oh-library/react-native-keys Releases](https://github.com/react-native-oh-library/react-native-keys/releases)
+在以下版本验证通过:
+
+1. RNOH: 0.72.38; SDK: HarmonyOS-5.0.0(API12); ROM: 5.0.0.107;
+2. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.868; ROM: 6.0.0.112;
## API
@@ -242,9 +275,9 @@ ohpm install
| Name | Description | Type | Required | Platform | HarmonyOS Support |
|-----------------|----------------------|----------|----------|-------------|-------------------|
-| Keys attributes | Get public value | object | no | iOS/Android | yes |
-| Keys.publicKeys | Get all public value | function | no | iOS/Android | yes |
-| Keys.secureFor | Get secret value | function | no | iOS/Android | yes |
+| Keys attributes | 获取公共值 | object | No | iOS/Android | Yes |
+| Keys.publicKeys | 获取所有公共值 | function | No | iOS/Android | Yes |
+| Keys.secureFor | 获取密钥值 | function | No | iOS/Android | Yes |
## 遗留问题
diff --git a/zh-cn/react-native-mqtt.md b/zh-cn/react-native-mqtt.md
index fa4293d935799d1cd91ff3d82c536a4f73d46b23..a063d87ac508a9979a0294fa1c07cb1f680495ef 100644
--- a/zh-cn/react-native-mqtt.md
+++ b/zh-cn/react-native-mqtt.md
@@ -1,15 +1,19 @@
-> 模板版本:v0.3.0
+> 模板版本:v0.2.2
react-native-mqtt
+
+
+
+
+
+
+
+
-请到三方库的 Releases 发布地址查看配套的版本信息:[react-native-mqtt Releases](https://github.com/Introvertuous/react-native-mqtt/releases)。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
-
-| 三方库版本 | 支持RN版本 |
-| ---------- |---------- |
-| 1.3.1 | 0.72/0.77 |
+> [!TIP] [Github 地址](https://github.com/Introvertuous/react-native-mqtt)
## 安装与使用
@@ -123,9 +127,8 @@ function sendMessage() {
本文档内容基于以下版本验证通过:
-1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.25; IDE: DevEco Studio 5.0.3.400; ROM:3.0.0.25;
-2. RNOH: 0.72.33; SDK: OpenHarmony 5.0.0.71(API Version 12 Release); IDE: DevEco Studio 5.0.3.900; ROM: NEXT.0.0.71;
-3. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0.47 (API Version 20 Release); IDE: DevEco Studio 6.0.0 Release; ROM: 6.0.0.108 SP6;
+1. RNOH: 0.72.27; SDK:HarmonyOS-Next-DB1 5.0.0.25; IDE:DevEco Studio 5.0.3.400; ROM:3.0.0.25;
+2. RNOH:0.72.33; SDK:OpenHarmony 5.0.0.71(API Version 12 Release); IDE:DevEco Studio 5.0.3.900; ROM:NEXT.0.0.71;
## 属性
diff --git a/zh-cn/react-native-progress.md b/zh-cn/react-native-progress.md
index 48d6dc6cf0226f2876b781ac338ff29c0a1f3ad2..3019d118a6f18880b74c94fabddab24de722bfea 100644
--- a/zh-cn/react-native-progress.md
+++ b/zh-cn/react-native-progress.md
@@ -4,7 +4,7 @@
react-native-progress
-
+
@@ -14,16 +14,9 @@
> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-progress)
-| 三方库版本 | 包 名 | 仓库地址 | 发布信息 | 支持RN版本 |
-| -------- | -------- | --------- |---------|----------|
-| 5.0.1 | @react-native-oh-tpl/react-native-progress |[Github](https://github.com/react-native-oh-library/react-native-progress) | [Github Releases](https://github.com/react-native-oh-library/react-native-progress/releases) | 0.72 |
-| 5.1.0 | @react-native-ohos/react-native-progress |[GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-progress) |[GitCode Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-progress/releases) | 0.77 |
-
## 安装与使用
-请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-progress Releases](https://github.com/react-native-oh-library/react-native-progress/releases)。
-
-
+请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-progress Releases](https://github.com/react-native-oh-library/react-native-progress/releases) 。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
进入到工程目录并输入以下命令:
@@ -32,21 +25,13 @@
#### **npm**
```bash
-# V0.72
npm install @react-native-oh-tpl/react-native-progress
-
-# V0.77
-npm install @react-native-ohos/react-native-progress
```
#### **yarn**
```bash
-# V0.72
-yarn install @react-native-oh-tpl/react-native-progress
-
-# V0.77
-yarn install @react-native-ohos/react-native-progress
+yarn add @react-native-oh-tpl/react-native-progress
```
@@ -155,10 +140,6 @@ const styles = StyleSheet.create({
请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息:[@react-native-oh-tpl/react-native-progress Releases](https://github.com/react-native-oh-library/react-native-progress/releases)
-1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.403; ROM: 3.0.0.25;
-2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
-
-
## 属性
> [!TIP] "Platform"列表示该属性在原三方库上支持的平台。
@@ -167,18 +148,18 @@ const styles = StyleSheet.create({
详情见[react-native-progress](https://github.com/oblador/react-native-progress?tab=readme-ov-file#properties-for-all-progress-components)
-### 属性,用于所有进度组件:
+### Properties for all progress components:
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| ------------------------------ | ---------------------------------------------------------------------------- | ------- | -------- | -------- | ----------------- |
-| animated | 是否为“进度”添加动画。 | boolean | No | All | Yes |
-| indeterminate | 如果设置为true,则指示器将旋转并且“progress”将被忽略。 | boolean | No | All | Yes |
-| indeterminateAnimationDuration | 当设置indeterminate时,以毫秒为单位设置动画持续时间。 | number | No | All | Yes |
-| progress | 指标所显示的进度。0和1之间的数字。 | number | No | All | Yes |
-| color | 指示灯的填充颜色。 | string | No | All | Yes |
-| unfilledColor | 剩余进度的颜色。 | string | No | All | Yes |
-| borderWidth | 外边框的宽度,设置为“0”以移除。 | number | No | All | Yes |
-| borderColor | 外边框的颜色。 | string | No | All | Yes |
+| animated | Whether or not to animate changes to `progress`. | boolean | No | All | Yes |
+| indeterminate | If set to true, the indicator will spin and `progress` prop will be ignored. | boolean | No | All | Yes |
+| indeterminateAnimationDuration | Sets animation duration in milliseconds when indeterminate is set. | number | No | All | Yes |
+| progress | Progress of whatever the indicator is indicating. A number between 0 and 1. | number | No | All | Yes |
+| color | Fill color of the indicator. | string | No | All | Yes |
+| unfilledColor | Color of the remaining progress. | string | No | All | Yes |
+| borderWidth | Width of outer border, set to `0` to remove. | number | No | All | Yes |
+| borderColor | Color of outer border. | string | No | All | Yes |
### `Progress.Bar`:
@@ -186,12 +167,12 @@ All of the props under _Properties_ in addition to the following:
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| --------------- | ------------------------------------------------------------------------------ | ------------------------------- | -------- | -------- | ----------------- |
-| width | 进度条的全宽度,设置为‘ null ’以使用自动伸缩大小。 | number \| null | No | All | Yes |
-| height | 进度条的高度。 | number | No | All | Yes |
-| borderRadius | 圆角,设置为‘ 0 ’禁用。 | number | No | All | Yes |
-| useNativeDriver | 动画使用原生驱动。 | boolean | No | All | Yes |
-| animationConfig | 传入‘ Animated ’函数的配置。 | function | No | All | Yes |
-| animationType | 动画类型:`decay`, `timing`, `spring`。 | 'decay' \| 'timing' \| 'spring' | No | All | Yes |
+| width | Full width of the progress bar, set to `null` to use automatic flexbox sizing. | number \| null | No | All | Yes |
+| height | Height of the progress bar. | number | No | All | Yes |
+| borderRadius | Rounding of corners, set to `0` to disable. | number | No | All | Yes |
+| useNativeDriver | Use native driver for the animations. | boolean | No | All | Yes |
+| animationConfig | Config that is passed into the `Animated` function. | function | No | All | Yes |
+| animationType | Animation type to animate the progress, one of: `decay`, `timing`, `spring`. | 'decay' \| 'timing' \| 'spring' | No | All | Yes |
### `Progress.Circle`:
@@ -199,16 +180,16 @@ All of the props under _Properties_ in addition to the following:
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| ---------------- | ---------------------------------------------------------------------------------------------------------------------------- | ---------------------------------- | -------- | -------- | ----------------- |
-| size | 圆的直径。 | number | No | All | Yes |
-| endAngle | 确定圆的endAngle。一个介于0和1之间的数字。最终的角度将是数字乘以2π| number | No | All | Yes |
-| thickness | 内圆的厚度。 | number | No | All | Yes |
-| showsText | 是否显示当前进度的文本表示。 | boolean | No | All | Yes |
-| formatText | 返回要显示文本表示的字符串的一个函数。 | function | No | All | Yes |
-| textStyle | 进度文本的样式,默认与circle相同的`color`, `fontSize`与`size` prop成比例。 | TextStyle | No | All | Yes |
-| allowFontScaling | 是否遵守设备字体比例设置 | boolean | No | All | Yes |
-| direction | 圆的方向顺时针或逆时针。 | 'clockwise' \| 'counter-clockwise' | No | All | Yes |
-| strokeCap | 圆形的笔画样式为‘ butt ’, ‘ square ’或‘ round ’。 | 'butt' \| 'square' \| 'round' | No | All | Yes |
-| fill | 填充内圆的颜色。 | string | No | All | Yes |
+| size | Diameter of the circle. | number | No | All | Yes |
+| endAngle | Determines the endAngle of the circle. A number between `0` and `1`. The final endAngle would be the number multiplied by 2π | number | No | All | Yes |
+| thickness | Thickness of the inner circle. | number | No | All | Yes |
+| showsText | Whether or not to show a text representation of current progress. | boolean | No | All | Yes |
+| formatText | A function returning a string to be displayed for the textual representation. | function | No | All | Yes |
+| textStyle | Styles for progress text, defaults to a same `color` as circle and `fontSize` proportional to `size` prop. | TextStyle | No | All | Yes |
+| allowFontScaling | Whether or not to respect device font scale setting. | boolean | No | All | Yes |
+| direction | Direction of the circle `clockwise` or `counter-clockwise`. | 'clockwise' \| 'counter-clockwise' | No | All | Yes |
+| strokeCap | Stroke Cap style for the circle `butt`, `square` or `round`. | 'butt' \| 'square' \| 'round' | No | All | Yes |
+| fill | Fill color of the inner circle. | string | No | All | Yes |
### `Progress.Pie`:
@@ -216,21 +197,21 @@ All of the props under _Properties_ in addition to the following:
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| ---- | -------------------- | ------ | -------- | -------- | ----------------- |
-| size | 饼图的直径。 | number | No | All | Yes |
+| size | Diameter of the pie. | number | No | All | Yes |
### `Progress.CircleSnail`:
| Name | Description | Type | Required | Platform | HarmonyOS Support |
| ---------------- | ----------------------------------------------------------------------------------------- | ---------------------------------- | -------- | -------- | ----------------- |
-| animating | 是否有圆形动画 | boolean | No | All | Yes |
-| hidesWhenStopped | 是否需要在动画结束时移除圆。 | boolean | No | All | Yes |
-| size | 圆的直径。 | number | No | All | Yes |
-| color | 圆圈的颜色,使用一组颜色的彩虹效果。 | string \| string[] | No | All | Yes |
-| thickness | 圆的厚度。 | number | No | All | Yes |
-| duration | 动画持续时间。 | number | No | All | Yes |
-| spinDuration | 自旋(轨道)动画的持续时间。 | number | No | All | Yes |
-| strokeCap | 圆形的笔画样式为‘ butt ’, ‘ square ’或‘ round ’。 | 'butt' \| 'square' \| 'round' | No | All | Yes |
-| direction | 圆旋转的方向,“顺时针”或“逆时针”(默认)。 | 'clockwise' \| 'counter-clockwise' | No | All | Yes |
+| animating | If the circle should animate. | boolean | No | All | Yes |
+| hidesWhenStopped | If the circle should be removed when not animating. | boolean | No | All | Yes |
+| size | Diameter of the circle. | number | No | All | Yes |
+| color | Color of the circle, use an array of colors for rainbow effect. | string \| string[] | No | All | Yes |
+| thickness | Thickness of the circle. | number | No | All | Yes |
+| duration | Duration of animation. | number | No | All | Yes |
+| spinDuration | Duration of spin (orbit) animation. | number | No | All | Yes |
+| strokeCap | Stroke Cap style for the circle `butt`, `square` or `round`. | 'butt' \| 'square' \| 'round' | No | All | Yes |
+| direction | Direction in which the circle spins, either "clockwise" or "counter-clockwise" (default). | 'clockwise' \| 'counter-clockwise' | No | All | Yes |
## 遗留问题
diff --git a/zh-cn/react-native-sticky-parallax-header.md b/zh-cn/react-native-sticky-parallax-header.md
index c11460acda68f391b842c3b5c93032eec647eda3..716a153ae09b1b2dbfbcae71b09cf6b6b258ca4c 100644
--- a/zh-cn/react-native-sticky-parallax-header.md
+++ b/zh-cn/react-native-sticky-parallax-header.md
@@ -14,15 +14,9 @@
> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-sticky-parallax-header)
-| 三方库版本 | 包 名 | 仓库地址 | 发布信息 | 支持RN版本 |
-| -------- | -------- | --------- |---------|----------|
-| 1.1.1 | @react-native-oh-tpl/react-native-sticky-parallax-header | [Github](https://github.com/react-native-oh-library/react-native-sticky-parallax-header)| [GitHub Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases) | 0.72 |
-| 1.2.0 | @react-native-ohos/react-native-sticky-parallax-header | [Github ](https://github.com/react-native-oh-library/react-native-sticky-parallax-header)|[GitHub Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases) | 0.77 |
-
## 安装与使用
-请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-sticky-parallax-header Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases)。
-
+请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-sticky-parallax-header Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases)。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
进入到工程目录并输入以下命令:
@@ -33,21 +27,13 @@
#### **npm**
```bash
-# 0.72
npm install @react-native-oh-tpl/react-native-sticky-parallax-header
-
-# 0.77
-npm install @react-native-ohos/react-native-sticky-parallax-header
```
#### **yarn**
```bash
-# 0.72
-yarn install @react-native-oh-tpl/react-native-sticky-parallax-header
-
-# 0.77
-yarn install @react-native-ohos/react-native-sticky-parallax-header
+yarn add @react-native-oh-tpl/react-native-sticky-parallax-header
```
@@ -169,10 +155,7 @@ const TabbedHeaderPagerExample: React.FC = () => {
要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。
-请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-sticky-parallax-header Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases)。
-
-1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.403; ROM: 3.0.0.25;
-2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
+请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-sticky-parallax-header Releases](https://github.com/react-native-oh-library/react-native-sticky-parallax-header/releases)。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
## Headers
diff --git a/zh-cn/react-native-tcp-socket.md b/zh-cn/react-native-tcp-socket.md
index 0b63625cf5f3e28cd05f424947a80b1c62ccb399..d644a2aa9a6e7074da68808b3d771e2f95d16134 100644
--- a/zh-cn/react-native-tcp-socket.md
+++ b/zh-cn/react-native-tcp-socket.md
@@ -16,7 +16,14 @@
## 安装与使用
-请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-tcp-socket Releases](https://github.com/react-native-oh-library/react-native-tcp-socket/releases) 。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
+请到三方库的 Releases 发布地址查看配套的版本信息:
+
+| 三方库版本 | 发布信息 | 支持RN版本 |
+| ---------- | ------------------------------------------------------------ | ---------- |
+| 6.2.0 | [@react-native-oh-tpl/react-native-tcp-socket Releases](https://github.com/react-native-oh-library/react-native-tcp-socket/releases) | 0.72 |
+| 6.3.1 | [@react-native-ohos/react-native-tcp-socket Releases]() | 0.77 |
+
+对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
进入到工程目录并输入以下命令:
@@ -25,13 +32,21 @@
#### **npm**
```bash
+# V0.72
npm install @react-native-oh-tpl/react-native-tcp-socket
+
+# V0.77
+npm install @react-native-ohos/react-native-tcp-socket
```
#### **yarn**
```bash
+# V0.72
yarn add @react-native-oh-tpl/react-native-tcp-socket
+
+# V0.77
+yarn add @react-native-ohos/react-native-tcp-socket
```
@@ -567,6 +582,8 @@ const styles = StyleSheet.create({
## 使用 Codegen
+> [!TIP] V6.3.1 不需要执行Codegen
+
本库已经适配了 `Codegen` ,在使用前需要主动执行生成三方库桥接代码,详细请参考[ Codegen 使用文档](/zh-cn/codegen.md)。
## Link
@@ -599,6 +616,8 @@ const styles = StyleSheet.create({
打开 `entry/oh-package.json5`,添加以下依赖
+- V6.2.0
+
```json
"dependencies": {
"@rnoh/react-native-openharmony" : "file:../react_native_openharmony",
@@ -606,6 +625,15 @@ const styles = StyleSheet.create({
}
```
+- V6.3.1
+
+```JSON
+"dependencies": {
+ "@rnoh/react-native-openharmony" : "file:../react_native_openharmony",
+ "@react-native-ohos/react-native-tcp-socket": "file:../../node_modules/@react-native-ohos/react-native-tcp-socket/harmony/tcp_socket.har"
+ }
+```
+
点击右上角的 `sync` 按钮
或者在终端执行:
@@ -619,14 +647,80 @@ ohpm install
> [!TIP] 如需使用直接链接源码,请参考[直接链接源码说明](/zh-cn/link-source-code.md)
-### 3.在 ArkTs 侧引入 TcpSocketPackage
+
+### 3.配置CMakeLists 和引入 TcpSocketPackage
+
+> [!TIP] 若使用的是 6.2.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-tcp-socket/src/main/cpp" ./tcp-socket)
+# 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_tcp_socket)
+# 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 "TcpSocketPackage.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 侧引入 TcpSocketPackage
打开 `entry/src/main/ets/RNPackagesFactory.ts`,添加:
```diff
...
+// v6.2.0
+ import {TcpSocketPackage} from '@react-native-oh-tpl/react-native-tcp-socket/ts';
+// v6.3.1
++ import {TcpSocketPackage} from '@react-native-ohos/react-native-tcp-socket/ts';
+
export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
return [new SamplePackage(ctx),
+ new TcpSocketPackage(ctx)
@@ -634,7 +728,7 @@ export function createRNPackages(ctx: RNPackageContext): RNPackage[] {
}
```
-### 4.运行
+### 5.运行
点击右上角的 `sync` 按钮
@@ -653,7 +747,10 @@ ohpm install
要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。
-请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息:[@react-native-oh-tpl/react-native-tcp-socket Releases](https://github.com/react-native-oh-library/react-native-tcp-socket/releases)
+在以下版本验证通过:
+
+1. RNOH: 0.72.38; SDK: HarmonyOS-5.0.0(API12); ROM: 5.0.0.107;
+2. RNOH: 0.77.18; SDK: HarmonyOS 6.0.0 Release SDK; IDE: DevEco Studio 6.0.0.868; ROM: 6.0.0.112;
### 权限要求
@@ -679,88 +776,89 @@ ohpm install
> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性;no 则表示不支持;partially 表示部分支持。使用方法跨平台一致,效果对标 iOS 或 Android 的效果。
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| -------------------------------------------- | --------------------------------------------------- | -------- | -------- | ----------- | ----------------- |
-| connect(options, callback) | Same as createConnection,Creating a TCP Socket | function | no | Android,iOS | yes |
-| createServer(connectionListener) | Creating a TCP Server | function | no | Android,iOS | yes |
-| createConnection(options, callback) | Creating a TCP Socket | function | no | Android,iOS | yes |
-| createTLSServer(options, connectionListener) | Creating a TLS-based TCP Server | function | no | Android,iOS | yes |
-| connectTLS | Creating a TLS-based encrypted connection | function | no | Android,iOS | yes |
-| isIP | Check whether a character string is an IP address | function | no | Android,iOS | yes |
-| isIPv4 | Check whether a character string is an IPv4 address | function | no | Android,iOS | yes |
-| isIPv6 | Check whether a character string is an IPv6 address | function | no | Android,iOS | yes |
-| Server | TCP Server Object | object | no | Android,iOS | yes |
-| Socket | TCP Socket Object | object | no | Android,iOS | yes |
-| TLSServer | TLS Server Object | object | no | Android,iOS | yes |
-| TLSSocket | TLS Socket Object | object | no | Android,iOS | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---------------------------------------------------------- | --------------------------------------------------- | -------- | -------- | ----------- | ----------------- |
+| connect(options, callback) | 同createConnection,创建TCP套接字 | function | No | Android,iOS | Yes |
+| createServer(connectionListener) | 创建TCP服务器 | function | No | Android,iOS | Yes |
+| createServer(options,connectionListener)6.3.1+ | 创建TCP服务器 | function | No | Android,iOS | Yes |
+| createConnection(options, callback) | 创建TCP套接字 | function | No | Android,iOS | Yes |
+| createTLSServer(options, connectionListener) | 创建基于TLS的TCP服务器 | function | No | Android,iOS | Yes |
+| connectTLS | 创建基于TLS的加密连接 | function | No | Android,iOS | Yes |
+| isIP | 检查字符串是否为IP地址 | function | No | Android,iOS | Yes |
+| isIPv4 | 检查字符串是否为IPv4地址 | function | No | Android,iOS | Yes |
+| isIPv6 | 检查字符串是否为IPv6地址 | function | No | Android,iOS | Yes |
+| Server | TCP服务器对象 | object | No | Android,iOS | Yes |
+| Socket | TCP套接字对象 | object | No | Android,iOS | Yes |
+| TLSServer | TLS服务器对象 | object | No | Android,iOS | Yes |
+| TLSSocket | TLS套接字对象 | object | No | Android,iOS | Yes |
### Server
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| Name | Description | Type | Required | Platform | HarmonyOS |
| ---- | ----------- | ---- | -------- | -------- | ------------------ |
-| address() | Returns the bound `address`, the address `family` name, and `port` of the server as reported by the operating system if listening | function | no | Android,iOS | yes |
-| listen(options, callback) | Start a server listening for connections | function | no | Android,iOS | yes |
-| close(callback) | Stops the server from accepting new connections and keeps existing connections | function |no | Android,iOS | yes |
-| getConnections(callback) | Asynchronously get the number of concurrent connections on the server | function | no | Android,iOS | yes |
-| listening | whether to enable the listening | boolean | no | Android,iOS | yes |
-| on('close') | Triggered when the server is shut down | event | no | Android,iOS | yes |
-| on('connection') | Triggered when the server receives a new connection | event | no | Android,iOS | yes |
-| on('error') | Triggered when an error occurs on the server | event | no | Android,iOS | yes |
-| on('listening') | Triggered when the server starts listening | event | no | Android,iOS | yes |
+| address() | 返回服务器绑定的地址、地址族名称和端口号 | function | No | Android,iOS | Yes |
+| listen(options, callback) | 启动服务器监听连接 | function | No | Android,iOS | Yes |
+| close(callback) | 停止服务器接受新连接,但保持现有连接 | function | No | Android,iOS | Yes |
+| getConnections(callback) | 异步获取服务器上的并发连接数 | function | No | Android,iOS | Yes |
+| listening | 是否启用监听 | boolean | No | Android,iOS | Yes |
+| on('close') | 当服务器关闭时触发 | event | No | Android,iOS | Yes |
+| on('connection') | 当服务器接收到新连接时触发 | event | No | Android,iOS | Yes |
+| on('error') | 当服务器发生错误时触发 | event | No | Android,iOS | Yes |
+| on('listening') | 当服务器开始监听时触发 | event | No | Android,iOS | Yes |
### Socket
| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ---- | ----------- | ---- | -------- | -------- | ------------------ |
-| address() | Returns the bound `address`, the address `family` name and `port` of the socket as reported | function | no | Android,iOS | yes |
-| destroy() | Ensures that no more I/O activity happens on this socket. Destroys the stream and closes the connection | function | no | Android,iOS | yes |
-| end() | Half-closes the socket. i.e., it sends a FIN packet. It is possible the server will still send some data | function | no | Android,iOS | yes |
-| setEncoding(encoding) | Set the encoding for the socket as a Readable Stream. By default, no encoding is assigned and stream data will be returned as `Buffer` objects | function | no | Android,iOS | yes |
-| setNoDelay(noDelay) | Set no delay | function | no | Android,iOS | yes |
-| setTimeout() | Sets the socket to timeout after `timeout` milliseconds of inactivity on the socket. By default `TcpSocket` do not have a timeout | function | no | Android,iOS | yes |
-| write(buffer, encoding, cb) | Sends data on the socket. The second parameter specifies the encoding in the case of a string — it defaults to UTF8 encoding | function | no | Android,iOS | yes |
-| pause() | Pauses the reading of data. That is, `'data'` events will not be emitted. Useful to throttle back an upload | function | no | Android,iOS | yes |
-| resume() | Resumes reading after a call to `socket.pause()` | function | no | Android,iOS | yes |
-| writableNeedDrain | whether need to wait for data to be written to the socket | boolean | no | Android,iOS | yes |
-| bytesRead | Indicates the number of bytes of data that have been read from the socket | number | no | Android,iOS | yes |
-| bytesWritten | get the number of bytes last written to the socket | number | no | Android,iOS | yes |
-| connecting | whether the current socket is being connected | boolean | no | Android,iOS | yes |
-| destroyed | Whether the socket has been destroyed | boolean | no | Android,iOS | yes |
-| localAddress | Local ip address | string | no | Android,iOS | yes |
-| localPort | Local port | number | no | Android,iOS | yes |
-| remoteAddress | remote server IP address | string | no | Android,iOS | yes |
-| remoteFamily | remote server IP address type | string | no | Android,iOS | yes |
-| remotePort | remote server port | number | no | Android,iOS | yes |
-| pending | Whether has pending data to be sent to the remote server | boolean | no | Android,iOS | yes |
-| timeout | The timeout period for the socket, in milliseconds. The default timeout period is 30 seconds | number | no | Android,iOS | yes |
-| readyState | the state of socket,`0`: not connected,`1`:connected,2: closing,3:closed | number | no | Android,iOS | yes |
-| on('pause') | Triggered when pauses the reading of data | event | no | Android,iOS | yes |
-| on('resume') | Triggered when Resumes the reading of data | event | no | Android,iOS | yes |
-| on('close') | Triggered when socket is closed | event | no | Android,iOS | yes |
-| on('connect') | Triggered when socket is connected | event | no | Android,iOS | yes |
-| on('data') | Triggered when socket receives data | event | no | Android,iOS | yes |
-| on('drain') | Triggered when the buffer becomes empty, indicating that data can be written to the socke | event | no | Android,iOS | yes |
-| on('error') | Triggered when an error occurs on the socket | event | no | Android,iOS | yes |
-| on('timeout') | Triggered When the connection or data transmission times out | event | no | Android,iOS | yes |
+| ---- | ---- | ---- | -------- | ---- | -------- |
+| address() | 返回套接字绑定的地址、地址族名称和端口号 | function | No | Android,iOS | Yes |
+| destroy() | 确保该套接字上不再发生I/O活动。销毁流并关闭连接 | function | No | Android,iOS | Yes |
+| end() | 半关闭套接字(发送FIN包),服务器可能仍会发送数据 | function | No | Android,iOS | Yes |
+| setEncoding(encoding) | 设置套接字作为可读流的编码格式,默认为Buffer对象 | function | No | Android,iOS | Yes |
+| setNoDelay(noDelay) | 设置无延迟 | function | No | Android,iOS | Yes |
+| setTimeout() | 设置套接字空闲超时时间,默认无超时 | function | No | Android,iOS | Yes |
+| write(buffer, encoding, cb) | 通过套接字发送数据,字符串编码默认为UTF8 | function | No | Android,iOS | Yes |
+| pause() | 暂停数据读取(停止触发data事件),用于控制上传速率 | function | No | Android,iOS | Yes |
+| resume() | 恢复被pause()暂停的数据读取 | function | No | Android,iOS | Yes |
+| writableNeedDrain | 是否需要等待数据写入套接字 | boolean | No | Android,iOS | Yes |
+| bytesRead | 已从套接字读取的数据字节数 | number | No | Android,iOS | Yes |
+| bytesWritten | 最后写入套接字的字节数 | number | No | Android,iOS | Yes |
+| connecting | 当前套接字是否正在连接中 | boolean | No | Android,iOS | Yes |
+| destroyed | 套接字是否已被销毁 | boolean | No | Android,iOS | Yes |
+| localAddress | 本地IP地址 | string | No | Android,iOS | Yes |
+| localPort | 本地端口号 | number | No | Android,iOS | Yes |
+| remoteAddress | 远程服务器IP地址 | string | No | Android,iOS | Yes |
+| remoteFamily | 远程服务器IP地址类型 | string | No | Android,iOS | Yes |
+| remotePort | 远程服务器端口号 | number | No | Android,iOS | Yes |
+| pending | 是否仍有待发送到远程服务器的数据 | boolean | No | Android,iOS | Yes |
+| timeout | 套接字超时时长(毫秒),默认为30秒 | number | No | Android,iOS | Yes |
+| readyState | 套接字状态:0-未连接,1-已连接,2-关闭中,3-已关闭 | number | No | Android,iOS | Yes |
+| on('pause') | 暂停数据读取时触发 | event | No | Android,iOS | Yes |
+| on('resume') | 恢复数据读取时触发 | event | No | Android,iOS | Yes |
+| on('close') | 套接字关闭时触发 | event | No | Android,iOS | Yes |
+| on('connect') | 套接字连接成功时触发 | event | No | Android,iOS | Yes |
+| on('data') | 套接字接收到数据时触发 | event | No | Android,iOS | Yes |
+| on('drain') | 缓冲区清空可继续写入数据时触发 | event | No | Android,iOS | Yes |
+| on('error') | 套接字发生错误时触发 | event | No | Android,iOS | Yes |
+| on('timeout') | 连接或数据传输超时时触发 | event | No | Android,iOS | Yes |
### TLSServer
-[!TIP] TLSServer继承自Server对象,拥有Server对象的所有属性、方法和事件,以下仅列出其独有的属性。
+[!TIP] TLSServer 继承自 Server 对象,拥有 Server 对象的所有属性、方法和事件,以下仅列出其独有的属性。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ---- | ----------- | ---- | -------- | -------- | ------------------ |
-| setSecureContext(options) | Set Security Context | function | no | Android,iOS | yes |
-| on('secureConnection') | Triggered When a secure TLS connection is established | event | no | Android,iOS | yes |
+| ---- | ---- | ---- | -------- | ---- | -------- |
+| setSecureContext(options) | 设置安全上下文 | function | No | Android,iOS | Yes |
+| on('secureConnection') | 当建立安全的 TLS 连接时触发 | event | No | Android,iOS | Yes |
### TLSSocket
[!TIP] TLSSocket继承自Socket对象,拥有Socket对象的所有属性、方法和事件,以下仅列出其独有的属性。
| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ---- | ----------- | ---- | -------- | -------- | ------------------ |
-| getCertificate() | Get a Local Certificate Information | function | no | Android | yes |
-| getPeerCertificate() | Get the Certificate Information of the Remote Server | function | no | Android | yes |
-| on('secureConnect') | Triggered When a secure connection is established | event | no | Android,iOS | yes |
+| ---- | ---- | ---- | -------- | ---- | -------- |
+| getCertificate() | 获取本地证书信息 | function | No | Android | Yes |
+| getPeerCertificate() | 获取远程服务器的证书信息 | function | No | Android | Yes |
+| on('secureConnect') | 当建立安全连接时触发 | event | No | Android,iOS | Yes |
## 遗留问题
diff --git a/zh-cn/react-native-text-gradient.md b/zh-cn/react-native-text-gradient.md
index 7cff4c4c181595e8f1effea4adea29c3690d4778..e5cfb7c946d98bbb2bf83bd23efbceaddb372f98 100644
--- a/zh-cn/react-native-text-gradient.md
+++ b/zh-cn/react-native-text-gradient.md
@@ -14,15 +14,16 @@
> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-text-gradient)
-| 三方库版本 | 包 名 | 仓库地址 | 发布信息 | 支持RN版本 |
-| -------- | -------- | --------- |---------|----------|
-| 0.1.7 | @react-native-oh-tpl/react-native-text-gradient |[GitHub ](https://github.com/react-native-oh-library/react-native-text-gradient)| [GitHub Release ](https://github.com/react-native-oh-library/react-native-text-gradient/releases)| 0.72 |
-| 0.2.0 | @react-native-ohos/react-native-text-gradient | [GitCode](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient) | [GitCode Release](https://gitcode.com/openharmony-sig/rntpc_react-native-text-gradient/releases)| 0.77 |
## 安装与使用
请到三方库的 Releases 发布地址查看配套的版本信息:
+| 三方库版本 | 发布信息 | 支持RN版本 |
+| ---------- | ------------------------------------------------------------ | ---------- |
+| 0.1.7-0.0.4 | [@react-native-oh-tpl/react-native-text-gradient Releases](https://github.com/react-native-oh-library/react-native-text-gradient/releases) | 0.72 |
+| 0.2.0 | [@react-native-ohos/react-native-text-gradient Releases]() | 0.77 |
+
进入到工程目录并输入以下命令:
diff --git a/zh-cn/react-native-vision-camera.md b/zh-cn/react-native-vision-camera.md
index 29373a3ae80996e6666b9b7258ddccbd1db97242..688c716c90bf09b483b3f4221f4407158abf581a 100644
--- a/zh-cn/react-native-vision-camera.md
+++ b/zh-cn/react-native-vision-camera.md
@@ -19,14 +19,7 @@
## 安装与使用
-请到三方库的 Releases 发布地址查看配套的版本信息:
-
-| 三方库版本 | 发布信息 | 支持RN版本 |
-| ---------- | ------------------------------------------------------------ | ---------- |
-| 4.0.2 | [@react-native-oh-tpl/react-native-vision-camera Releases](https://github.com/react-native-oh-library/react-native-vision-camera/releases) | 0.72 |
-| 4.7.1 | [@react-native-ohos/react-native-vision-camera Releases](https://gitcode.com/openharmony-sig/rntpc_react-native-vision-camera/blob/br_rnoh0.77/CHANGELOG.md) | 0.77 |
-
-对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
+请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/react-native-vision-camera Releases](https://github.com/react-native-oh-library/react-native-vision-camera/releases) 。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
进入到工程目录并输入以下命令:
@@ -297,9 +290,9 @@ ohpm install
### 兼容性
-本文档内容基于以下版本验证通过:
-1. RNOH: 0.72.75; SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
-2. RNOH:0.77.18;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
+要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。
+
+请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息:[@react-native-oh-tpl/react-native-vision-camera Releases](https://github.com/react-native-oh-library/react-native-vision-camera/releases)
### 权限要求
diff --git a/zh-cn/victory-native-xl.md b/zh-cn/victory-native-xl.md
index 2ad9996f1d3d931579233ed519eacf363f6c24eb..49abaf365bd5565e94146df06f165eebf301f1b1 100644
--- a/zh-cn/victory-native-xl.md
+++ b/zh-cn/victory-native-xl.md
@@ -15,38 +15,22 @@
> [!TIP] [Github 地址](https://github.com/react-native-oh-library/victory-native-xl)
-| 三方库版本 | 包 名 | 仓库地址 | 发布信息 | 支持RN版本 |
-| -------- | -------- | --------- |---------|----------|
-| 41.1.0 | @react-native-oh-tpl/victory-native-xl | [Github](https://github.com/react-native-oh-library/victory-native-xl)| [Github Releases](https://github.com/react-native-oh-library/victory-native-xl/releases) | 0.72 |
-| 41.17.5 | @react-native-ohos/victory-native-xl | [Github](https://github.com/react-native-oh-library/victory-native-xl)| [Github Releases](https://github.com/react-native-oh-library/victory-native-xl/releases) | 0.77 |
-
-
## 安装与使用
-请到三方库的 Releases 发布地址查看配套的版本信息:
-
-对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
+请到三方库的 Releases 发布地址查看配套的版本信息:[@react-native-oh-tpl/victory-native-xl Releases](https://github.com/react-native-oh-library/victory-native-xl/releases) 。对于未发布到npm的旧版本,请参考[安装指南](/zh-cn/tgz-usage.md)安装tgz包。
进入到工程目录并输入以下命令:
#### **npm**
```bash
-# V41.1.0
npm install @react-native-oh-tpl/victory-native-xl
-
-# V41.17.5
-npm install @react-native-ohos/victory-native-xl
```
#### **yarn**
```bash
-# V41.1.0
yarn add @react-native-oh-tpl/victory-native-xl
-
-# V41.17.5
-yarn add @react-native-ohos/victory-native-xl
```
下面的代码展示了这个库的基本使用场景:
@@ -111,10 +95,7 @@ export default function LineChartExample() {
要使用此库,需要使用正确的 React-Native 和 RNOH 版本。另外,还需要使用配套的 DevEco Studio 和 手机 ROM。
-请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息:
-
-1. RNOH: 0.72.27; SDK: HarmonyOS-Next-DB1 5.0.0.29(SP1); IDE: DevEco Studio 5.0.3.403; ROM: 3.0.0.25;
-2. RNOH: 0.77.1;SDK:HarmonyOS 5.1.1.208 (API Version 19 Release) ;IDE:DevEco Studio:5.1.1.830; ROM: HarmonyOS 6.0.0.112 SP12;
+请到三方库相应的 Releases 发布地址查看 Release 配套的版本信息:[@react-native-oh-tpl/victory-native-xl Releases](https://github.com/react-native-oh-library/victory-native-xl/releases)
## 属性
@@ -126,130 +107,119 @@ export default function LineChartExample() {
### Cartesian Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| --------------------------------------- | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- |
-| data | 用作图表数据点的数组 | array[] | yes | all | yes |
-| xKey | 一个string[]数组字符串表示的每个数据(数量)对象的键使用依赖(x)轴的图表 | string | yes | all | yes |
-| yKeys | 一个string[]数组字符串表示的每个数据(数量)对象的键使用依赖(y)轴的图表 | string[] | yes | all | yes |
-| children | children属性是一个渲染函数,它的唯一参数是一个对象,该对象暴露了转换后的数据,供你在绘图操作中使用) | function | yes | all | yes |
-| padding | 它指定Skia画布的外部边界和绘图边界将发生的位置之间的填充 | number | no | all | yes |
-| domain | 可以指定控制每个轴的上限和下限。它的默认值分别是每个范围的最小值和最大值 | object | no | all | yes |
-| domainPadding | 指定绘图区域的外部边界(例如,轴所在的位置)和绘制图表元素的位置之间的填充 | object | no | all | yes |
-| axisOptions | axisOptions是一个可选的属性,允许您配置图表的轴和网格。如果它不存在,那么图表将不会渲染任何轴或网格 | object | no | all | yes |
-| chartPressState | chartPressState属性允许你传入重新激活的SharedValues,它将用于跟踪图表上用户的“按下”手势。这通常是用来创建某种工具提示/活跃值指标。更深入的信息,请参阅图表手势页面如何使用这个属性 | object | no | all | yes |
-| renderOutside | renderOutside属性与form中的children属性相同,但它将渲染Skia画布的根元素(而不是在裁剪组内)。这允许你在已配置的任何坐标轴的边界之外渲染元素 | object | no | all | yes |
-| onChartBoundsChange | onChartBoundsChange属性是方法onChartBoundsChange?: (bounds: ChartBounds) => void;这将显示图表的边界,如果您需要为自己的自定义绘图目的访问图表的边界,这将非常有用 | function | no | all | yes |
-| gestureLongPressDelay | gestureLongPressDelay支持允许您设置的延迟毫秒平移手势之前激活。默认为100 | number | no | all | yes |
-| viewport41.17.5+ | 控制图表的可见范围。与domain设置数据的绝对边界不同,viewport确定图表窗口中当前可见的数据部分。 | object | no | all | yes |
-| xAxis41.17.5+ | X轴是一个可选的属性,允许你配置图表的X轴。如果它不存在,那么图表将不会渲染任何X轴。 | object | no | all | yes |
-| yAxis41.17.5+ | yAxis是一个可选的属性,允许你配置图表的Y轴。如果它不存在,那么图表将不会渲染任何y轴。要渲染多个Y轴,需要向数组中传入多个Y轴对象。| object | no | all | yes |
-| frame41.17.5+ | frame是一个可选的prop,允许你配置图表的帧数据。如果它不存在,那么图表将不会渲染任何帧。 | object | no | all | yes |
-| chartPressConfig41.17.5+ | chartPressConfig支持允许您配置平移手势处理程序用于图表交互。 | object | no | all | yes |
-| transformState41.17.5+ | transformState支持允许您通过允许平移和缩放变换状态对象交互图。 | object | no | all | yes |
-| transformConfig41.17.5+ | 一个可选的配置对象当transformState提供定制转换行为 | object | no | all | yes |
-| customGestures41.17.5+ | customgesture属性允许你提供自定义手势处理程序,它将与默认的图表按下手势一起工作(或代替)。它从react-native手势处理程序接受一个composdgesture。 | object | no | all | yes |
-| actionsRef41.17.5+ | actionsRef属性允许你程序化地访问某些图表动作。它接受一个ref对象,该对象将用控制图表行为的方法填充。 | object | no | all | yes |
-| onScaleChange41.17.5+ | 一个回调函数,当图表的刻度发生变化时,由于数据更新或缩放/平移转换,该函数将被调用。该函数接收两个参数:·xScale:当前x轴刻度(d3线性刻度)·yScale:当前y轴刻度(d3线性刻度)。| function | no | all | yes |
-| gestureHandlerConfig41.17.5+ | gestureHandlerConfig属性允许你配置底层的React Native手势处理程序实例。这是用于微调手势交互,比如启用/禁用web平台上的上下文菜单或调整触摸行为。 | object | no | web | no |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| data | An array of objects to be used as data points for the chart | array[] | yes | all | yes
+| xKey | A string value indicating the key of each data[number] object to be used on the independent (x) axis for charting. E.g. "day" if you want to use the "day" field of the data points for the x-axis | string | yes | all | yes
+| yKeys | A string[] array of string indicating the keys of each data[number] object to be used on the dependent (y) axis for charting. E.g. yKeys={["lowTmp", "highTmp"]} if you want to chart both high and low temperatures on the y-axis and those values have keys of lowTmp and highTmp respectively | string[] | yes | all | yes
+| children | The children prop is a render function whose sole argument is an object that exposes transformed data for you to use in your drawing operations. For example, the children render function's argument has a points field that exposes a version of your input data that's transformed to be plotted on the Canvas (see the Example section above for an example of this)| function | yes | all | yes
+| padding | A number or an object of shape { left?: number; right?: number; top?: number; bottom?: number; } that specifies that padding between the outer bounds of the Skia canvas and where the charting bounds will occur | number | no | all | yes
+| domain | An object of shape { x?: [number] \| [number, number]; y?: [number] \| [number, number] } that can be specified to control the upper and lower bounds of each axis. It defaults to the min and max of each range respectively | object | no | all | yes
+| domainPadding | A number or an object of shape { left?: number; right?: number; top?: number; bottom?: number; } that specifies that padding between the outer bounds of the charting area (e.g. where the axes lie) and where chart elements will be plotted | object | no | all | yes
+| axisOptions | The axisOptions is an optional prop allows you to configure the axes and grid of the chart. If it is not present then the chart will not render any axes or grid | object | no | all | yes
+| chartPressState | The chartPressState prop allows you to pass in Reanimated SharedValues that will be used to track the user's "press" gesture on the chart. This is generally used for creating some sort of tooltip/active value indicator. See the Chart Gestures page for more in-depth information on how to use this prop | object | no | all | yes
+| renderOutside | The renderOutside prop is identical to the children prop in form, but it will render elements at the root of the Skia canvas (not inside of a clipping group). This allows you to render elements outside of the bounds of any axes that you have configured | object | no | all | yes
+| onChartBoundsChange | The onChartBoundsChange prop is a function of the shape onChartBoundsChange?: (bounds: ChartBounds) => void; that exposes the chart bounds, useful if you need access to the chart's bounds for your own custom drawing purposes | function | no | all | yes
+| gestureLongPressDelay | The gestureLongPressDelay prop allows you to set the delay in milliseconds before the pan gesture is activated. Defaults to 100 | number | no | all | yes
+
### Line Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------ | ------------------------------------------------------------ | ------- | -------- | -------- | ----------------- |
-| points | 来自points对象字段的PointsArray数组暴露给CartesianChart的子渲染函数,如上面的示例所示 | array[] | no | all | yes |
-| animate | animate prop接受一个PathAnimationConfig对象,并在点发生变化时对路径进行动画 | object | no | all | yes |
-| curveType | 一个CurveType值,表示应该绘制的曲线类型 (例如: linear or natural) | string | no | all | yes |
-| connectMissingData | connectMissingData:布尔值,用于显示缺失的数据应该插值生成的路径。如果设置为true,输出将是单个连接的折线图路径(即使缺少数据值)。如果设置为false,如果缺少数据值-路径将由多个断开连接的“部分”组成 | boolean | no | all | yes |
-| children | children属性是Skia Path元素内部渲染的子通道,用于渐变路径| object | no | all | yes |
-| strokeWidth | 设置线条的宽度 | number | no | all | yes |
-| color | 设置线条的颜色 | string | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes
+| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points changes | object | no | all | yes
+| curveType | A CurveType value that indicates the type of curve should be drawn (e.g. linear or natural) | string | no | all | yes
+| connectMissingData | The connectMissingData: boolean value that indicates whether missing data should be interpolated for the resulting Path. If set to true, the output will be a single, connected line chart path (even if there are missing data values). If set to false, if there is missing data values – the path will consist of multiple disconnected "parts"| boolean | no | all | yes
+| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes
+| strokeWidth| Set the width of the line | number| no | all | yes
+| color| Set the color of the line | string| no | all | yes
+
### Area Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------ | ------------------------------------------------------------ | ------- | -------- | -------- | ----------------- |
-| points | 来自points对象字段的PointsArray数组暴露给CartesianChart的子渲染函数,如上面的示例所示 | array[] | no | all | yes |
-| y0 | 指示区域路径“底部”应该运行的位置的数字。这个数字是画布坐标 | number | no | all | yes |
-| animate | animate prop接受一个PathAnimationConfig对象,并在点发生变化时对路径进行动画 | object | no | all | yes |
-| curveType | 一个CurveType值,表示应该绘制的曲线类型(例如线性或自然)。 | string | no | all | yes |
-| connectMissingData | 一个将在Skia Path元素内部渲染的子通道,如果你想制作一个渐变路径,这很有用| boolean | no | all | yes |
-| children | 一个将在Skia Path元素内部渲染的子通道,如果你想制作一个渐变路径,这很有用 | object | no | all | yes |
-| color | 设置区域的颜色 | string | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes
+| y0 | A number that indicates where the "bottom" of the area path should run. This number should be in canvas coordinates | number | no | all | yes
+| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points changes | object | no | all | yes
+| curveType | A CurveType value that indicates the type of curve should be drawn (e.g. linear or natural) | string | no | all | yes
+| connectMissingData | The connectMissingData: boolean value that indicates whether missing data should be interpolated for the resulting Path. If set to true, the output will be a single, connected area chart path (even if there are missing data values). If set to false, if there is missing data values – the path will consist of multiple disconnected "parts" | boolean | no | all | yes
+| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes
+| color| Set the color of the area | string| no | all | yes
+
### Bar Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------------- | ------------------------------------------------------------ | ------- | -------- | -------- | ----------------- |
-| points | 来自points对象的字段的PointsArray数组暴露了CartesianChart的子呈现函数,如上面的示例所示 | array[] | no | all | yes |
-| chartBounds | 一个用于正确绘制条形图的ChartBounds对象。这通常来自于CartesianChart的chartBounds渲染参数 | object | no | all | yes |
-| innerPadding | 一个介于0和1之间的可选数字,表示第一个和最后一个条之间的水平空间应该是“空白”的百分比。默认为0.2。使用0表示条形条之间没有间隙,使用接近1的值表示条形条越来越窄 | number | no | all | yes |
-| animate | animate prop接受一个PathAnimationConfig对象,并在点改变时对路径进行动画 | object | no | all | yes |
-| roundedCorners | roundedCorners属性允许你自定义BarGroup的每个角的角度。Bar组件。它是一个对象类型,定义了左上的半径,右上图右下角,左下侧的角落 | object | no | all | yes |
-| barWidth | barWidth prop接受一个数字,并将表的宽度设置为该数字。如果未提供,则默认值由该组条的总可用宽度、组中的条数以及组中条之间的填充量的组合决定。优先于barCount prop。将此用于最精细的条形表宽度控制 | no | all | yes |
-| barCount | barCount prop接受一个数字,并将条形的宽度设置为X个数据点。如果没有提供,则默认值由chartBounds和数据点数决定。无论数据点的数量如何,都可以获得固定的条宽度。将此用于更一般的条宽度控制 | number | no | all | yes |
-| children | 一个在Skia路径元素中渲染的子通道,如果你想做一个渐变路径,它会很有用 | object | no | all | yes |
-| color | 设置表的颜色 | string | no | all | yes |
-| labels41.17.5+ | labels属性允许您启用和自定义Bar组件的数据标签。数据标签文本是与Bar组件关联的y轴值。 | object | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| points | A PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes
+| chartBounds | A ChartBounds object needed to appropriately draw the bars. This generally comes from the chartBounds render argument of CartesianChart | object | no | all | yes
+| innerPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bars should be "white space". Defaults to 0.2. Use 0 for no gap between bars, and values closer to 1 to make bars increasingly narrow | number | no | all | yes
+| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points change | object | no | all | yes
+| roundedCorners | The roundedCorners prop allows you to customize the roundedness of each corner of the Bar component. It's an object type that defines the radii for the top-left, top-right, bottom-right, and bottom-left corners | object | no | all | yes
+| barWidth | The barWidth prop takes a number and sets the width of the bar to that number. If not provided, the default is determined by the chartBounds and number of data points. Takes precendence over the barCount prop. Use this for the most fine grained control of bar width | number | no | all | yes
+| barCount | The barCount prop takes a number and sets the width of the bar as if there X data points. If not provided, the default is determined by the chartBounds and number of data points. Useful for getting a fixed bar width regardless of the number of data points. Use this for a more general control of bar width | number | no | all | yes
+| children | A children pass-thru that will be rendered inside of the Skia Path element, useful if you'd like to make e.g. a gradient path | object | no | all | yes
+| color| Set the color of the bar| string| no | all | yes
+
### BarGroup Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------- | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- |
-| chartBounds | 一个用于正确绘制条形图的ChartBounds对象。这通常来自于CartesianChart的chartBounds渲染参数 | object | no | all | yes |
-| betweenGroupPadding | 一个介于0和1之间的可选数字,表示第一个和最后一个条组之间的水平空间应该是“空白”的百分比。默认为0.2。使用0表示组之间没有间隙,使用接近1的值表示条形图越来越窄 | number | no | all | yes |
-| withinGroupPadding | 一个介于0到1之间的可选数字,表示组中第一个条和最后一个条之间的水平空间应该是“空白”的比例。默认为0.2。使用0表示组内条之间没有间隙,使用接近1的值表示条越来越窄 | number | no | all | yes |
-| barWidth | barWidth prop接受一个数字,并将表的宽度设置为该数字。如果未提供,则默认值由该组条的总可用宽度、组中的条数以及组中条之间的填充量的组合决定。优先于barCount prop。将此用于最精细的条形表宽度控制 | number | no | all | yes |
-| barCount | barCount prop接受一个数字,并设置条形图的宽度,就好像有X个数据点一样。如果没有提供,默认值由chartBounds和数据点的数量决定。无论数据点的数量如何,都可以获得固定的条形宽度。用它来控制表宽 | number | no | all | yes |
-| onBarSizeChange | 当条形/表的大小发生变化时,它会提醒用户,这对于构建自定义工具提示并需要知道条形/表的大小很有用 | function | no | all | yes |
-| roundedCorners | roundedCorners属性允许你自定义BarGroup的每个角的角度。Bar组件。它是一个对象类型,定义了左上的半径,右上图右下角,左下侧的角落 | object | no | all | yes |
-| children | BarGroup的数组。Bar元素(见下文),表示要添加到Bar组中的Bar | object | no | all | yes |
-| color | 设置表的颜色 | string | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| chartBounds | A ChartBounds object needed to appropriately draw the bars. This generally comes from the chartBounds render argument of CartesianChart | object | no | all | yes
+| betweenGroupPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bar groups should be "white space". Defaults to 0.2. Use 0 for no gap between groups, and values closer to 1 to make bars increasingly narrow | number | no | all | yes
+| withinGroupPadding | An optional number between 0 and 1 that represents what fraction of the horizontal space between the first and last bars within a group should be "white space". Defaults to 0.2. Use 0 for no gap between bars within a group, and values closer to 1 to make bars increasingly narrow | number | no | all | yes
+| barWidth | The barWidth prop takes a number and sets the width of the bar to that number. If not provided, the default is determined by a combination of the total available width for the group of bars, the number of bars in the group, and the padding between the bars within the group. Takes precedence over barCount prop. Use this for the most fine grained control of bar width | number | no | all | yes
+| barCount | The barCount prop takes a number and sets the width of the bar as if there X data points. If not provided, the default is determined by the chartBounds and number of data points. Useful for getting a fixed bar width regardless of the number of data points. Use this for a more general control of bar width | number | no | all | yes
+| onBarSizeChange | That alerts the consumer when the size of the bars/groups changes, useful for if you're building a custom tooltip and need to know the size of the groups/bars | function | no | all | yes
+| roundedCorners | The roundedCorners prop allows you to customize the roundedness of each corner of a BarGroup.Bar component. It's an object type that defines the radii for the top-left, top-right, bottom-right, and bottom-left corners | object | no | all | yes
+| children | An array of BarGroup.Bar elements (see below) that represent the bars to add to the bar group | object | no | all | yes
+| color| Set the color of the bar | string| no | all | yes
+
### Scatter Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ----------- | ------------------------------------------------------------ | ------------ | -------- | -------- | ----------------- |
-| points | PointsArray数组来自points对象的一个字段,它暴露给CartesianChart的子渲染函数,如上面的示例所示 | array[] | no | all | yes |
-| radius | 圆的半径,正方形宽度的一半 | number | no | all | yes |
-| shape | 下列散点形状值之一,用于确定要绘制的每个点的形状 | ScatterShape | no | all | yes |
-| animate | animate属性的参数是一个PathAnimationConfig对象,它会在点发生变化时为路径添加动画 | object | no | all | yes |
-| children | BarGroup的数组。Bar元素(见下文),表示要添加到Bar组中的Bar | object | no | all | yes |
-| style | 设置样式描边或填充 | string | no | all | yes |
-| strokeWidth | 设置线条的宽度 | number | no | all | yes |
-| color | 设置表的颜色 | string | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| points | TA PointsArray array that comes from a field of the points object exposed the children render function of CartesianChart, as illustrated in the example above | array[] | no | all | yes
+| radius | radius of the circle, half the width of the square | number | no | all | yes
+| shape | One of the following ScatterShape values that determines the shape of each point to be drawn | ScatterShape | no | all | yes
+| animate | The animate prop takes a PathAnimationConfig object and will animate the path when the points change | object | no | all | yes
+| children | An array of BarGroup.Bar elements (see below) that represent the bars to add to the bar group | object | no | all | yes
+| style| set style stroke or fill | string| no | all | yes
+| strokeWidth| Set the width of the line | number| no | all | yes
+| color| Set the color of the bar| string| no | all | yes
### Polar Chart
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| -------------- | ------------------------------------------------------------ | ------- | -------- | -------- | ----------------- |
-| data | 用作图表数据点的对象数组 | array[] | yes | all | yes |
-| labelKey | 一个字符串值,指示要使用的每个数据[number]对象的键。目前只在图表的图例部分使用 | string | yes | all | yes |
-| valueKey | 一个字符串值,表示绘制饼图的每个data[number]对象的键 | string | yes | all | yes |
-| colorKey | 一个字符串值,表示绘制饼图的每个data[number]对象的键 | string | yes | all | yes |
-| children | PolarChart目前唯一支持的子程序是Pie。详情参见饼状图 | object | no | all | yes |
-| containerStyle | ViewStyle>;这将样式化包装Polar图表画布的视图 | object | no | all | yes |
-| canvasStyle | ViewStyle>;它为绘制极坐标图的画布设置样式 | object | no | all | yes |
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| data | An array of objects to be used as data points for the chart | array[] | yes | all | yes
+| labelKey | A string value indicating the key of each data[number] object to be used. Currently only used on the legend part of the chart. In the future we may add support for a variety of labels within the chart | string | yes | all | yes
+| valueKey | A string value indicating the key of each data[number] object to be used to draw a slice of the Pie | string | yes | all | yes
+| colorKey | A string value indicating the key of each data[number] object to be used to draw a slice of the Pie | string | yes | all | yes
+| children | The only supported children of a PolarChart is currently a Pie.Chart See the Pie Chart for more details | object | no | all | yes
+| containerStyle | A StyleProp that styles the View which wraps the Canvas of the Polar chart | object | no | all | yes
+| canvasStyle | A StyleProp that styles the Canvas upon which the Polar chart is drawn | object | no | all | yes
### Pie.Chart
-**制作条形图所需的条形相关属性**
-
-| Name | Description | Type | Required | Platform | HarmonyOS Support |
-| ------------------ | ------------------------------------------------------------ | -------- | -------- | -------- | ----------------- |
-| innerRadius | 一个数字或字符串(百分比),把饼图变成一个甜甜圈图。innerRadius属性是甜甜圈图内圆的半径。如果没有提供,图表仍然是饼状图 | number | no | all | yes |
-| circleSweepDegrees | 定义图表应该绘制多少度的数字。默认值是360,它将绘制一个完整的圆。如果您想绘制一个局部圆,可以将该道具设置为0到360之间的值 | number | no | all | yes |
-| startAngle | 定义图表起始角度的数字。更改此属性将旋转图表 | number | no | all | yes |
-| children | children属性是一个渲染函数,它通过数据进行映射,其唯一的参数是饼图的每个单独的切片,允许您根据需要自定义每个切片 | function | no | all | yes |
-| angularStrokeWidth | 表示饼状图切片宽度的数字 | number | no | all | yes |
-| angularStrokeColor | 一个字符串,用于改变饼图切片的颜色 | string | no | all | yes |
+**Bar related props for making Capped Bar chart**
+| Name | Description | Type | Required | Platform | HarmonyOS Support |
+| ---- | ----------- | ---- | -------- | -------- | ------------------ |
+| innerRadius | A number or string (as a percentage) which turns the Pie chart into a Donut chart. The innerRadius prop is the radius of the inner circle of the donut chart. If not provided, the chart will remain a Pie chart | number | no | all | yes
+| circleSweepDegrees | A number which defines how many degrees of the chart should be drawn. The default is 360 which will draw a full circle. If you want to draw a partial circle, you can set this prop to a value between 0 and 360 | number | no | all | yes
+| startAngle | A number which defines the starting angle of the chart. Changing this prop will rotate the chart | number | no | all | yes
+| children | The children prop is a render function which maps through the data and whose sole argument is each individual slice of the pie, allowing you to customize each slice as needed. E.g. this slice will have all the data needed to render a Pie.Slice | function | no | all | yes
+| angularStrokeWidth | A number which turns width of the Pie chart slice | number | no | all | yes
+| angularStrokeColor | A string which turns color of the Pie chart slice | string | no | all | yes
## 遗留问题
## 其他
-- V41.17.5 新增属性gestureHandlerConfig,该属性只支持web端,无需鸿蒙化,详细参照:
- [Cartesian Chart | Victory Native](https://nearform.com/open-source/victory-native/docs/cartesian/cartesian-chart/) 、 [GestureDetector | React Native Gesture Handler](https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/gesture-detector/#userselect-web-only)
-
## 开源协议
本项目基于 [The MIT License (MIT)]( https://www.mit-license.org/) ,请自由地享受和参与开源。