React-Native 控件ViewPagerAndroid

/**

• Sample React Native App
• https://github.com/facebook/react-native
• @flow
• 感谢东方耀老师：http://bbs.reactnative.cn/user/%E4%B8%9C%E6%96%B9%E8%80%80
  */

import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
PixelRatio,
Text,
Image,
ViewPagerAndroid,
TouchableHighlight,
DrawerLayoutAndroid,
ProgressBarAndroid,
View

} from 'react-native';

class MyFirstProject extends Component {

show(txt) {
alert(txt);
}
render() {

return (

  <ViewPagerAndroid
    initialPage={0}
    style = {styles.flex}
    >
    <View style ={styles.flex}>

      <Image style={styles.img}
        source={{ uri: 'http://facebook.github.io/react/img/logo_og.png' }}
        />
      <TouchableHighlight
        onPress={this.show.bind(this, '第一个页面') }
        underlayColor='#333'>
        <Text style={styles.touchtext}>haha</Text>
      </TouchableHighlight>
    </View>
    <View style={styles.center}>
      <TouchableHighlight
        onPress={this.show.bind(this, '第二个页面') }
        underlayColor='#333'>
        <Text  style={[{ fontSize: 39 }]}>第二个页面</Text>
      </TouchableHighlight>
    </View>
    <View style={styles.center}>
      <Text  style={[{ fontSize: 39 }]}>第三个页面</Text>
    </View>
  </ViewPagerAndroid >

);

}
}

const styles = StyleSheet.create({

flex: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
},
img: {
height: 300,
width: 300,
borderRadius: 150,
borderColor: '#ccc',
},
touchtext: {
fontSize: 39,
width: 300,

},

center: {
alignItems: 'center',
justifyContent: 'center',
}

});

AppRegistry.registerComponent('MyFirstProject', () => MyFirstProject);