main.js 2.55 KB
import React, { Component } from "react";
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  TabBarIOS,
  NavigatorIOS,
  Dimensions
} from "react-native";

import Home from "./Home/index";
import InsuranceCircle from "./InsuranceCircle/index";
import InsuranceChurch from "./InsuranceChurch/index";
import Mine from "./Mine/index";


var scale = Dimensions.get('window').scale;

export default class Main extends Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedItem: "home"
    }
  }
  
  render() {
    return (
      <TabBarIOS tintColor="#08CC6A" barTintColor="white">
        <TabBarIOS.Item
          title="首页"
          selected={this.state.selectedItem == "home"}
          onPress={() => {
            this.setState({
              selectedItem: "home"
            });
          }}
        >
          <NavigatorIOS
            style={{ flex: 1 }}
            initialRoute={{
              component: Home,
              title: "保护神"
            }}
          />
        </TabBarIOS.Item>
        <TabBarIOS.Item
          title="保圈"
          selected={this.state.selectedItem == "insuranceCircle"}
          onPress={() => {
            this.setState({
              selectedItem: "insuranceCircle"
            });
          }}
        >
          <NavigatorIOS
            style={{ flex: 1 }}
            initialRoute={{
              component: InsuranceCircle,
              title: "保护神",
            }}
          />
        </TabBarIOS.Item>
        <TabBarIOS.Item
          title="保堂"
          selected={this.state.selectedItem == "insuranceChurch"}
          onPress={() => {
            this.setState({
              selectedItem: "insuranceChurch"
            });
          }}
        >
          <NavigatorIOS
            style={{ flex: 1 }}
            initialRoute={{
              component: InsuranceChurch,
              title: "保护神"
            }}
          />
        </TabBarIOS.Item>
        <TabBarIOS.Item
          title="我的"
          selected={this.state.selectedItem == "mine"}
          onPress={() => {
            this.setState({
              selectedItem: "mine"
            });
          }}
        >
          <NavigatorIOS
            style={{ flex: 1 }}
            initialRoute={{
              component: Mine,
              title: "保护神"
            }}
          />
        </TabBarIOS.Item>
      </TabBarIOS>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    backgroundColor: "#F5FCFF"
  }
});