AppFramework/App.js at master · marlti7/AppFramework · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
import React from 'react';
import {
  Text,
  View,
  StatusBar,
  Platform,
  StyleSheet,
} from 'react-native';
// 导入stack导航组件
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/es/integration/react';
import { StackNavigator } from 'react-navigation';
import SplashScreen from 'react-native-splash-screen';

import CardStackStyleInterpolator from 'react-navigation/src/views/CardStack/CardStackStyleInterpolator';
import appStore from './app/store/index';
// import HomeScreen from './app/scenes/HomeScreen'
// import ChatScreen from './app/scenes/ChatScreen';
import chatScreenContainer from './app/containers/chatScreenContainer';
import MainScreenNavigator from './app/scenes/MainScreenNavigator';
// 进行导航的注册

const { persistor, store } = appStore();
const defaultNavigationOptions = {
  header: null,
  gesturesEnabled: true,
  gestureResponseDistance: {
    horizontal: 100,
    vertical: 135,
  },
};
const STATUSBAR_HEIGHT = Platform.OS === 'ios' ? 64 : 64;
const tabNavigationOptions = {
  header: (
    <View
      style={{
        backgroundColor: '#79B45D',
        height: STATUSBAR_HEIGHT,
        // borderBottomColor: '#79B45D',
        // borderBottomWidth: 0,
        // borderTopWidth: 0,
        paddingTop: Platform.OS === 'ios' ? 20 : 20,
        alignItems: 'center',
        justifyContent: 'center',
      }}
    >
      <Text>
        my chat
      </Text>
    </View>
  ),
  gesturesEnabled: true,
};
const AppContent = StackNavigator({
  Home: { screen: MainScreenNavigator, navigationOptions: tabNavigationOptions },
  Chat: { screen: chatScreenContainer, navigationOptions: defaultNavigationOptions },
}, {
  headerMode: 'screen',
  transitionConfig: () => ({ screenInterpolator: CardStackStyleInterpolator.forHorizontal }),
  cardStyle: {
    opacity: 1,
    // backgroundColor: 'transparent',
  },
  // navigationOptions: {
  //   gesturesEnabled: true,
  // },
});
const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
  statusBar: {
    justifyContent: 'center',
    // height: STATUSBAR_HEIGHT,
    // marginTop: STATUSBAR_HEIGHT,
  },
});
const MyStatusBar = ({ backgroundColor, ...props }) => (
  <View style={[styles.statusBar, { backgroundColor }]}>
    <StatusBar
      translucent
      hidden={false}
      networkActivityIndicatorVisible={false}
      backgroundColor={backgroundColor}
      {...props}
    />
  </View>
);

export default class App extends React.Component {
  componentDidMount() {
    // console.log("message");

    SplashScreen.hide();
  }
  render() {
    return (
      <Provider store={store}>
        <PersistGate persistor={persistor}>
          <View style={{ flex: 1 }}>
            <MyStatusBar backgroundColor="#79B45D" barStyle="dark-content" />
            <AppContent />
          </View>
        </PersistGate>
      </Provider>
    );
  }
}
// const App = () => (
//   <Provider store={store}>
//     <PersistGate persistor={persistor}>
//       <View style={{ flex: 1 }}>
//         <MyStatusBar backgroundColor="#79B45D" barStyle="dark-content" />
//         <AppContent />
//       </View>
//     </PersistGate>
//   </Provider>
// );
//
// export default App;