├── .watchmanconfig ├── .gitattributes ├── .babelrc ├── reduxNavigation ├── Constants │ ├── index.js │ └── actionType.js ├── Actions │ ├── Chat │ │ └── index.js │ ├── People │ │ └── index.js │ ├── Setting │ │ └── index.js │ ├── Home │ │ └── index.js │ └── Counter │ │ └── index.js ├── Reducers │ ├── Chat │ │ └── index.js │ ├── People │ │ └── index.js │ ├── Setting │ │ └── index.js │ ├── index.js │ ├── Home │ │ ├── index.js │ │ ├── home2.js │ │ ├── home.js │ │ └── counter.js │ └── Navigator │ │ └── index.js ├── Store │ └── index.js ├── Components │ ├── Chat │ │ └── Chat.js │ ├── People │ │ └── People.js │ ├── Setting │ │ └── Setting.js │ └── Home │ │ ├── Home.js │ │ └── Counter.js ├── index.js └── Configs │ ├── StackNavigator.js │ └── TabNavigator.js ├── app.json ├── android ├── app │ ├── src │ │ └── main │ │ │ ├── res │ │ │ ├── values │ │ │ │ ├── strings.xml │ │ │ │ └── styles.xml │ │ │ ├── mipmap-hdpi │ │ │ │ └── ic_launcher.png │ │ │ ├── mipmap-mdpi │ │ │ │ └── ic_launcher.png │ │ │ ├── mipmap-xhdpi │ │ │ │ └── ic_launcher.png │ │ │ └── mipmap-xxhdpi │ │ │ │ └── ic_launcher.png │ │ │ ├── assets │ │ │ └── fonts │ │ │ │ ├── Entypo.ttf │ │ │ │ ├── Feather.ttf │ │ │ │ ├── Zocial.ttf │ │ │ │ ├── EvilIcons.ttf │ │ │ │ ├── Foundation.ttf │ │ │ │ ├── Ionicons.ttf │ │ │ │ ├── Octicons.ttf │ │ │ │ ├── FontAwesome.ttf │ │ │ │ ├── MaterialIcons.ttf │ │ │ │ ├── SimpleLineIcons.ttf │ │ │ │ └── MaterialCommunityIcons.ttf │ │ │ ├── java │ │ │ └── com │ │ │ │ └── reactnavigationdemo │ │ │ │ ├── MainActivity.java │ │ │ │ └── MainApplication.java │ │ │ └── AndroidManifest.xml │ ├── BUCK │ ├── proguard-rules.pro │ └── build.gradle ├── gradle │ └── wrapper │ │ ├── gradle-wrapper.jar │ │ └── gradle-wrapper.properties ├── keystores │ ├── debug.keystore.properties │ └── BUCK ├── settings.gradle ├── build.gradle ├── gradle.properties ├── gradlew.bat └── gradlew ├── index.js ├── .buckconfig ├── __tests__ └── App.js ├── plainNavigation ├── Components │ ├── Home │ │ ├── Home2.js │ │ ├── HookTabBar.js │ │ ├── Badge.js │ │ ├── Back1.js │ │ ├── Back2.js │ │ ├── Home3.js │ │ ├── Home7.js │ │ ├── Home6.js │ │ ├── Home4.js │ │ ├── Back3.js │ │ ├── Home5.js │ │ └── Home.js │ ├── People │ │ └── People.js │ ├── Chat │ │ └── Chat.js │ └── Setting │ │ ├── Setting2.js │ │ ├── Setting3.js │ │ └── Setting.js ├── TabNavigator │ └── index.js └── StackNavigator │ └── index.js ├── src ├── SampleText.js ├── TabsInDrawer.js ├── Drawer.js ├── SimpleStack.js ├── ModalStack.js ├── StacksOverTabs.js ├── SimpleTabs.js ├── CustomTabs.js ├── StacksInTabs.js ├── CustomTransitioner.js └── App.js ├── ios ├── reactNavigationDemo │ ├── AppDelegate.h │ ├── main.m │ ├── Images.xcassets │ │ └── AppIcon.appiconset │ │ │ └── Contents.json │ ├── AppDelegate.m │ ├── Info.plist │ └── Base.lproj │ │ └── LaunchScreen.xib ├── reactNavigationDemoTests │ ├── Info.plist │ └── reactNavigationDemoTests.m ├── reactNavigationDemo-tvOSTests │ └── Info.plist ├── reactNavigationDemo-tvOS │ └── Info.plist └── reactNavigationDemo.xcodeproj │ └── xcshareddata │ └── xcschemes │ ├── reactNavigationDemo.xcscheme │ └── reactNavigationDemo-tvOS.xcscheme ├── package.json ├── .gitignore ├── LICENSE ├── App.js ├── .flowconfig └── README.md /.watchmanconfig: -------------------------------------------------------------------------------- 1 | {} -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | *.pbxproj -text 2 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-native"] 3 | } 4 | -------------------------------------------------------------------------------- /reduxNavigation/Constants/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "reactNavigationDemo", 3 | "displayName": "reactNavigationDemo" 4 | } -------------------------------------------------------------------------------- /reduxNavigation/Actions/Chat/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | -------------------------------------------------------------------------------- /reduxNavigation/Actions/People/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | -------------------------------------------------------------------------------- /reduxNavigation/Reducers/Chat/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | -------------------------------------------------------------------------------- /reduxNavigation/Actions/Setting/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | -------------------------------------------------------------------------------- /reduxNavigation/Reducers/People/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | -------------------------------------------------------------------------------- /reduxNavigation/Reducers/Setting/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | -------------------------------------------------------------------------------- /android/app/src/main/res/values/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | reactNavigationDemo 3 | 4 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | import { AppRegistry } from 'react-native' 2 | import App from './App' 3 | AppRegistry.registerComponent('reactNavigationDemo', () => App) -------------------------------------------------------------------------------- /.buckconfig: -------------------------------------------------------------------------------- 1 | 2 | [android] 3 | target = Google Inc.:Google APIs:23 4 | 5 | [maven_repositories] 6 | central = https://repo1.maven.org/maven2 7 | -------------------------------------------------------------------------------- /android/gradle/wrapper/gradle-wrapper.jar: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/gradle/wrapper/gradle-wrapper.jar -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Entypo.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/Entypo.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Feather.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/Feather.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Zocial.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/Zocial.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/EvilIcons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/EvilIcons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Foundation.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/Foundation.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Ionicons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/Ionicons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Octicons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/Octicons.ttf -------------------------------------------------------------------------------- /android/keystores/debug.keystore.properties: -------------------------------------------------------------------------------- 1 | key.store=debug.keystore 2 | key.alias=androiddebugkey 3 | key.store.password=android 4 | key.alias.password=android 5 | -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/FontAwesome.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/FontAwesome.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/MaterialIcons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/MaterialIcons.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/SimpleLineIcons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/SimpleLineIcons.ttf -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-hdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/res/mipmap-hdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-mdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/res/mipmap-mdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/guangqiang-liu/react-navigation-demo/HEAD/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf -------------------------------------------------------------------------------- /android/keystores/BUCK: -------------------------------------------------------------------------------- 1 | keystore( 2 | name = "debug", 3 | properties = "debug.keystore.properties", 4 | store = "debug.keystore", 5 | visibility = [ 6 | "PUBLIC", 7 | ], 8 | ) 9 | -------------------------------------------------------------------------------- /android/app/src/main/res/values/styles.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /android/gradle/wrapper/gradle-wrapper.properties: -------------------------------------------------------------------------------- 1 | distributionBase=GRADLE_USER_HOME 2 | distributionPath=wrapper/dists 3 | zipStoreBase=GRADLE_USER_HOME 4 | zipStorePath=wrapper/dists 5 | distributionUrl=https\://services.gradle.org/distributions/gradle-2.14.1-all.zip 6 | -------------------------------------------------------------------------------- /android/settings.gradle: -------------------------------------------------------------------------------- 1 | rootProject.name = 'reactNavigationDemo' 2 | include ':react-native-vector-icons' 3 | project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android') 4 | 5 | include ':app' 6 | -------------------------------------------------------------------------------- /reduxNavigation/Constants/actionType.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | 5 | const actionType = { 6 | CHANGE_HOME_STATEVALUE: 'CHANGE_HOME_STATEVALUE', 7 | INCREASE: 'INCREASE', 8 | DECREASE: 'DECREASE' 9 | } 10 | 11 | export {actionType} -------------------------------------------------------------------------------- /reduxNavigation/Actions/Home/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import {actionType} from '../../Constants/actionType' 5 | const changeStateValue = val => ({ 6 | type: actionType.CHANGE_HOME_STATEVALUE, 7 | val 8 | } 9 | ) 10 | 11 | export {changeStateValue} -------------------------------------------------------------------------------- /reduxNavigation/Reducers/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import {combineReducers} from 'redux' 5 | import navigator from './Navigator' 6 | import home from './Home' 7 | 8 | const rootReducers = combineReducers({ 9 | navigator, 10 | home 11 | }) 12 | 13 | export default rootReducers -------------------------------------------------------------------------------- /__tests__/App.js: -------------------------------------------------------------------------------- 1 | import 'react-native'; 2 | import React from 'react'; 3 | import App from '../App'; 4 | 5 | // Note: test renderer must be required after react-native. 6 | import renderer from 'react-test-renderer'; 7 | 8 | it('renders correctly', () => { 9 | const tree = renderer.create( 10 | 11 | ); 12 | }); 13 | -------------------------------------------------------------------------------- /reduxNavigation/Reducers/Home/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import {combineReducers} from 'redux' 5 | import home from './home' 6 | import home2 from './home2' 7 | import counter from './counter' 8 | const reducers = combineReducers({ 9 | home, 10 | home2, 11 | counter 12 | }) 13 | 14 | export default reducers -------------------------------------------------------------------------------- /reduxNavigation/Actions/Counter/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/2. 3 | */ 4 | import {actionType} from '../../Constants/actionType' 5 | 6 | const increaseAction = value => ({ 7 | type: actionType.INCREASE, 8 | val: value 9 | }) 10 | 11 | const decreaseAction = value => ({ 12 | type: actionType.DECREASE, 13 | val: value 14 | }) 15 | 16 | export {increaseAction, decreaseAction} -------------------------------------------------------------------------------- /plainNavigation/Components/Home/Home2.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import React, {Component} from 'react' 5 | import { Text, View} from 'react-native' 6 | export default class Home2 extends Component { 7 | 8 | render() { 9 | return ( 10 | 11 | Home2 12 | 13 | ) 14 | } 15 | } -------------------------------------------------------------------------------- /reduxNavigation/Store/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import {createStore, applyMiddleware} from 'redux' 5 | import logger from 'redux-logger' 6 | import reducers from '../Reducers' 7 | 8 | const middlewares = [] 9 | 10 | if (process.env.NODE_ENV === 'development') { 11 | middlewares.push(logger) 12 | } 13 | 14 | const store = createStore(reducers, applyMiddleware(...middlewares)) 15 | 16 | export {store} -------------------------------------------------------------------------------- /plainNavigation/Components/Home/HookTabBar.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2018/5/26. 3 | */ 4 | import React, {Component} from 'react' 5 | import { Text, View} from 'react-native' 6 | export default class HookTabBar extends Component { 7 | 8 | render() { 9 | return ( 10 | 11 | Hook TabBar的点击事件，请点击Chat Tab已做参考 12 | 13 | ) 14 | } 15 | } -------------------------------------------------------------------------------- /plainNavigation/Components/People/People.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import React, {Component} from 'react' 5 | import { Text, View} from 'react-native' 6 | 7 | class People extends Component { 8 | 9 | static navigationOptions = { 10 | title: 'People', // 固定标题 11 | } 12 | render() { 13 | return ( 14 | 15 | People 16 | 17 | ) 18 | } 19 | } 20 | 21 | export default People -------------------------------------------------------------------------------- /reduxNavigation/Reducers/Navigator/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import { NavigationActions } from 'react-navigation' 5 | import Navigator from '../../Configs/StackNavigator' 6 | 7 | const initialState = Navigator.router.getStateForAction(NavigationActions.init()) 8 | 9 | export default (state = initialState, actions) => { 10 | const nextState = Navigator.router.getStateForAction(actions, state) 11 | return nextState || state 12 | } -------------------------------------------------------------------------------- /android/app/src/main/java/com/reactnavigationdemo/MainActivity.java: -------------------------------------------------------------------------------- 1 | package com.reactnavigationdemo; 2 | 3 | import com.facebook.react.ReactActivity; 4 | 5 | public class MainActivity extends ReactActivity { 6 | 7 | /** 8 | * Returns the name of the main component registered from JavaScript. 9 | * This is used to schedule rendering of the component. 10 | */ 11 | @Override 12 | protected String getMainComponentName() { 13 | return "reactNavigationDemo"; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /plainNavigation/Components/Chat/Chat.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import React, {Component} from 'react' 5 | import { 6 | StyleSheet, 7 | Text, 8 | View, 9 | Image 10 | } from 'react-native' 11 | 12 | class Chat extends Component { 13 | 14 | static navigationOptions = { 15 | title: 'Chat', // 固定标题 16 | } 17 | render() { 18 | return ( 19 | 20 | Chat 21 | 22 | ) 23 | } 24 | } 25 | 26 | export default Chat -------------------------------------------------------------------------------- /reduxNavigation/Reducers/Home/home2.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/2. 3 | */ 4 | import { actionType } from '../../Constants/actionType' 5 | 6 | const initialState = { 7 | mainText: 'Start Here' 8 | } 9 | 10 | export default (state = initialState, action) => { 11 | switch (action.type) { 12 | case actionType.SUBMIT_NEW_TEXT: 13 | return { 14 | ...state, 15 | mainText: action.text 16 | } 17 | break 18 | default: 19 | return state 20 | } 21 | } -------------------------------------------------------------------------------- /reduxNavigation/Reducers/Home/home.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/2. 3 | */ 4 | import { actionType } from '../../Constants/actionType' 5 | 6 | const initialState = { 7 | homeState: '这是reducer中初始的值' 8 | } 9 | 10 | export default (state = initialState, action) => { 11 | switch (action.type) { 12 | case actionType.CHANGE_HOME_STATEVALUE: 13 | return { 14 | ...state, 15 | homeState: action.val 16 | } 17 | break 18 | default: 19 | return state 20 | } 21 | } -------------------------------------------------------------------------------- /plainNavigation/Components/Home/Badge.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2018/5/26. 3 | */ 4 | import React, {Component} from 'react' 5 | import { Text, View} from 'react-native' 6 | import {Button} from 'react-native-elements' 7 | export default class badge extends Component { 8 | 9 | render() { 10 | return ( 11 | 12 | 实现在TabBar Item上自定义badge，我们可以参照示例中的People Tab的实现方式 13 | 14 | ) 15 | } 16 | } -------------------------------------------------------------------------------- /src/SampleText.js: -------------------------------------------------------------------------------- 1 | /* @flow */ 2 | 3 | import React from 'react'; 4 | 5 | import { StyleSheet, Text } from 'react-native'; 6 | 7 | /** 8 | * Used across examples as a screen placeholder. 9 | */ 10 | import type { ChildrenArray } from 'react'; 11 | 12 | const SampleText = ({ children }: { children?: ChildrenArray<*> }) => ( 13 | {children} 14 | ); 15 | 16 | export default SampleText; 17 | 18 | const styles = StyleSheet.create({ 19 | sampleText: { 20 | margin: 14, 21 | }, 22 | }); 23 | -------------------------------------------------------------------------------- /ios/reactNavigationDemo/AppDelegate.h: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) 2015-present, Facebook, Inc. 3 | * All rights reserved. 4 | * 5 | * This source code is licensed under the BSD-style license found in the 6 | * LICENSE file in the root directory of this source tree. An additional grant 7 | * of patent rights can be found in the PATENTS file in the same directory. 8 | */ 9 | 10 | #import 11 | 12 | @interface AppDelegate : UIResponder 13 | 14 | @property (nonatomic, strong) UIWindow *window; 15 | 16 | @end 17 | -------------------------------------------------------------------------------- /plainNavigation/Components/Setting/Setting2.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by guangqiang on 2017/12/1. 3 | */ 4 | import React, {Component} from 'react' 5 | import { Text, View} from 'react-native' 6 | import {Button} from 'react-native-elements' 7 | export default class Setting2 extends Component { 8 | 9 | render() { 10 | const {navigate} = this.props.navigation 11 | return ( 12 | 13 | Setting2 14 |