修正首页的说明文档

jinzhengbe · Feb 25, 2019 · 4ab7a62 · 4ab7a62
1 parent 1bb97d6
commit 4ab7a62
Show file tree

Hide file tree

Showing 16 changed files with 70 additions and 17 deletions.
diff --git a/Examples/LargeListExamples/HeightEqualExample.js b/Examples/LargeListExamples/HeightEqualExample.js
@@ -36,7 +36,6 @@ export class HeightEqualExample extends React.Component {
     }
     return (
       <LargeList
-        style={styles.container}
         data={data}
         heightForSection={() => 50}
         renderSection={this._renderSection}

diff --git a/Examples/WaterfallListExamples/PictureExample.js b/Examples/WaterfallListExamples/PictureExample.js
@@ -23,18 +23,17 @@ export class PictureExample extends React.Component {
   render() {
     const screenWidth = Dimensions.get("window").width;
     return (
-      <SafeAreaView style={{ flex: 1 }}>
-        <WaterfallList
-          data={this.state.data}
-          heightForItem={item => screenWidth/Math.floor(screenWidth / 150) * +item.showimg_height / +item.showimg_width}
-          preferColumnWidth={150}
-          renderItem={this._renderItem}
-        />
-      </SafeAreaView>
+      <WaterfallList
+        data={this.state.data}
+        heightForItem={item => screenWidth / Math.floor(screenWidth / 150) * +item.showimg_height / +item.showimg_width}
+        numColumns={2}
+        // preferColumnWidth={150}
+        renderItem={this._renderItem}
+      />
     );
   }
 
   _renderItem = item => {
-    return <Image source={{ uri: item.showimg }} style={{ flex: 1,margin:5 }} />;
+    return <Image source={{ uri: item.showimg }} style={{ flex: 1, margin: 5 }} />;
   };
 }
diff --git a/README.md b/README.md
@@ -4,14 +4,9 @@
 
 ## Features
 
-* Large data source list component, items reused by group, Less CPU/Memory usage.
+* Large data source list component, items reused by group, Less CPU/Memory usage. Never blanks.
 * Fully Cross-platform bounces (iOS & Android).
 * Highly customize Refreshing and Loading. Fully support `react-native-lottie`. More smoothly animation.
-* Header and Footer support.
-* ScrollToIndex support.
-* Sticky Section support.
-* Support inverted.
-* Never blanks.
 
 ## Preview
 ![Preview](./docs/res/LottieRefreshing.gif)
@@ -49,6 +44,65 @@ yarn start
 
 6. Running
 
+### LargeList
+
+All the features below are supported on both iOS and Android.
+
+* Items reused. Never blank.
+
+* Sticky section support
+
+![StickySection](./docs/res/StickySection.gif)
+
+* Fully Cross-platform bounces (iOS & Android).
+
+![bounces](./docs/res/bounces.gif)
+
+* Customize refreshing (Support `lottie-react-native` progress with `useNativeDriver`)
+
+![CustomizeRefreshing](./docs/res/CustomizeRefreshing.gif)
+
+* Customize loading (Support `lottie-react-native` progress with `useNativeDriver`)
+
+![CustomizeLoading](./docs/res/CustomizeLoading.gif)
+
+* Slide on both horizontal and vertical directions.
+
+![BothDirections](./docs/res/BothDirections.gif)
+
+* Sticky header support.
+
+![StickyHeader](./docs/res/StickyHeader.gif)
+
+* directionalLockEnabled
+
+![directionalLockEnabled](./docs/res/directionalLockEnabled.gif)
+
+* Support `inverted`
+
+![inverted](./docs/res/inverted.gif)
+
+### WaterfallList
+
+* Complex situation
+
+![WaterfallExample](./docs/res/WaterfallExample.png)
+
+* preferColumnWidth
+
+![preferColumnWidth](./docs/res/preferColumnWidth.gif)
+
+* numColumns
+
+![numColumns](./docs/res/numColumns.gif)
+
+### StickyForm
+
+* example
+
+![StickyFormExample](./docs/res/StickyFormExample.gif)
+
+
 ## License
 
 react-native-largelist is released under the MIT license. See LICENSE for details.

diff --git a/docs/en/V3/Overview.md b/docs/en/V3/Overview.md
@@ -2,7 +2,7 @@
 
 LargeList V3 depends on `react-native-spring-scrollview@^2.0.3`, and supports almost all props in SpringScrollView.
 
-As the same as SpringScrollView，LargeList must have a bounded height in order to work, since they contain many cells children into a bounded container (via a scroll interaction). In order to bound the height of a LargeList, either set the height of the view directly (discouraged) or make sure all parent views have bounded height. LargeList default has a `{flex:1}` style，please be sure its parent has a bounded height.
+As the same as SpringScrollView，LargeList must have a bounded height in order to work, since they contain many cells children into a bounded container (via a scroll interaction). In order to bound the height of a LargeList, either set the height of the view directly (discouraged) or make sure all parent views have bounded height. LargeList default has a `{flex:1}` style，please be sure its parent has a bounded height. Note that in order to optimize performance, the height of each item and each section must be given.
 
 ### Basic Props
 

diff --git a/docs/res/BothDirections.gif b/docs/res/BothDirections.gif
diff --git a/docs/res/CustomizeLoading.gif b/docs/res/CustomizeLoading.gif
diff --git a/docs/res/CustomizeRefreshing.gif b/docs/res/CustomizeRefreshing.gif
diff --git a/docs/res/StickyFormExample.gif b/docs/res/StickyFormExample.gif
diff --git a/docs/res/StickyHeader.gif b/docs/res/StickyHeader.gif
diff --git a/docs/res/StickySection.gif b/docs/res/StickySection.gif
diff --git a/docs/res/bounces.gif b/docs/res/bounces.gif
diff --git a/docs/res/directionalLockEnabled.gif b/docs/res/directionalLockEnabled.gif
diff --git a/docs/res/inverted.gif b/docs/res/inverted.gif
diff --git a/docs/res/numColumns.gif b/docs/res/numColumns.gif
diff --git a/docs/res/preferColumnWidth.gif b/docs/res/preferColumnWidth.gif
diff --git a/src/Types.js b/src/Types.js
@@ -31,6 +31,7 @@ export interface LargeListPropType {
   headerStickyEnabled?: boolean;
   contentStyle?: ViewStyle,
   directionalLockEnabled?: boolean,
+  renderScaleHeaderBackground?: () => React.ReactElement<any>,
   heightForSection?: (section: number) => number,
   renderSection?: (section: number) => React.Node<any>,
   heightForIndexPath: (indexPath: IndexPath) => number,