添加启动页

EleTeam · Sep 10, 2016 · b076e0e · b076e0e
1 parent 0a16cb7
commit b076e0e
Show file tree

Hide file tree

Showing 12 changed files with 68 additions and 5 deletions.
diff --git a/app/containers/app.js → app/app.js b/app/containers/app.js → app/app.js
@@ -12,18 +12,25 @@ import React, { Component } from 'react';
 import {
     Navigator,
     View,
+    StatusBar,
+    Platform
 } from 'react-native';
 
-import StatusBarIOS from '../components/StatusBarIOS';
-import TabBarView from '../containers/TabBarView';
+import Splash from './pages/Splash';
+
+export const STATUS_BAR_HEIGHT = (Platform.OS === 'ios' ? 20 : 25)
 
 class App extends Component {
     render() {
         return (
             <View style={{flex: 1}}>
-                <StatusBarIOS barStyle="light-content"/>
+                <StatusBar
+                    barStyle='light-content'
+                    backgroundColor='transparent'
+                    style={{height: STATUS_BAR_HEIGHT}}
+                />
                 <Navigator
-                    initialRoute={{name: 'TabBarView', component: TabBarView}}
+                    initialRoute={{name: 'Splash', component: Splash}}
                     configureScene={()=>{
                         return  Navigator.SceneConfigs.PushFromRight;
                     }}

diff --git a/app/images/ic_welcome.jpg b/app/images/ic_welcome.jpg
diff --git a/app/images/tab/ic_tab_cart.png b/app/images/tab/ic_tab_cart.png
diff --git a/app/images/tab/ic_tab_cart_press.png b/app/images/tab/ic_tab_cart_press.png
diff --git a/app/images/tab/ic_tab_center.png b/app/images/tab/ic_tab_center.png
diff --git a/app/images/tab/ic_tab_center_press.png b/app/images/tab/ic_tab_center_press.png
diff --git a/app/images/tab/ic_tab_home.png b/app/images/tab/ic_tab_home.png
diff --git a/app/images/tab/ic_tab_home_press.png b/app/images/tab/ic_tab_home_press.png
diff --git a/app/images/tab/ic_tab_order.png b/app/images/tab/ic_tab_order.png
diff --git a/app/images/tab/ic_tab_order_press.png b/app/images/tab/ic_tab_order_press.png
diff --git a/app/pages/Splash.js b/app/pages/Splash.js
@@ -0,0 +1,56 @@
+/**
+ * ShopReactNative
+ *
+ * @author Tony Wong
+ * @date 2016-08-13
+ * @email 908601756@qq.com
+ * @copyright Copyright © 2016 EleTeam
+ * @license The MIT License (MIT)
+ */
+
+'use strict';
+
+import React from 'react';
+import {
+  Dimensions,
+  Image,
+  InteractionManager,
+  View
+} from 'react-native';
+
+import TabBarView from '../containers/TabBarView';
+
+var {height, width} = Dimensions.get('window');
+
+class Splash extends React.Component {
+  constructor(props) {
+    super(props);
+  }
+  componentDidMount() {
+    const {navigator} = this.props;
+     this.timer=setTimeout(() => {
+      InteractionManager.runAfterInteractions(() => {
+        navigator.resetTo({
+          component: TabBarView,
+          name: 'TabBarView'
+        });
+      });
+    }, 2500);
+  }
+  componentWillUnmount() {
+    this.timer && clearTimeout(this.timer);
+  }
+
+  render() {
+    return (
+      <View style={{flex:1}}>
+      <Image
+        style={{flex:1,width:width,height:height}}
+        source={require('../images/ic_welcome.jpg')}
+        />
+      </View>
+    );
+  }
+}
+
+export default Splash;
diff --git a/app/root.js b/app/root.js
@@ -12,7 +12,7 @@ import React, { Component } from 'react';
 import { Provider } from 'react-redux';
 import store from './store/store';
 
-import App from './containers/app';
+import App from './app';
 
 export default class Root extends Component {
     render() {