Skip to content

Commit 8ce4944

Browse files
author
bolan9999
authored
Merge pull request #29 from bolan9999/develop
Version 1.1.0
2 parents 0dce6e2 + 1b678e5 commit 8ce4944

File tree

14 files changed

+1979
-1537
lines changed

14 files changed

+1979
-1537
lines changed

‎README-cn.md‎

Lines changed: 93 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ import { LargeList } from "react-native-largelist";
4040
}}
4141
safeMargin={600}
4242
numberOfRowsInSection={section => this.props.numberOfEachSection}
43-
numberOfSections={this.props.numberOfSections}
43+
numberOfSections={()=>this.props.numberOfSections}
4444
heightForCell={(section, row) =>
4545
row % 2 ? this.minCellHeight : this.maxCellHeight}
4646
renderCell={this.renderItem.bind(this)}
@@ -79,12 +79,12 @@ import { LargeList } from "react-native-largelist"
7979
属性 | 类型 | 默认 |  作用  
8080
------ | ------ | --------- | --------
8181
（ViewPropTypes） | （ViewPropTypes） | | View的所有属性
82-
numberOfSections | number | 1 | 总的Section数量
82+
numberOfSections | ()=>number | ()=>1 | 总的Section数量
8383
numberOfRowsInSection | (section:number) => number | section=>0 | 函数：根据section索引返回当前section的Cell数量
8484
renderCell | (section:number,row:number) => React.Element | 必须 | 函数:根据当前Section和Row，返回当前Cell的render
8585
heightForCell | (section:number,row:number) => number | 必须 | 函数：根据Section和row index，返回当前Cell的高度
8686
renderSection | (section:number) => React.Element | section=>null | 函数：当前Section的render函数
87-
heightForSection | (section:number) => number | 0 | 函数：返回当前section的高度
87+
heightForSection | (section:number) => number | ()=>0 | 函数：返回当前section的高度
8888
renderHeader | () => React.Element | ()=>null | 函数：列表的头部组件的render函数
8989
renderFooter | () => React.Element | ()=>null | 函数：列表的尾部组件的render函数
9090
bounces | boolean | true | 组件滑动到边缘是否可以继续滑动，松开后弹回
@@ -107,27 +107,80 @@ onScroll | ({nativeEvent:{contentOffset:{x:number,y:number}}})=> any | | 滑动
107107

108108
# 高级属性
109109

