/**

• Sample React Native App
• https://github.com/facebook/react-native
• @flow
  */

import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
TabBarIOS,
} from 'react-native';

export default class index extends Component {

constructor(props)
{
super(props);
this.state={
selectedTab: '1',
notifCount: 0,
presses: 0,
}
}

render() {
return (
<TabBarIOS tintColor="white" barTintColor="darkslateblue" >
<TabBarIOS.Item title="首页" systemIcon="downloads"
selected={this.state.selectedTab === '1'}
onPress={()=>{
this.setState({
selectedTab: '1',
})

  }}>
      {/* <View style={[styles.commonViewStyle,{backgroundColor:'red'}]}>
                <Text>首页</Text>
      </View> */}
      {this.createView('red','内容','1')}
  </TabBarIOS.Item>

  <TabBarIOS.Item title="第二个页面" systemIcon="contacts"
      selected={this.state.selectedTab === '2'}
      onPress={()=>{
    this.setState({
    selectedTab:'2',
  })
}} >
{/* <View style={[styles.commonViewStyle,{backgroundColor:'blue'}]}>
                <Text>2</Text>
</View> */}
{this.createView('yellow','内容','2')}
  </TabBarIOS.Item>
  <TabBarIOS.Item title="第san个页面" systemIcon="contacts"
    selected={this.state.selectedTab === '3'}
    onPress={  ()=>{
      this.setState({
       selectedTab: '3',
     });

  }}>
  {/* <View style={[styles.commonViewStyle,{backgroundColor:'blue'}]}>
                  <Text>3</Text>
  </View> */}
  {this.createView('blue','内容','3')}
  </TabBarIOS.Item>
</TabBarIOS>
);

}

createView(color,pageText,num){
return(
<View style={[styles.commonViewStyle,{backgroundColor:color}]}>
<Text>{num}</Text>
</View>
);
}
}

const styles = StyleSheet.create({
tabContent:{
flex:1,
alignItems:'center'
},
tabText: {
color: 'white',
margin: 50,
},
container: {
flex: 1,
backgroundColor: '#F5FCFF',
},
commonViewStyle:{
flex:1,
justifyContent:'center',
alignItems:'center'
},
});

AppRegistry.registerComponent('RNProjectFrist', () => index);