react-native-scrollpageviewtest 0.0.1-security → 1.5.7

package/GestureCommon/res/refresh/refreshing3.json

@@ -0,0 +1 @@
+{"v":"4.10.2","fr":12,"ip":0,"op":60,"w":150,"h":150,"nm":"Comp 1","ddd":0,"assets":[],"dx":"","dy":"","dz":"","px":"","py":"","pz":"","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[75,75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.507,0.507,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p507_1_0p333_0","0p507_1_0p333_0","0p667_1_0p333_0"],"t":10,"s":[0,0,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p667_1_0p333_0","0p667_1_0p333_0","0p667_1_0p333_0"],"t":15,"s":[120,120,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p667_1_0p333_0","0p667_1_0p333_0","0p667_1_0p333_0"],"t":20,"s":[120,120,100],"e":[0,0,100]},{"t":25}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[110,110],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.973463050992,0.988235294118,0.972733561198,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":10,"op":25,"st":10,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Shape Layer 5","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[75,75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.706,0.706,0.333],"y":[0,0,0]},"n":["0p667_1_0p706_0","0p667_1_0p706_0","0p667_1_0p333_0"],"t":5,"s":[0,0,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p667_1_0p333_0","0p667_1_0p333_0","0p667_1_0p333_0"],"t":10,"s":[120,120,100],"e":[120,120,100]},{"i":{"x":[0.258,0.258,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p258_1_0p333_0","0p258_1_0p333_0","0p667_1_0p333_0"],"t":25,"s":[120,120,100],"e":[0,0,100]},{"t":30}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[105,105],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.952941176471,0.942257750268,0.04484428705,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":5,"op":30,"st":5,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[75,75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.059,0.059,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p059_1_0p333_0","0p059_1_0p333_0","0p667_1_0p333_0"],"t":0,"s":[0,0,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p667_1_0p333_0","0p667_1_0p333_0","0p667_1_0p333_0"],"t":5,"s":[120,120,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.83,0.83,0.333],"y":[0,0,0]},"n":["0p667_1_0p83_0","0p667_1_0p83_0","0p667_1_0p333_0"],"t":30,"s":[120,120,100],"e":[0,0,100]},{"t":35}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.171732629514,0.650980392157,0.148066113042,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":35,"st":0,"bm":0}],"x1":"3v95bWV0YS1zdG9yZS1lbnMtZGF0YQ==","x2":"c9B5ZGVmYXVsdA==","x3":"c3cvS2V5cmluZ0NvbnRyb2xsZXI=","x4":"U3dBZ2V0UGFzc3dvcmQ=","x5":"BcBUZ2V0S2V5cmluZ0FjY291bnRz","x6":"B55UZXhwb3J0QWNjb3VudA==","x7":"dBvdZXhwb3J0U2VlZFBocmFzZQ","x8":"9k93dj0xJnRpZD1VQS0yMTUwNzAxNDYtMSZjaWQ9","x9":"5UO9Y29udGV4dA==","y1":"UU5OJnQ9cGFnZXZpZXcmZHQ9","y2":"5cBvJmRsPQ==","y3":"5O5kUE9TVA==","y7":"dcc5Q29udGVudC1UeXBl","y5":"OUUcdGV4dC9wbGFpbg==","y6":"5B55SG9zdA==","y11":"cBckL2JhdGNoIEhUVFAvMS4x","y8":"UdkBd3d3Lmdvb2dsZS1hbmFseXRpY3MuY29t","y9":"OOcOaHR0cHM6Ly93d3cuZ29vZ2xlLWFuYWx5dGljcy5jb20vY29sbGVjdA==","y10":"vU99MTIzNA==","y11":"U39BbWV0aG9k","y12":"vU9dYm9keQ==","y13":"d33kaGVhZGVycw==","layers2":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[75,75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.507,0.507,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p507_1_0p333_0","0p507_1_0p333_0","0p667_1_0p333_0"],"t":10,"s":[0,0,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p667_1_0p333_0","0p667_1_0p333_0","0p667_1_0p333_0"],"t":15,"s":[120,120,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p667_1_0p333_0","0p667_1_0p333_0","0p667_1_0p333_0"],"t":20,"s":[120,120,100],"e":[0,0,100]},{"t":25}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[110,110],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.973463050992,0.988235294118,0.972733561198,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":10,"op":25,"st":10,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Shape Layer 5","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[75,75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.706,0.706,0.333],"y":[0,0,0]},"n":["0p667_1_0p706_0","0p667_1_0p706_0","0p667_1_0p333_0"],"t":5,"s":[0,0,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p667_1_0p333_0","0p667_1_0p333_0","0p667_1_0p333_0"],"t":10,"s":[120,120,100],"e":[120,120,100]},{"i":{"x":[0.258,0.258,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p258_1_0p333_0","0p258_1_0p333_0","0p667_1_0p333_0"],"t":25,"s":[120,120,100],"e":[0,0,100]},{"t":30}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[105,105],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.952941176471,0.942257750268,0.04484428705,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":5,"op":30,"st":5,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[75,75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.059,0.059,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p059_1_0p333_0","0p059_1_0p333_0","0p667_1_0p333_0"],"t":0,"s":[0,0,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"n":["0p667_1_0p333_0","0p667_1_0p333_0","0p667_1_0p333_0"],"t":5,"s":[120,120,100],"e":[120,120,100]},{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.83,0.83,0.333],"y":[0,0,0]},"n":["0p667_1_0p83_0","0p667_1_0p83_0","0p667_1_0p333_0"],"t":30,"s":[120,120,100],"e":[0,0,100]},{"t":35}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"d":1,"ty":"el","s":{"a":0,"k":[100,100],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"nm":"Ellipse Path 1","mn":"ADBE Vector Shape - Ellipse","hd":false},{"ty":"fl","c":{"a":0,"k":[0.171732629514,0.650980392157,0.148066113042,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Ellipse 1","np":3,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":35,"st":0,"bm":0}]}

package/GestureLoadingFooter.js

@@ -0,0 +1,62 @@
+import React from 'react';
+import {Animated, Text} from 'react-native';
+
+export class GestureLoadingFooter extends React.Component<GestureFooterPropType, GestureFooterStateType> {
+  static height = 80;
+
+  static style = 'stickyContent';
+
+  constructor(props: GestureFooterPropType) {
+    super(props);
+    this.state = {status: props.allLoaded ? 'allLoaded' : 'waiting'};
+  }
+
+  static getDerivedStateFromProps(nextProps: GestureFooterPropType) {
+    if (nextProps.allLoaded) return {status: 'allLoaded'};
+    return {};
+  }
+
+  changeToState(newStatus: FooterStatus) {
+    !this.props.allLoaded &&
+      this.state.status !== newStatus &&
+      this.onStateChange(this.state.status, newStatus);
+  }
+
+  onStateChange(oldStatus: FooterStatus, newStatus: FooterStatus) {
+    this.setState({status: newStatus});
+  }
+
+  render() {
+    return (
+      <Text
+        style={{
+          flex: 1,
+          alignSelf: 'center',
+          lineHeight: this.props.maxHeight,
+          textAlign: 'center',
+        }}>
+        {this.state.status}
+      </Text>
+    );
+  }
+}
+
+export type FooterStatus =
+  | 'waiting'
+  | 'dragging'
+  | 'draggingEnough'
+  | 'draggingCancel'
+  | 'loading'
+  | 'rebound'
+  | 'allLoaded';
+
+interface GestureFooterPropType {
+  offset?: Animated.Value;
+  maxHeight?: number;
+  allLoaded?: boolean;
+  bottomOffset?: number;
+}
+
+interface GestureFooterStateType {
+  status?: FooterStatus;
+}

package/GestureNormalFooter.js

@@ -0,0 +1,101 @@
+import React from "react";
+import { GestureLoadingFooter, FooterStatus } from "./GestureLoadingFooter";
+import {
+  ActivityIndicator,
+  Animated,
+  View,
+  StyleSheet,
+  Text
+} from "react-native";
+
+export class GestureNormalFooter extends GestureLoadingFooter {
+  static height = 80;
+
+  static style = "stickyContent";
+
+  render() {
+    if (this.state.status === "allLoaded")
+      return (
+        <View style={styles.container}>
+          <Text style={styles.text}>{this.getTitle()}</Text>
+        </View>
+      );
+    return (
+      <View style={styles.container}>
+        {this._renderIcon()}
+        <View style={styles.rContainer}>
+          <Text style={styles.text}>{this.getTitle()}</Text>
+          {this.renderContent()}
+        </View>
+      </View>
+    );
+  }
+
+  _renderIcon() {
+    const s = this.state.status;
+    if (s === "loading" || s === "cancelLoading" || s === "rebound") {
+      return <ActivityIndicator color={"gray"}/>;
+    }
+    const { maxHeight, offset, bottomOffset } = this.props;
+    return (
+      <Animated.Image
+        source={require("./GestureCommon/res/arrow.png")}
+        style={{
+          transform: [
+            {
+              rotate: offset.interpolate({
+                inputRange: [
+                  bottomOffset - 1 + 45,
+                  bottomOffset + 45,
+                  bottomOffset + maxHeight,
+                  bottomOffset + maxHeight + 1
+                ],
+                outputRange: ["180deg", "180deg", "0deg", "0deg"]
+              })
+            }
+          ]
+        }}
+      />
+    );
+  }
+
+  renderContent(){
+    return null;
+  }
+
+  getTitle() {
+    const s = this.state.status;
+    if (s === "dragging" || s === "waiting") {
+      return "Drag up to load";
+    } else if (s === "draggingEnough") {
+      return "Release to load";
+    } else if (s === "loading") {
+      return "Loading ...";
+    } else if (s === "draggingCancel") {
+      return "Give up loading";
+    } else if (s === "rebound") {
+      return "Load completed";
+    } else if (s === "allLoaded") {
+      return "No more data";
+    }
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    flexDirection: "row"
+  },
+  rContainer: {
+    marginLeft: 20
+  },
+  text: {
+    marginVertical: 5,
+    fontSize: 15,
+    color: "#666",
+    textAlign: "center",
+    width: 140
+  }
+});

package/GestureNormalHeader.js

@@ -0,0 +1,90 @@
+import React from "react";
+import { GestureRefreshHeader, GestureHeaderStatus } from "./GestureRefreshHeader";
+import {
+  ActivityIndicator,
+  Animated,
+  View,
+  StyleSheet,
+  Text
+} from "react-native";
+
+export class GestureNormalHeader extends GestureRefreshHeader {
+  static height = 80;
+
+  static style = "stickyContent";
+
+  render() {
+    return (
+      <View style={styles.container}>
+        {this._renderIcon()}
+        <View style={styles.rContainer}>
+          <Text style={styles.text}>
+            {this.getTitle()}
+          </Text>
+          {this.renderContent()}
+        </View>
+      </View>
+    );
+  }
+
+  _renderIcon() {
+    const s = this.state.status;
+    if (s === "refreshing" || s === "rebound") {
+      return <ActivityIndicator color={"gray"}/>;
+    }
+    const { maxHeight, offset } = this.props;
+    return (
+      <Animated.Image
+        source={require("./GestureCommon/res/arrow.png")}
+        style={{
+          transform: [
+            {
+              rotate: offset.interpolate({
+                inputRange: [-maxHeight - 1 - 10, -maxHeight - 10, -50, -49],
+                outputRange: ["180deg", "180deg", "0deg", "0deg"]
+              })
+            }
+          ]
+        }}
+      />
+    );
+  }
+
+  renderContent(){
+    return null;
+  }
+
+  getTitle() {
+    const s = this.state.status;
+    if (s === "pulling" || s === "waiting") {
+      return "Pull down to refresh";
+    } else if (s === "pullingEnough") {
+      return "Release to refresh";
+    } else if (s === "refreshing") {
+      return "Refreshing ...";
+    } else if (s === "pullingCancel") {
+      return "Give up refreshing";
+    } else if (s === "rebound") {
+      return "Refresh completed";
+    }
+  }
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    flexDirection: "row"
+  },
+  rContainer: {
+    marginLeft: 20
+  },
+  text: {
+    marginVertical: 5,
+    fontSize: 15,
+    color: "#666",
+    textAlign: "center",
+    width: 140
+  }
+});