diff --git a/README.md b/README.md
index 7118baf77b0e13cbdfed2be6b2085815c0865c50..a8e6275bf412281a7551d248dd1626424ace7358 100644
--- a/README.md
+++ b/README.md
@@ -16,6 +16,7 @@
 | 4 | @react-native-community/slider | 4.4.3 | 是 | 90% | [@react-native-oh-library/slider@4.4.3-0.1.1](https://github.com/react-native-oh-library/react-native-slider/releases/tag/4.4.3-0.1.1) | [链接](zh-cn/react-native-slider.md) |
 | 5 | @react-native-masked-view/masked-view | 0.2.9 | 否 | 90% | [@react-native-oh-library/masked-view@0.2.9-0.0.1](https://github.com/react-native-oh-library/masked-view/releases/tag/0.2.9-0.0.1) | [链接](zh-cn/react-native-masked-view.md) |
 | 6 | @react-native-community/checkbox | 0.5.16 | 否 | 100% | [@react-native-oh-library/checkbox@0.5.16-0.0.2](https://github.com/react-native-oh-library/react-native-checkbox/releases/tag/0.5.16-0.0.2) | [链接](zh-cn/react-native-checkbox.md) |
+| 7 | react-native-linear-gradient | 3.0.0-alpha.1 | 是 | 90% | [@react-native-oh-library/react-native-linear-gradient@3.0.0-alpha.1-0.2.4](https://github.com/react-native-oh-library/react-native-linear-gradient/releases/tag/3.0.0-alpha.1-0.2.4) | [链接](zh-cn/react-native-linear-gradient.md) |
 ## 社区
 
 [react-native-oh-library](https://github.com/react-native-oh-library)
\ No newline at end of file
diff --git a/zh-cn/async-storage.md b/zh-cn/async-storage.md
index e3d29c239f103199c843991cf04939c627ebb117..ea2ff31a149f0cb1949b32a60bd48f059d1715f7 100644
--- a/zh-cn/async-storage.md
+++ b/zh-cn/async-storage.md
@@ -109,7 +109,7 @@ cd entry
 ohpm install --no-link
 ```
 
-### 配置 CMakeLists 和引入 SliderPackge
+### 配置 CMakeLists 和引入 AsynStoragePackge
 
 打开 `entry/src/main/cpp/CMakeLists.txt`，添加：
 
@@ -157,7 +157,7 @@ std::vector<std::shared_ptr<Package>> PackageProvider::getPackages(Package::Cont
 }
 ```
 
-### 在 ArkTs 侧引入 slider 组件
+### 在 ArkTs 侧引入 AsynStorage 组件
 
 打开 `entry/src/main/ets/RNPackagesFactory.ts`，添加：
 
diff --git a/zh-cn/picker.md b/zh-cn/picker.md
index 56fc9b8666a547422f514b425bfc3bbe77b1b718..7e222d9403892a97eb2938ffd55ac39ed9cfb7cb 100644
--- a/zh-cn/picker.md
+++ b/zh-cn/picker.md
@@ -163,31 +163,25 @@ import { SampleView, SAMPLE_VIEW_TYPE, PropsDisplayer } from "rnoh-sample-packag
 import { createRNPackages } from '../RNPackagesFactory'
 + import { RNCHarmonyPicker, HARMONY_PICKER_TYPE } from "rnoh-picker"
 
-@Entry
-@Component
-struct Index {
-  @StorageLink('RNAbility') rnAbility: RNAbility | undefined = undefined
-
   @Builder
-  buildCustomComponent(ctx: ComponentBuilderContext) {
+  function CustomComponentBuilder(ctx: ComponentBuilderContext) {
     if (ctx.descriptor.type === SAMPLE_VIEW_TYPE) {
       SampleView({
         ctx: ctx.rnohContext,
         tag: ctx.descriptor.tag,
-        buildCustomComponent: this.buildCustomComponent.bind(this)
+        buildCustomComponent: CustomComponentBuilder
       })
     }
 +   else if (ctx.descriptor.type === HARMONY_PICKER_TYPE) {
 +     RNCHarmonyPicker({
 +       ctx: ctx.rnohContext,
 +       tag: ctx.descriptor.tag,
-+       buildCustomComponent: this.buildCustomComponent.bind(this)
++       buildCustomComponent: CustomComponentBuilder
 +     })
 +   }
     ...
   }
   ...
-}
 ```
 
 ### 运行
diff --git a/zh-cn/react-native-checkbox.md b/zh-cn/react-native-checkbox.md
index 4683b14e4f61401b18ba36c93ef0f1d02aeef0aa..78661a7863f5b68288c96e0ed355640bf6a822fe 100644
--- a/zh-cn/react-native-checkbox.md
+++ b/zh-cn/react-native-checkbox.md
@@ -173,31 +173,25 @@ import { SampleView, SAMPLE_VIEW_TYPE, PropsDisplayer } from "rnoh-sample-packag
 import { createRNPackages } from '../RNPackagesFactory'
 + import { RNCCheckbox, CHECKBOX_TYPE } from "rnoh-checkbox"
 
-@Entry
-@Component
-struct Index {
-  @StorageLink('RNAbility') rnAbility: RNAbility | undefined = undefined
-
   @Builder
-  buildCustomComponent(ctx: ComponentBuilderContext) {
+  function CustomComponentBuilder(ctx: ComponentBuilderContext) {
     if (ctx.descriptor.type === SAMPLE_VIEW_TYPE) {
       SampleView({
         ctx: ctx.rnohContext,
         tag: ctx.descriptor.tag,
-        buildCustomComponent: this.buildCustomComponent.bind(this)
+        buildCustomComponent: CustomComponentBuilder
       })
     } 
 +   else if (ctx.descriptor.type === CHECKBOX_TYPE) {
 +     RNCCheckbox({
 +       ctx: ctx.rnohContext,
 +       tag: ctx.descriptor.tag,
-+       buildCustomComponent: this.buildCustomComponent.bind(this)
++       buildCustomComponent: CustomComponentBuilder
 +     })
 +   } 
     ...
   }
   ...
-}
 ```
 
 ### 运行
diff --git a/zh-cn/react-native-linear-gradient.md b/zh-cn/react-native-linear-gradient.md
new file mode 100644
index 0000000000000000000000000000000000000000..06c81b160f4a96510b763b74d6ad36725fc80ea6
--- /dev/null
+++ b/zh-cn/react-native-linear-gradient.md
@@ -0,0 +1,226 @@
+
+
+<p align="center">
+  <h1 align="center"> <code>react-native-linear-gradient</code> </h1>
+</p>
+<p align="center">
+    <a href="https://github.com/react-native-linear-gradient/react-native-linear-gradient">
+        <img src="https://img.shields.io/badge/platforms-android%20|%20ios%20|%20windows%20|%20harmony%20-lightgrey.svg" alt="Supported platforms" />
+    </a>
+    </p>
+
+## 安装与使用
+
+目前 React-Native-OpenHarmony(RNOH) 三方库的npm包部署在私仓，需要通过github token来获取访问权限。
+
+在与 `package.json` 文件相同的目录中，创建或编辑 `.npmrc` 文件以包含指定 GitHub Packages URL 和托管包的命名空间的行。 将TOKEN替换为RNOH三方库指定的token。
+```json
+@react-native-oh-library:registry=https://npm.pkg.github.com
+//npm.pkg.github.com/:_authToken=TOKEN
+```
+
+进入到工程目录并输入以下命令：
+
+```bash
+yarn add react-native-linear-gradient@npm:@react-native-oh-library/react-native-linear-gradient
+```
+
+或者
+
+```bash
+npm install react-native-linear-gradient@npm:@react-native-oh-library/react-native-linear-gradient
+```
+
+快速使用：
+
+```js
+import LinearGradient from 'react-native-linear-gradient';
+  <LinearGradient
+      angleCenter={{ x: 0.5, y: 0.5}}
+      colors={['green', 'bule', 'red']}
+      start={{x: 0, y: 0}} 
+      end={{x: 1, y: 0}}
+      style={styles.gradient}>
+        <Text style={styles.buttonText}>1111</Text>
+        <Text style={styles.buttonText}>2222</Text>
+        <Text style={styles.buttonText}>3333</Text>
+  </LinearGradient>
+```
+
+## Link
+
+目前鸿蒙暂不支持 AutoLink，所以Link步骤需要手动配置。
+
+首先需要使用DevEco Studio打开项目里的鸿蒙工程 `harmony`
+
+### 引入原生端代码
+
+目前有两种方法：
+
+1. 通过 har 包引入（在 IDE 完善相关功能后该方法会被遗弃，目前首选此方法）；
+2. 直接链接源码。
+
+方法一：通过 har 包引入
+打开 `entry/oh-package.json5`，添加以下依赖
+
+```json
+"dependencies": {
+    "rnoh": "file:../rnoh",
+    "rnoh-linear-gradient": "file:../../node_modules/react-native-linear-gradient/harmony/linear_gradient.har"
+  }
+```
+
+点击右上角的 `sync` 按钮
+
+或者在终端执行：
+
+```bash
+cd entry
+ohpm install
+```
+
+方法二：直接链接源码
+打开 `entry/oh-package.json5`，添加以下依赖
+
+```json
+"dependencies": {
+    "rnoh": "file:../rnoh",
+    "rnoh-linear-gradient": "file:../../node_modules/react-native-linear-gradient/harmony/linear_gradient"
+  }
+```
+
+打开终端，执行：
+
+```bash
+cd entry
+ohpm install --no-link
+```
+
+### 配置CMakeLists和引入LinearGradientPackage
+
+打开 `entry/src/main/cpp/CMakeLists.txt`，添加：
+
+```diff
+project(rnapp)
+cmake_minimum_required(VERSION 3.4.1)
+set(RNOH_APP_DIR "${CMAKE_CURRENT_SOURCE_DIR}")
+set(OH_MODULE_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../oh_modules")
+set(RNOH_CPP_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../../../../react-native-harmony/harmony/cpp")
+
+add_subdirectory("${RNOH_CPP_DIR}" ./rn)
+
+# RNOH_BEGIN: add_package_subdirectories
+add_subdirectory("../../../../sample_package/src/main/cpp" ./sample-package)
++ add_subdirectory("${OH_MODULE_DIR}/rnoh-linear-gradient/src/main/cpp" ./linear-gradient)
+# RNOH_END: add_package_subdirectories
+
+add_library(rnoh_app SHARED
+    "./PackageProvider.cpp"
+    "${RNOH_CPP_DIR}/RNOHAppNapiBridge.cpp"
+)
+
+target_link_libraries(rnoh_app PUBLIC rnoh)
+
+# RNOH_BEGIN: link_packages
+target_link_libraries(rnoh_app PUBLIC rnoh_sample_package)
++ target_link_libraries(rnoh_app PUBLIC rnoh_linear_gradient)
+# RNOH_END: link_packages
+```
+
+打开 `entry/src/main/cpp/PackageProvider.cpp`，添加：
+
+```diff
+#include "RNOH/PackageProvider.h"
+#include "SamplePackage.h"
++ #include "LinearGradientPackage.h"
+
+using namespace rnoh;
+
+std::vector<std::shared_ptr<Package>> PackageProvider::getPackages(Package::Context ctx) {
+    return {
+      std::make_shared<SamplePackage>(ctx),
++     std::make_shared<LinearGradientPackage>(ctx)
+    };
+}
+```
+
+
+### 在ArkTs侧引入 linear-gradient 组件
+
+打开 `entry/src/main/ets/pages/index.ets`，添加：
+
+```diff
+import {
+  RNApp,
+  ComponentBuilderContext,
+  RNAbility,
+  AnyJSBundleProvider,
+  MetroJSBundleProvider,
+  ResourceJSBundleProvider,
+} from 'rnoh'
+import { SampleView, SAMPLE_VIEW_TYPE, PropsDisplayer } from "rnoh-sample-package"
+import { createRNPackages } from '../RNPackagesFactory'
++ import { RNLinearGradient, LINEAR_GRADIENT_TYPE, LinearGradientDescriptor } from "rnoh-linear-gradient"
+
+  @Builder
+  function CustomComponentBuilder(ctx: ComponentBuilderContext) {
+    if (ctx.componentName === SAMPLE_VIEW_TYPE) {
+      SampleView({
+        ctx: ctx.rnohContext,
+        tag: ctx.descriptor.tag,
+        buildCustomComponent: CustomComponentBuilder
+      })
+    }
++   else if (ctx.componentName === LINEAR_GRADIENT_TYPE) {
++     RNLinearGradient({
++       ctx: ctx.rnohContext,
++       tag: ctx.descriptor.tag,
++       buildCustomComponent: CustomComponentBuilder
++     })
++   } 
+    ...
+  }
+  ...
+```
+
+### 运行
+
+点击右上角的 `sync` 按钮
+
+或者在终端执行：
+```bash
+cd entry
+ohpm install
+```
+
+然后编译、运行即可。
+
+
+
+## 兼容性
+要使用此库，需要使用正确的React-Native和RNOH版本。另外，还需要使用配套的 DevEco Studio 和 手机ROM。
+
+| `@react-native-oh-library/react-native-linear-gradient` Version | Required React Native Version | Required RNOH Version | Required DevEco Studio Version | Required ROM Version    |
+| ------------------------------------------------------------ | ----------------------------- | --------------------- | ------------------------------ | ----------------------- |
+| 3.0.0-alpha.1-0.2.4                                          | `>=0.72.5`                    | `>=0.72.6`            | `>=4.0.3.501`                  | `>=OpenHarmony 4.10.10` |
+
+
+## 属性
+
+
+| 名称        | 说明                                                     | 类型                   | 是否必填 | 原库平台 | 鸿蒙支持 |
+| ----------- | -------------------------------------------------------- | ---------------------- | -------- | -------- | -------- |
+| colors      | Color Array                                              | (string\|number)[]     | NO       | All      | yes      |
+| locations   | Color for unknown array (length 0 or the same as colors) | number[]               | NO       | All      | yes      |
+| useAngle    | Use angle (default false)                                | boolean                | NO       | All      | yes      |
+| angle       | Angle (useAngle=true valid)                              | number                 | NO       | All      | yes      |
+| angleCenter | Middle angle coordinate                                  | { x: number,y: number} | NO       | All      | no       |
+| start       | Starting point coordinates (default value: {x: 0.5,1})   | { x: number,y: number} | NO       | All      | partial  |
+| end         | End point coordinates (default value: {x: 0.5,1})        | { x: number,y: number} | NO       | All      | partial  |
+
+## 遗留问题
+
+## 其他
+
+## 开源协议
+本项目基于 [The MIT License (MIT)](https://github.com/react-native-oh-library/react-native-linear-gradient/blob/harmony/LICENSE) ，请自由地享受和参与开源。
\ No newline at end of file
diff --git a/zh-cn/react-native-masked-view.md b/zh-cn/react-native-masked-view.md
index b933f97875d96b9498faafae3555627be8f3c512..9009a39649bb53198b228709f5af41cf3f03157f 100644
--- a/zh-cn/react-native-masked-view.md
+++ b/zh-cn/react-native-masked-view.md
@@ -186,31 +186,25 @@ import { SampleView, SAMPLE_VIEW_TYPE, PropsDisplayer } from "rnoh-sample-packag
 import { createRNPackages } from '../RNPackagesFactory'
 + import { MaskedView, MASKED_VIEW_TYPE } from "rnoh-masked-view"
 
-@Entry
-@Component
-struct Index {
-  @StorageLink('RNAbility') rnAbility: RNAbility | undefined = undefined
-
   @Builder
-  buildCustomComponent(ctx: ComponentBuilderContext) {
+  function CustomComponentBuilder(ctx: ComponentBuilderContext) {
     if (ctx.descriptor.type === SAMPLE_VIEW_TYPE) {
       SampleView({
         ctx: ctx.rnohContext,
         tag: ctx.descriptor.tag,
-        buildCustomComponent: this.buildCustomComponent.bind(this)
+        buildCustomComponent: CustomComponentBuilder
       })
     }
 +   else if (ctx.descriptor.type === MASKED_VIEW_TYPE) {
 +     MaskedView({
 +       ctx: ctx.rnohContext,
 +       tag: ctx.descriptor.tag,
-+       buildCustomComponent: this.buildCustomComponent.bind(this)
++       buildCustomComponent: CustomComponentBuilder
 +     })
 +   }
     ...
   }
   ...
-}
 ```
 
 ### 运行