From 2eb606560fed2ef20317bcbb8a13a4f3e4d753b3 Mon Sep 17 00:00:00 2001
From: LuQian-KUN <894718128@qq.com>
Date: Fri, 8 Mar 2024 16:52:42 +0800
Subject: [PATCH 1/2] =?UTF-8?q?[Issues:=20#I96ZDX]=20=E6=B7=BB=E5=8A=A0rea?=
=?UTF-8?q?ct-native-stickyheader=E6=93=8D=E4=BD=9C=E6=96=87=E6=A1=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
1224/react-native-stickyheader.md | 137 ++++++++++++++++++++++++++++++
1 file changed, 137 insertions(+)
create mode 100644 1224/react-native-stickyheader.md
diff --git a/1224/react-native-stickyheader.md b/1224/react-native-stickyheader.md
new file mode 100644
index 00000000..dd28247a
--- /dev/null
+++ b/1224/react-native-stickyheader.md
@@ -0,0 +1,137 @@
+> 模板版本:v0.1.3
+
+
+
react-native-stickyheader
+
+
+
+
+
+
+
+## 介绍
+此组件实现类似React Native ScrollView组件的吸顶效果。 使用原生驱动动画,支持FlatList,SectionList,ListView等有onScroll方法的组件。
+
+> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-stickyheader/tree/sig_dev)
+## 安装与使用
+
+请到三方库的 Releases 发布地址查看配套的版本信息:[<@react-native-oh-tpl/react-native-stickyheader> Releases](https://github.com/react-native-oh-library/react-native-stickyheader/releases),并下载适用版本的 tgz 包。
+
+进入到工程目录并输入以下命令:
+
+> [!TIP] # 处替换为 tgz 包的路径
+
+
+
+#### **npm**
+
+```bash
+npm install @react-native-oh-tpl/react-native-stickyheader@file:#
+```
+
+#### **yarn**
+
+```bash
+yarn add @react-native-oh-tpl/react-native-stickyheader@file:#
+```
+
+
+
+下面的代码展示了这个库的基本使用场景:
+
+> [!WARNING] 使用时 import 的库名不变。
+
+```tsx
+import React, { useState, useCallback, useRef, useEffect } from 'react';
+import { StyleSheet, Text, View, FlatList, Animated } from 'react-native';
+import StickyHeader from 'react-native-stickyheader';
+
+function App() {
+ const scrollY = useRef(new Animated.Value(0));
+ const [data, setData] = useState([]);
+
+ useEffect(() => {
+ let array = [];
+ for (let index = 0; index < 100; index++) {
+ array.push(index);
+ }
+ setData(array);
+ }, []);
+
+ const renderItem = useCallback((info) => {
+ return (
+
+ {info.item}
+
+ );
+ }, []);
+
+ const keyExtractor = useCallback((item, index) => {
+ return index + '';
+ }, []);
+
+ return (
+
+
+
+ 文字
+ 文字
+ 文字
+ 文字
+
+
+
+
+
+
+ );
+}
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ backgroundColor: '#ffffff',
+ justifyContent: 'center',
+ },
+});
+
+export default App;
+```
+Note: scrollEventThrottle={1}此属性必须设置且为1,因为要保证有足够的偏移量回调。
+
+## 兼容性
+
+本文档内容基于以下版本验证通过:
+
+RNOH:0.72.13; SDK:HarmonyOS NEXT Developer Preview1; IDE:DevEco Studio 4.1.3.500; ROM:2.0.0.59;
+
+## 属性
+### 此组件有以下属性:
+
+| Property | Type | Required | Description |
+|---------------|--------|----------|---------------|
+| stickyHeaderY | number | NO | 滑动到多少悬浮 |
+| stickyScrollY | any | Yes | 动画的ScrollY回调|
+
+## 其他
+
+## 开源协议
+
+本项目基于 [MIT License](https://github.com/react-native-oh-library/react-native-stickyheader/blob/sig_dev/LICENSE) ,请自由地享受和参与开源。
--
Gitee
From bf4c40d039dddc72a5716ad90f8bf737e7a3a1d1 Mon Sep 17 00:00:00 2001
From: LuQian-KUN <894718128@qq.com>
Date: Mon, 11 Mar 2024 15:08:30 +0800
Subject: [PATCH 2/2] =?UTF-8?q?[Issues:=20#I96ZDX]=20=E6=B7=BB=E5=8A=A0rea?=
=?UTF-8?q?ct-native-stickyheader=E6=93=8D=E4=BD=9C=E6=96=87=E6=A1=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
1224/react-native-stickyheader.md | 14 +++++++-------
1 file changed, 7 insertions(+), 7 deletions(-)
diff --git a/1224/react-native-stickyheader.md b/1224/react-native-stickyheader.md
index dd28247a..10ec37c5 100644
--- a/1224/react-native-stickyheader.md
+++ b/1224/react-native-stickyheader.md
@@ -4,7 +4,7 @@
react-native-stickyheader
-
+
@@ -12,7 +12,7 @@
## 介绍
此组件实现类似React Native ScrollView组件的吸顶效果。 使用原生驱动动画,支持FlatList,SectionList,ListView等有onScroll方法的组件。
-> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-stickyheader/tree/sig_dev)
+> [!TIP] [Github 地址](https://github.com/react-native-oh-library/react-native-stickyheader/tree/sig)
## 安装与使用
请到三方库的 Releases 发布地址查看配套的版本信息:[<@react-native-oh-tpl/react-native-stickyheader> Releases](https://github.com/react-native-oh-library/react-native-stickyheader/releases),并下载适用版本的 tgz 包。
@@ -125,13 +125,13 @@ RNOH:0.72.13; SDK:HarmonyOS NEXT Developer Preview1; IDE:DevEco Studio 4.1
## 属性
### 此组件有以下属性:
-| Property | Type | Required | Description |
-|---------------|--------|----------|---------------|
-| stickyHeaderY | number | NO | 滑动到多少悬浮 |
-| stickyScrollY | any | Yes | 动画的ScrollY回调|
+| Property | Type | Required | Description | Platform | HarmonyOS
Support |
+|---------------|--------|----------|---------------|-----|-----|
+| StickyHeaderY | number | NO | 滑动到多少悬浮 | Android
IOS | YES |
+| StickyScrollY | any | Yes | 动画的ScrollY回调| Android
IOS | YES |
## 其他
## 开源协议
-本项目基于 [MIT License](https://github.com/react-native-oh-library/react-native-stickyheader/blob/sig_dev/LICENSE) ,请自由地享受和参与开源。
+本项目基于 [MIT License](https://github.com/react-native-oh-library/react-native-stickyheader/blob/sig/LICENSE) ,请自由地享受和参与开源。
--
Gitee