110-
### safeMargin ( type:number ,default: 600)
111-
上下额外的预渲染高度，值越大在快速滑动过程中越不容易看到空白，但是第一次加载的时间越长
112-
### dynamicMargin (type:number,default: 500)
113-
在快速滑动过程中，允许上下端相互借用的预渲染高度。比如假设safeMargin=600，dynamicMargin=500，在快速下滑过程中，上端只额外渲染100高度，下端额外渲染1100高度，反之亦然。 在慢速滑动过程中该属性无作用。请注意：该属性不能大于safeMargin
114-
### scrollEventThrottle (type: number ,default: ios:16 android:32)
115-
同ScrollView的scrollEventThrottle，滑动过程中，onScroll回调时间最小间隔，值越小，相同的滑动追踪次数越多，越不容易出现空白，性能越差。
116-
### onIndexPathDidEnterSafeArea (type:(indexPath:IndexPath)=>any)
117-
当一个indexPath进入SafeArea时回调
118-
### onIndexPathDidLeaveSafeArea (type:(indexPath:IndexPath)=>any)
119-
当一个indexPath离开SafeArea时回调
120-
### showsVerticalScrollIndicator (type:bool,default:true)
121-
显示垂直滚动指示器
122-
### onSectionDidHangOnTop (type:section=>any, default: ()=>{})
123-
当一个新的Section被挂在LargeList顶部时的回调
124-
### speedLevel1 (type:number, default:4)
125-
当滑动的速度超过这个speedLevel1，LargeList则不会rerender，仅仅只是移动位置。 单位是 每毫秒移动的逻辑像素量。
126-
### speedLevel2 (type:number, default:10)
127-
当前版本无意义
128-
### nativeOptimize (type:bool, default: false)
129-
启用原生优化，iOS专用。这是一个实验性的功能，使用该功能以后，safeArea就没有意义了。要使用改功能，请将"${YourProject}/node_modules/react-native-largelist/ios/STTVTableView.xcodeproj"拖入您的iOS项目，并且保证链接了它
130-
110+
### safeMargin
111+
* type: number
112+
* default: 600
113+
* 上下额外的预渲染高度，值越大在快速滑动过程中越不容易看到空白，但是第一次加载的时间越长
114+
115+
### dynamicMargin
116+
* type: number
117+
* default: 500
118+
* 在快速滑动过程中，允许上下端相互借用的预渲染高度。比如假设safeMargin=600，dynamicMargin=500，在快速下滑过程中，上端只额外渲染100高度，下端额外渲染1100高度，反之亦然。 在慢速滑动过程中该属性无作用。请注意：该属性不能大于safeMargin
119+
120+
### scrollEventThrottle
121+
* type: number
122+
* default: ios:16
123+
* 同ScrollView的scrollEventThrottle，滑动过程中，onScroll回调时间最小间隔，值越小，相同的滑动追踪次数越多，越不容易出现空白，性能越差。
124+
125+
### onIndexPathDidEnterSafeArea
126+
* type: (indexPath:IndexPath)=>any
127+
* default: ()=>null
128+
* 当一个indexPath进入SafeArea时回调
129+
130+
### onIndexPathDidLeaveSafeArea
131+
* type: (indexPath:IndexPath)=>any
132+
* default: ()=>null
133+
* 当一个indexPath离开SafeArea时回调
134+
135+
### showsVerticalScrollIndicator
136+
* type: bool
137+
* default: true
138+
* 显示垂直滚动指示器
139+
140+
### onSectionDidHangOnTop
141+
* type: section=>any
142+
* default: ()=>null
143+
* 当一个新的Section被挂在LargeList顶部时的回调
144+
145+
### speedLevel1
146+
* type: number
147+
* default: 4
148+
* 当滑动的速度超过这个speedLevel1，LargeList则不会rerender，仅仅只是移动位置。 单位是 每毫秒移动的逻辑像素量。
149+
150+
### speedLevel2
151+
* type: number
152+
* default: 10
153+
* 当前版本无意义
154+
155+
### nativeOptimize
156+
* type: bool
157+
* default: false
158+
* 启用原生优化，iOS专用。这是一个实验性的功能，使用该功能以后，safeArea就没有意义了。要使用改功能，请将"${YourProject}/node_modules/react-native-largelist/ios/STTVTableView.xcodeproj"拖入您的iOS项目，并且保证链接了它
159+
160+
### onLoadMore
161+
* type: ()=>any
162+
* default: null
163+
* 上拉加载更多的回调，如果设置了此属性，则在下面会有一个上拉的控件
164+
165+
### heightForLoadMore
166+
* type: ()=>number
167+
* default: ()=>70
168+
* 上拉控件的高度
169+
170+
### allLoadCompleted
171+
* type: bool
172+
* default: false
173+
* 数据源是否全部加载完成
174+
175+
### renderLoadingMore
176+
* type: ()=>React.Element
177+
* default: ()=> < ActivityIndicator style={{ marginTop: 10, alignSelf: "center" }} size={"large"}/ >
178+
* 用户自定义上拉加载更多的动画视图，目前暂不支持事件驱动动画
179+
180+
### renderLoadCompleted
181+
* type: ()=>React.Element
182+
* default: ()=> < Text style={{ marginTop: 20, alignSelf: "center", fontSize: 16 }}>No more data< /Text >
183+
* 用户自定义上拉时，加载完成的动画视图。
131184

132185
# 方法
133186
### scrollTo(offset:Offset, animated:boolean=true)
@@ -136,7 +189,7 @@ onScroll | ({nativeEvent:{contentOffset:{x:number,y:number}}})=> any | | 滑动
136189
滑动到一个指定的IndexPath:{section:number,row:number}
137190
### scrollToEnd(animated:boolean=true)
138191
滑动到最底部
139-
### visiableIndexPaths():IndexPath[]
192+
### visibleIndexPaths():IndexPath[]
140193
获取当前可见的所有IndexPaths
141194
### renderedIndexPaths():IndexPath[]
142195
获取当前已经渲染好的所有IndexPaths
@@ -183,6 +236,20 @@ onScroll | ({nativeEvent:{contentOffset:{x:number,y:number}}})=> any | | 滑动
183236

