diff --git a/screens/ProjectsScreen.js b/screens/ProjectsScreen.js
index aac4349..36280db 100644
--- a/screens/ProjectsScreen.js
+++ b/screens/ProjectsScreen.js
@@ -9,20 +9,38 @@ class ProjectsScreen extends React.Component {
};
state = {
- pan: new Animated.ValueXY()
+ pan: new Animated.ValueXY(),
+ scale: new Animated.Value(0.9),
+ translateY: new Animated.Value(44)
};
componentWillMount() {
this._panResponder = PanResponder.create({
+ onPanResponderGrant: () => {
+ Animated.spring(this.state.scale, { toValue: 1 }).start();
+ Animated.spring(this.state.translateY, { toValue: 0 }).start();
+ },
onMoveShouldSetPanResponder: () => true,
onPanResponderMove: Animated.event([
null,
{ dx: this.state.pan.x, dy: this.state.pan.y }
]),
onPanResponderRelease: () => {
- Animated.spring(this.state.pan, {
- toValue: { x: 0, y: 0 }
- }).start();
+ const positionY = this.state.pan.y.__getValue();
+ // console.log(positionY);
+
+ if (positionY > 200) {
+ Animated.timing(this.state.pan, {
+ toValue: { x: this.state.pan.x, y: 1000 }
+ }).start();
+ } else {
+ Animated.spring(this.state.pan, {
+ toValue: { x: 0, y: 0 }
+ }).start();
+
+ Animated.spring(this.state.scale, { toValue: 0.9 }).start();
+ Animated.spring(this.state.translateY, { toValue: 44 }).start();
+ }
}
});
}
@@ -40,10 +58,33 @@ class ProjectsScreen extends React.Component {
{...this._panResponder.panHandlers}
>
+
+
+
@@ -61,3 +102,27 @@ const Container = styled.View`
`;
const Text = styled.Text``;
+
+const projects = [
+ {
+ title: "Price Tag",
+ image: require("../assets/background5.jpg"),
+ author: "Liu Yi",
+ text:
+ "Thanks to Design+Code, I improved my design skill and learned to do animations for my app Price Tag, a top news app in China."
+ },
+ {
+ title: "The DM App - Ananoumous Chat",
+ image: require("../assets/background6.jpg"),
+ author: "Chad Goodman",
+ text:
+ "Design+Code was the first resource I used when breaking into software. I went from knowing nothing about design or code to building a production ready app from scratch. "
+ },
+ {
+ title: "Nikhiljay",
+ image: require("../assets/background7.jpg"),
+ author: "Nikhil D'Souza",
+ text:
+ "Recently finished the React course by @Mengto, and I 10/10 would recommend. I already rewrote my personal website in @reactjs and I'm very excited with it."
+ }
+];