To round out our animation chapter, we'll explore one more very powerful way to leverage animation. PanResponder is a React Native API for tracking simple gestures. We can use PanResponder to track the user dragging their finger across the screen as a way to transition from panel to panel. As usual, we'll begin by importing PanResponder at the top of our file:
import {
StyleSheet,
View,
LayoutAnimation,
Animated,
PanResponder
} from 'react-native';
PanResponder needs to track the value of state.pan as it updates. We'll do this by adding a componentWillMount lifecycle method. Here, we'll listen to changes in state.pan by utilizing the addListener method. We'll also add a componentWillUnmount method to remove the listener once the component is unmounted:
componentWillMount() {
this.dragPosition = 0;
this.panListener = this.state.pan.addListener((value) => {
this.dragPosition = value.value;
});
}
componentWillUnmount...