Refactor project files

android/app/build.gradle

@@ -84,13 +84,13 @@ def enableSeparateBuildPerCPUArchitecture = false
 def enableProguardInReleaseBuilds = false
 
 android {
-    compileSdkVersion 23
-    buildToolsVersion "23.0.1"
+    compileSdkVersion 24
+    buildToolsVersion "23.0.3"
 
     defaultConfig {
         applicationId "com.lagouapp"
         minSdkVersion 16
-        targetSdkVersion 22
+        targetSdkVersion 23
         versionCode 1
         versionName "1.0"
         ndk {
@@ -132,8 +132,10 @@ dependencies {
          transitive = true;
     }
     compile fileTree(dir: "libs", include: ["*.jar"])
-    compile "com.android.support:appcompat-v7:23.0.1"
+    //compile "com.android.support:appcompat-v7:23.0.1"
+    compile "com.android.support:appcompat-v7:24.2.1"
     compile "com.facebook.react:react-native:+"  // From node_modules
+    compile project(path: ':react-native-instabug')
 }
 
 // Run this once to be able to run the application with BUCK

android/build.gradle

@@ -6,7 +6,7 @@ buildscript {
         maven { url 'https://maven.fabric.io/public' }
     }
     dependencies {
-        classpath 'com.android.tools.build:gradle:2.1.3'
+        classpath 'com.android.tools.build:gradle:2.2.1'
         classpath 'io.fabric.tools:gradle:1.+'
 
         // NOTE: Do not place your application dependencies here; they belong

android/gradle.properties

@@ -21,3 +21,4 @@ android.useDeprecatedNdk=true
 
 org.gradle.daemon=true
 org.gradle.parallel=true
+org.gradle.jvmargs=-Xmx1536M

package.json

@@ -9,7 +9,7 @@
     "react": "15.3.1",
     "react-native": "0.35.0",
     "react-native-fabric": "^0.3.0",
-    "react-native-instabug": "0.0.4",
-    "react-native-router-flux": "^3.35.0"
+    "react-native-instabug": "^0.2.8",
+    "react-native-router-flux": "^3.36.0"
   }
 }

src/pages/rightButton.js → src/components/common/rightButton.js

@@ -1,3 +1,6 @@
+import React, { Component } from 'react'
+import { Text, View, Platform, Dimensions } from 'react-native'
+
 export function rightButton() {
 	return (
 		<View style={{flexDirection: 'row'}}>

src/components/common/routerBase.js

@@ -0,0 +1,36 @@
+import {ActionConst, Reducer} from 'react-native-router-flux';
+
+export 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:
+        logData = {
+          key: action.key,
+          timeStamp: +new Date()
+        };
+        if (__DEV__) {
+          console.debug('logData', logData);
+        }
+        break;
+      default:
+        break;
+    }
+    return defaultReducer(state, action);
+  };
+};

src/components/styles/routerBase.js

@@ -0,0 +1,27 @@
+// 全局场景标题样式
+export const getSceneStyle = (props, computedProps) => {
+  const style = {
+    flex: 1,
+    backgroundColor: '#FFF',
+    shadowColor: null,
+    shadowOffset: null,
+    shadowOpacity: null,
+    shadowRadius: null
+  };
+  if (computedProps.isActive) {
+    style.marginTop = computedProps.hideNavBar ? 0 : 64;
+    style.marginBottom = computedProps.hideTabBar ? 0 : 50;
+  }
+  return style;
+};
+
+// 全局导航标题样式
+export const getNavigationStyle = {
+  title: {
+    color: '#333333',
+    fontSize: 17,
+    fontWeight: 'normal',
+  },
+};
+
+export const backButtonImage = require("./../../images/icon_back.png");

src/pages/rootRouter.js

@@ -1,94 +1,45 @@
 import React, {Component} from 'react';
 import {
-	Text,
-	View
+  Text,
+  View
 } from 'react-native';
 import {ActionConst, Router, Scene, Modal, Reducer} from 'react-native-router-flux';
 
 // components
 import navBarIcon from '../components/navTabIcon';
+import {getSceneStyle, getNavigationStyle, backButtonImage} from '../components/styles/routerBase';
+import {reducerCreate} from '../components/common/routerBase';
+import {rightButton} from '../components/common/rightButton'
 
 // 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>
-			);
-		}
+  constructor(props) {
+    super(props);
+  }
 
-		//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>
-		);
-	}
+  render() {
+    //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} getSceneStyle={getSceneStyle} titleStyle={getNavigationStyle.title} titleOpacity={0.95} backButtonImage={backButtonImage} key='modal'>
+        <Router 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={{}}/>
+            <Scene key='tab3' component={Page3} title='发现' icon={navBarIcon} idx={2} renderRightButton={ rightButton }/>
+            <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>
+    );
+  }
 }