184237
## 目标计划
185238
1. 修正细节问题
186-
2. 提供编辑功能
239+
2. 提供左右滑动编辑功能
240+
3. 代码优化，支持TypeScript类型检查
241+
242+
243+
# 更新日志
244+
245+
### 版本 1.1.0
246+
* 添加上拉加载更多
247+
* 修复reloadData有时候出现问题
248+
* 修复scrollTo几个方法，如果动画为false，会出现bug的问题
249+
* 将 "visiableIndexPaths" 修改为 "visibleIndexPaths", "visiableIndexPaths" 将在2.0.0版本后完全不支持
250+
* "numberOfSections"的类型由number改变为function, number 将在2.0.0版本后完全不支持
251+
252+
### Version 1.0.0
253+
* release
187254

188255

‎README.md‎

Lines changed: 96 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ import { LargeList } from "react-native-largelist";
4747
}}
4848
safeMargin={600}
4949
numberOfRowsInSection={section => this.props.numberOfEachSection}
50-
numberOfSections={this.props.numberOfSections}
50+
numberOfSections={()=>this.props.numberOfSections}
5151
heightForCell={(section, row) =>
5252
row % 2 ? this.minCellHeight : this.maxCellHeight}
5353
renderCell={this.renderItem.bind(this)}
@@ -86,12 +86,12 @@ Props:
8686
Props | type | default |  effect  
8787
------ | ------ | --------- | --------
8888
（ViewPropTypes） | （ViewPropTypes） | | All props of View
89-
numberOfSections | number | 1 | number of sections in tableview
89+
numberOfSections | ()=>number | ()=>1 | number of sections in tableview
9090
numberOfRowsInSection | (section:number) => number | section=>0 | function：return the number of rows in section
9191
renderCell | (section:number,row:number) => React.Element | required | function: render of cell with section and row index
9292
heightForCell | (section:number,row:number) => number | required | function：return height for cell with section and row index
9393
renderSection | (section:number) => React.Element | section=>null | function：render of section with section index
94-
heightForSection | (section:number) => number | 0 | function：return height of section with section index
94+
heightForSection | (section:number) => number | ()=>0 | function：return height of section with section index
9595
renderHeader | () => React.Element | ()=>null | function：render of header in the tableview
9696
renderFooter | () => React.Element | ()=>null | function：render of footer in tableview
9797
bounces | boolean | true | bounces
@@ -111,33 +111,87 @@ Look up the design of react-native-largelist:
111111
![](./readme_resources/largelist_advanced_usage.png)
112112

113113
# Advanced Usage
114-
### safeMargin ( type:number ,default: 600)
115-
The height of rendering children out side of visiable area. The greater the value is, the less easily you see the blank in the fast sliding process, but the longer the first time it is loaded
116-
### dynamicMargin (type:number,default: 500)
117-
The height of dynamic safe margin when sliding too fast. For example, if safeMargin=600 and dynamicMargin=500, it will render 100 height on top and 1100 height on bottom out side of the visiable area when sliding down too fast.
114+
### safeMargin
115+
* type: number
116+
* default: 600
117+
* The height of rendering children out side of visible area. The greater the value is, the less easily you see the blank in the fast sliding process, but the longer the first time it is loaded
118+
119+
### dynamicMargin
120+
* type: number
121+
* default: 500
122+
* The height of dynamic safe margin when sliding too fast. For example, if safeMargin=600 and dynamicMargin=500, it will render 100 height on top and 1100 height on bottom out side of the visible area when sliding down too fast.
118123

119124
Notice:
120125

121126
1. It does not work when the speed of sliding is slow.
122127
2. It can not be set larger than safeMargin
123128

124129

