仿逛丢Laucher

1. 1. 首先这个页面大的View  flex:1 flexDirection:’column’ justifyContent 需要是最下部，flex-end对齐,alignItems 水平对齐 ,左边的逛丢是绿色，大写，粗体 中间的竖线是一个View width1 borderWidth:1 borderColor:gray  右边是先一个View 包含Text 这个View的justifyContent 和alignItem都得是flex-end

      import React,{ Component } from 'React';
      import {
          View,
          Text,
          Image,
          StyleSheet
      } from 'react-native';
      
      import { StackNavigator } from 'react-navigation';
      
      import Login from './Login';
      
      
      class LaucherA extends Component{
          static navigationOptions = {
              tabBarVisible: false, // 隐藏底部导航栏
              header:null,  //隐藏顶部导航栏
          };
      
          render(){
              return(
                  <View style={styles.container}>
                      <View style={styles.containerBottom}>
                          <Text style={styles.textLeftStyle}>
                              万众科技
                          </Text>
                          <View style={styles.spliderStyle}></View>
                          <View style={styles.rightViewStyle}>
                              <Text style={styles.textRightStyle}>
                                  万联网领导者
                              </Text>
                          </View>
      
                      </View>
      
                  </View>
              )
          }
      
          componentDidMount(){
              setTimeout( ()=> this.props.navigation.replace('WzLogin'),500);
          }
      }
      
      const RockStack = StackNavigator(
          {
              WzLaucher:LaucherA,
              WzLogin:Login,
          },
          {
              initialRouteName:'WzLaucher'
          }
      );
      
      export default class Laucher extends Component{
      
          render(){
              return(
                  <RockStack/>
              );
          }
      }
      
      const styles = StyleSheet.create({
          container:{
              flex:1,
              justifyContent:'flex-end',
              alignItems: 'center',
              backgroundColor:'#F5FCFF'
          },
          containerBottom:{
              flexDirection: 'row',
              justifyContent: 'center',
              alignItems: 'center',
              height:44,
              marginBottom: 30
          },
          spliderStyle:{
              width:1,
              height: 32,
              borderWidth:0.5,
              borderColor:'gray',
              marginLeft: 10
          },
          textLeftStyle:{
              fontSize:24,
              color:'rgba(0,250,154,0.8)',
              fontWeight: '900'
          },
          rightViewStyle:{
              marginLeft: 10,
              justifyContent:'flex-end',
              alignItems: 'flex-end',
              height:42
          },
          textRightStyle:{
              fontSize: 12,
          }
      });