1import React from 'react';
2import { Platform, StyleSheet, Text, View } from 'react-native';
3import PagerView from 'react-native-pager-view';
4
5export default function PagerViewScreen() {
6  return (
7    <PagerView
8      style={styles.container}
9      initialPage={0}
10      transitionStyle={Platform.OS === 'ios' ? 'curl' : 'scroll'}
11      onPageSelected={(_) => {
12        console.log('New page!');
13      }}>
14      <View key="1" style={styles.page}>
15        <Text style={styles.text}>First page</Text>
16        <Text style={styles.description}>Swipe this to scroll to the next page</Text>
17      </View>
18      <View key="2" style={styles.page}>
19        <Text style={styles.text}>Second page</Text>
20        <Text style={styles.description}>Swipe this to scroll back</Text>
21      </View>
22    </PagerView>
23  );
24}
25
26PagerViewScreen.navigationOptions = {
27  title: 'PagerView Example',
28  gesturesEnabled: false,
29};
30
31const styles = StyleSheet.create({
32  container: {
33    flex: 1,
34  },
35  page: {
36    flex: 1,
37    backgroundColor: '#fff',
38    alignItems: 'center',
39    justifyContent: 'center',
40  },
41  text: {
42    fontSize: 20,
43    fontWeight: 'bold',
44  },
45  description: {
46    fontSize: 16,
47    color: '#888',
48  },
49});
50