Upgrade React Native version

.flowconfig

@@ -48,11 +48,11 @@ suppress_type=$FlowIssue
 suppress_type=$FlowFixMe
 suppress_type=$FixMe
 
-suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(30\\|[1-2][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
-suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(30\\|1[0-9]\\|[1-2][0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(3[0-2]\\|[1-2][0-9]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(3[0-2]\\|1[0-9]\\|[1-2][0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
 suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
 
 unsafe.enable_getters_and_setters=true
 
 [version]
-^0.30.0
+^0.32.0

android/app/src/main/java/com/lagouapp/MainApplication.java

@@ -3,6 +3,7 @@
 import android.app.Application;
 
 import com.facebook.react.ReactApplication;
+import com.kenny.instabug.InstabugPackage;
 import com.facebook.react.ReactInstanceManager;
 import com.facebook.react.ReactNativeHost;
 import com.facebook.react.ReactPackage;
@@ -34,7 +35,8 @@ protected boolean getUseDeveloperSupport() {
     protected List<ReactPackage> getPackages() {
       return Arrays.<ReactPackage>asList(
           new FabricPackage(),
-          new MainReactPackage()
+          new MainReactPackage(),
+          new InstabugPackage("dd90b37e48964a4c7324ecb686faf06b", MainApplication.this)
       );
     }
   };

android/settings.gradle

@@ -1,5 +1,7 @@
 rootProject.name = 'LagouApp'
 
 include ':app'
+include ':react-native-instabug'
+project(':react-native-instabug').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-instabug/android')
 include ':react-native-fabric'
 project(':react-native-fabric').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fabric/android')

package.json

@@ -7,9 +7,9 @@
   },
   "dependencies": {
     "react": "15.3.1",
-    "react-native": "0.32.0",
+    "react-native": "0.35.0",
     "react-native-fabric": "^0.3.0",
-    "react-native-router-flux": "^3.35.0",
-    "react-native-swiper": "^1.4.11"
+    "react-native-instabug": "0.0.4",
+    "react-native-router-flux": "^3.35.0"
   }
 }

src/pages/home/header.js

@@ -1,61 +1,29 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
 import {
-	Text,
-	View,
-	Image,
-	StyleSheet
+  Text,
+  View,
+  Image,
+  StyleSheet
 } from 'react-native';
-import Swiper from 'react-native-swiper';
 
 export default class HomeHeader extends Component {
-	render() {
-		return (
-		<View>
-
-
-			<Swiper style={styles.wrapper} height={240}
-			        onMomentumScrollEnd={function(e, state, context){console.log('index:', state.index)}}
-			        dot={<View style={{backgroundColor:'rgba(0,0,0,.2)', width: 5, height: 5,borderRadius: 4, marginLeft: 3, marginRight: 3, marginTop: 3, marginBottom: 3,}} />}
-			        activeDot={<View style={{backgroundColor: '#000', width: 8, height: 8, borderRadius: 4, marginLeft: 3, marginRight: 3, marginTop: 3, marginBottom: 3,}} />}
-			        paginationStyle={{
-				        bottom: -23, left: null, right: 10,
-			        }} loop={true}>
-				<View style={styles.slide} title={<Text numberOfLines={1}>Aussie tourist dies at Bali hotel</Text>}>
-					<Image style={styles.image} source={{uri: 'http://c.hiphotos.baidu.com/image/w%3D310/sign=0dff10a81c30e924cfa49a307c096e66/7acb0a46f21fbe096194ceb468600c338644ad43.jpg'}} />
-				</View>
-				<View style={styles.slide} title={<Text numberOfLines={1}>Big lie behind Nine’s new show</Text>}>
-					<Image style={styles.image} source={{uri: 'http://a.hiphotos.baidu.com/image/w%3D310/sign=4459912736a85edffa8cf822795509d8/bba1cd11728b4710417a05bbc1cec3fdfc032374.jpg'}} />
-				</View>
-				<View style={styles.slide} title={<Text numberOfLines={1}>Why Stone split from Garfield</Text>}>
-					<Image style={styles.image} source={{uri: 'http://e.hiphotos.baidu.com/image/w%3D310/sign=9a8b4d497ed98d1076d40a30113eb807/0823dd54564e9258655f5d5b9e82d158ccbf4e18.jpg'}} />
-				</View>
-				<View style={styles.slide} title={<Text numberOfLines={1}>Learn from Kim K to land that job</Text>}>
-					<Image style={styles.image} source={{uri: 'http://e.hiphotos.baidu.com/image/w%3D310/sign=2da0245f79ec54e741ec1c1f89399bfd/9d82d158ccbf6c818c958589be3eb13533fa4034.jpg'}} />
-				</View>
-			</Swiper></View>
-		)
-	}
+  render() {
+    return (
+      <Text style={styles.text}>This is PageOne!</Text>
+    )
+  }
 }
 
-const styles = StyleSheet.create({
-	wrapper: {
-	},
-
-	slide: {
-		flex: 1,
-		justifyContent: 'center',
-		backgroundColor: 'transparent'
-	},
-
-	text: {
-		color: '#fff',
-		fontSize: 30,
-		fontWeight: 'bold'
-	},
-
-	image: {
-		flex: 1,
-	}
-})
+const styles = {
+  text: {
+    color: '#fff',
+    fontSize: 30,
+    fontWeight: 'bold'
+  },
+
+  image: {
+    flex: 1,
+  }
+};
 
 

src/pages/message/index.js

@@ -10,7 +10,7 @@ import {Actions} from 'react-native-router-flux';
 export default class MessageIndex extends Component {
 	render() {
 		return (
-			<ScrollView style={{flex:1}}>
+			<ScrollView style={{flex:1, marginTop:40}}>
 				<View style={styles.container}>
 					<Text style={styles.welcome}>
 						Welcome to Page2 {this.props.title}

src/pages/rightButton.js

@@ -0,0 +1,8 @@
+export function rightButton() {
+	return (
+		<View style={{flexDirection: 'row'}}>
+			<Text style={{marginRight: 10}}>收藏</Text>
+			<Text>分享</Text>
+		</View>
+	);
+}

src/pages/rootRouter.js

@@ -0,0 +1,94 @@
+import React, {Component} from 'react';
+import {
+	Text,
+	View
+} from 'react-native';
+import {ActionConst, Router, Scene, Modal, Reducer} from 'react-native-router-flux';
+
+// components
+import navBarIcon from '../components/navTabIcon';
+
+// pages
+import HomeIndex from './home/index';
+import MessageIndex from './message/index';
+import MessageDetail from './message/detail';
+import Page3 from './page3';
+import MyIndex from './my/index';
+import {rightButton} from './rightButton'
+
+const reducerCreate = params => {
+	//https://github.com/aksonov/react-native-router-flux/blob/master/Example/Example.js#L43
+	const defaultReducer = Reducer(params);
+	let logData = {
+		key: null,
+		timeStamp: null
+	};
+	return (state, action) => {
+		if (__DEV__) {
+			console.debug('ACTION:', action);
+		}
+		switch (action.type) {
+			case ActionConst.FOCUS:
+				logData = {
+					key: action.scene.name,
+					timeStamp: +new Date()
+				};
+				break;
+			case ActionConst.BACK_ACTION:
+			case ActionConst.PUSH:
+				//viewStayLogger(logData, action.key);
+				logData = {
+					key: action.key,
+					timeStamp: +new Date()
+				};
+				if (__DEV__) {
+					console.debug('logData', logData);
+				}
+				break;
+			default:
+				break;
+		}
+		return defaultReducer(state, action);
+	};
+};
+
+
+export default class RootRouter extends Component {
+	constructor(props) {
+		super(props);
+		this.state = {};
+	}
+
+	render() {
+		let rightButtonInner = () => {
+			return (
+				<View style={{flexDirection: 'row'}}>
+					<Text style={{marginRight: 10}}>收藏</Text>
+					<Text>分享</Text>
+				</View>
+			);
+		}
+
+		//code getSceneStyle https://github.com/aksonov/react-native-router-flux/blob/master/Example/Example.js#L52
+		//api getSceneStyle https://github.com/aksonov/react-native-router-flux/blob/master/docs/API_CONFIGURATION.md#router
+		//api getSceneStyle https://github.com/aksonov/react-native-router-flux/blob/master/docs/API_CONFIGURATION.md#scene-styles
+		return (
+			<Router createReducer={reducerCreate} key='modal'>
+				<Scene key='root' hideNavBar={false}>
+					<Scene key='tabbar' tabs={true}>
+						<Scene key='tab1' component={HomeIndex} title='首页' icon={navBarIcon} idx={0} initial={true}/>
+						<Scene key='tab2' component={MessageIndex} title='消息' icon={navBarIcon} idx={1}
+						       navigationBarStyle={{}} titleStyle={{color: 'white'}}/>
+						<Scene key='tab3' component={Page3} title='发现' icon={navBarIcon} idx={2}
+						       titleStyle={{color: 'blue'}} renderRightButton={ rightButtonInner }/>
+						<Scene key='tab4' component={MyIndex} title='我的' icon={navBarIcon} idx={3}
+						       onLeft={() => alert("Left button!")} leftTitle="Left"
+						       onRight={() => alert("Right button")}
+						       rightTitle="Right"/>
+					</Scene>
+				</Scene>
+				<Scene key='messageDetail' component={MessageDetail} title='消息详情' hideNavBar={false}/>
+			</Router>
+		);
+	}
+}

src/pages/splash.js

@@ -4,7 +4,7 @@ import {
 	Image
 } from 'react-native';
 
-import Router from './router';
+import RootRouter from './rootRouter';
 
 export default class Splash extends Component {
 	constructor(props) {
@@ -15,15 +15,15 @@ export default class Splash extends Component {
 	componentDidMount() {
 		this.timer = setTimeout(() => {
 			this._navigateToFrame()
-		}, 2000);
+		}, 20);
 	}
 
 	_navigateToFrame() {
 		let {navigator} = this.props;
 		if (navigator) {
 			navigator.replace({
-				name: 'router',
-				component: Router
+				name: 'rootRouter',
+				component: RootRouter
 			})
 		}
 	}