125-
### scrollEventThrottle (type: number ,default: ios:16 android:32)
126-
It is the same as scrollEventThrottle on ScrollView
127-
### onIndexPathDidEnterSafeArea (type:(indexPath:IndexPath)=>any)
128-
The callback when an indexpath did enter safeArea.
129-
### onIndexPathDidLeaveSafeArea (type:(indexPath:IndexPath)=>any)
130-
The callback when an indexpath did leave safeArea.
131-
### showsVerticalScrollIndicator (type:bool,default:true)
132-
Show vertical scroll indicator.
133-
### onSectionDidHangOnTop (type:section=>any, default: ()=>{})
134-
The callback when a new Section hang on the top of the LargeList.
135-
### speedLevel1 (type:number, default:4)
136-
If the speed of scrolling is faster than speedLevel1, LargeList will not rerender, just use "setNativeProps" to move the position. Unit is logic pixels/ms.
137-
### speedLevel2 (type:number, default:10)
138-
It does not work for the current version.
139-
### nativeOptimize (type:bool, default: false)
140-
Use native optimize, iOS only. This is an experimental prop.If it is set, safeArea doesn't make sense. To use the prop, you should add "${YourProject}/node_modules/react-native-largelist/ios/STTVTableView.xcodeproj" to your iOS project. And make sure link it.
130+
### scrollEventThrottle
131+
* type: number
132+
* default: ios:16
133+
* It is the same as scrollEventThrottle on ScrollView
134+
135+
### onIndexPathDidEnterSafeArea
136+
* type: (indexPath:IndexPath)=>any
137+
* default: ()=>null
138+
* The callback when an indexpath did enter safeArea.
139+
140+
### onIndexPathDidLeaveSafeArea
141+
* type: (indexPath:IndexPath)=>any
142+
* default: ()=>null
143+
* The callback when an indexpath did leave safeArea.
144+
145+
### showsVerticalScrollIndicator
146+
* type: bool
147+
* default: true
148+
* Show vertical scroll indicator.
149+
150+
### onSectionDidHangOnTop
151+
* type: section=>any
152+
* default: ()=>null
153+
* The callback when a new Section hang on the top of the LargeList.
154+
155+
### speedLevel1
156+
* type: number
157+
* default: 4
158+
* If the speed of scrolling is faster than speedLevel1, LargeList will not rerender, just use "setNativeProps" to move the position. Unit is logic pixels/ms.
159+
160+
### speedLevel2
161+
* type: number
162+
* default: 10
163+
* It does not work for the current version.
164+
165+
### nativeOptimize
166+
* type: bool
167+
* default: false
168+
* Use native optimize, iOS only. This is an experimental prop.If it is set, safeArea doesn't make sense. To use the prop, you should add "${YourProject}/node_modules/react-native-largelist/ios/STTVTableView.xcodeproj" to your iOS project. And make sure link it.
169+
170+
### onLoadMore
171+
* type: ()=>any
172+
* default: null
173+
* The callback when pull up on the bottom
174+
175+
### heightForLoadMore
176+
* type: ()=>number
177+
* default: ()=>70
178+
* function: return the height of Loading More View.
179+
180+
### allLoadCompleted
181+
* type: bool
182+
* default: false
183+
* Did all data source load completed?
184+
185+
### renderLoadingMore
186+
* type: ()=>React.Element
187+
* default: ()=> < ActivityIndicator style={{ marginTop: 10, alignSelf: "center" }} size={"large"}/ >
188+
* The render of custom Loading More View
189+
190+
### renderLoadCompleted
191+
* type: ()=>React.Element
192+
* default: ()=> < Text style={{ marginTop: 20, alignSelf: "center", fontSize: 16 }}>No more data< /Text >
193+
* The render of custom Loading Completed View.
194+
141195

142196
# Method
143197
### scrollTo(offset:Offset, animated:boolean=true)
@@ -146,8 +200,8 @@ Scroll to offset.
146200
Scroll to an indexpath.
147201
### scrollToEnd(animated:boolean=true)
148202
Scroll to the end of the LargeList.
149-
### visiableIndexPaths():IndexPath[]
150-
Get the visiable indexpaths at this time.
203+
### visibleIndexPaths():IndexPath[]
204+
Get the visible indexpaths at this time.
151205
### renderedIndexPaths():IndexPath[]
152206
Get the rendered indexpaths at this time.
153207
### freeCount(): number
@@ -191,3 +245,20 @@ Get LargeList's header height
191245
### footerHeight:number
192246
Get LargeList's footer height
193247

248+
### Goals and plans
249+
* Fix bug
250+
* Left and right swipe out to edit cell.
251+
* Code optimization， support typescript.
252+
253+
# Update Log
254+
255+
### Version 1.1.0
256+
* Add loading more
257+
* Fix bug when reload data
258+
* Fix bug on "scrollTo" when animated == false
259+
* Change "visiableIndexPaths" to "visibleIndexPaths", "visiableIndexPaths" will not support after 2.0.0
260+
* Change the type of "numberOfSections" from number to function, number will not support after 2.0.0
261+
262+
### Version 1.0.0
263+
* release
264+

0 commit comments

Comments
 (0)