Initial commit

.buckconfig

+
+[android]
+  target = Google Inc.:Google APIs:23
+
+[maven_repositories]
+  central = https://repo1.maven.org/maven2

.eslintrc.js

+module.exports = {
+  root: true,
+  extends: '@react-native-community',
+};

.flowconfig

+[ignore]
+; We fork some components by platform
+.*/*[.]android.js
+
+; Ignore "BUCK" generated dirs
+<PROJECT_ROOT>/\.buckd/
+
+; Ignore polyfills
+node_modules/react-native/Libraries/polyfills/.*
+
+; These should not be required directly
+; require from fbjs/lib instead: require('fbjs/lib/warning')
+node_modules/warning/.*
+
+; Flow doesn't support platforms
+.*/Libraries/Utilities/LoadingView.js
+
+[untyped]
+.*/node_modules/@react-native-community/cli/.*/.*
+
+[include]
+
+[libs]
+node_modules/react-native/interface.js
+node_modules/react-native/flow/
+
+[options]
+emoji=true
+
+esproposal.optional_chaining=enable
+esproposal.nullish_coalescing=enable
+
+module.file_ext=.js
+module.file_ext=.json
+module.file_ext=.ios.js
+
+munge_underscores=true
+
+module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/node_modules/react-native/\1'
+module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/node_modules/react-native/Libraries/Image/RelativeImageStub'
+
+suppress_type=$FlowIssue
+suppress_type=$FlowFixMe
+suppress_type=$FlowFixMeProps
+suppress_type=$FlowFixMeState
+
+suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native\\(_ios\\)?_\\(oss\\|fb\\)[a-z,_]*\\)?)\\)
+suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native\\(_ios\\)?_\\(oss\\|fb\\)[a-z,_]*\\)?)\\)?:? #[0-9]+
+suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError
+
+[lints]
+sketchy-null-number=warn
+sketchy-null-mixed=warn
+sketchy-number=warn
+untyped-type-import=warn
+nonstrict-import=warn
+deprecated-type=warn
+unsafe-getters-setters=warn
+unnecessary-invariant=warn
+signature-verification-failure=warn
+deprecated-utility=error
+
+[strict]
+deprecated-type
+nonstrict-import
+sketchy-null
+unclear-type
+unsafe-getters-setters
+untyped-import
+untyped-type-import
+
+[version]
+^0.122.0

.gitattributes

+*.pbxproj -text

.gitignore

+# OSX
+#
+.DS_Store
+
+# Xcode
+#
+build/
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+xcuserdata
+*.xccheckout
+*.moved-aside
+DerivedData
+*.hmap
+*.ipa
+*.xcuserstate
+
+# Android/IntelliJ
+#
+build/
+.idea
+.gradle
+local.properties
+*.iml
+
+# node.js
+#
+node_modules/
+npm-debug.log
+yarn-error.log
+
+# BUCK
+buck-out/
+\.buckd/
+*.keystore
+!debug.keystore
+
+# fastlane
+#
+# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
+# screenshots whenever they are needed.
+# For more information about the recommended setup visit:
+# https://docs.fastlane.tools/best-practices/source-control/
+
+*/fastlane/report.xml
+*/fastlane/Preview.html
+*/fastlane/screenshots
+
+# Bundle artifact
+*.jsbundle
+
+# CocoaPods
+/ios/Pods/

.prettierrc.js

+module.exports = {
+  bracketSpacing: false,
+  jsxBracketSameLine: true,
+  singleQuote: true,
+  trailingComma: 'all',
+};

.watchmanconfig

+{}
\ No newline at end of file

Api.tsx

+import Constants from './Constants';
+export default {
+    getUserInfo: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/userInfo',
+            params: params
+        };
+    },
+    getVersion: {
+        host: Constants.apiPath + 'common/get_version',
+        params: {
+        }
+    },
+    getSMSCode: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/captcha',
+            params: params
+        };
+    },
+    login: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/captchaLogin',
+            params: params
+        };
+    },
+    loginWithPassword: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/login',
+            params: params
+        }
+    },
+    getAgoraConfig: {
+        host: Constants.apiPath + '/flplat/api/v1/app/agora/config',
+        params: {}
+    },
+    getCurrentLessons: {
+        host: Constants.apiPath + '/flplat/api/v1/app/studentLessonSchedules/current',
+        params: {
+        }
+    },
+    getRTCToken: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/agora/RTCToken',
+            params: params
+        }
+    },
+    getRTMToken: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/agora/RTMToken',
+            params: params
+        }
+    },
+    getLessonSchule: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/studentLessonSchedules',
+            params: params
+        }
+    },
+    getNoteList: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/clazzScheduleNotes',
+            params: params
+        }
+    },
+    getNetlessToken: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/agora/roomToken',
+            params: params
+        }
+    },
+    getLessonStat: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/studentLessonSchedules/lessonSchedule',
+            params: params
+        }
+    },
+    getAgoraTempInfo: {
+        host: Constants.apiPath + '/flplat/api/v1/app/agora/tempInfo',
+        params: {}
+    },
+    virifyCode: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/captchaValid',
+            params: params
+        }
+    },
+    resetPwd: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/resetPassword',
+            params: params
+        }
+    },
+    changePwd: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/updatePassword',
+            params: params
+        }
+    },
+    logout: () => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/logout',
+            params: {}
+        }
+    },
+    updateUserInfo: (params, id) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/user/' + id,
+            params: params
+        }
+    },
+    getLessonSchedulesById: (params, id) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/studentLessonSchedules/',
+            params: params
+        }
+    },
+    getMyClass: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/clazzes',
+            params: params
+        }
+    },
+    setTeacherComment: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/teacherLessonReports',
+            params: params
+        }
+    },
+    uploadFile: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/files?folder=cloud',
+            params: params
+        }
+    },
+    saveNote: (params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/clazzScheduleNotes',
+            params: params
+        }
+    },
+    removeNote: (id) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/clazzScheduleNotes/' + id,
+            params: {}
+        }
+    },
+    editNote: (id, params) => {
+        return {
+            host: Constants.apiPath + '/flplat/api/v1/app/clazzScheduleNotes/' + id,
+            params: params
+        }
+
+    },
+    getReportStat: {
+        host: Constants.apiPath + '/flplat/api/v1/app/studentLessonSchedules/reportStat',
+        params: {}
+    },
+}

App.js.back.js

+/**
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ *
+ * @format
+ * @flow strict-local
+ */
+
+import React from 'react';
+import {
+  SafeAreaView,
+  StyleSheet,
+  ScrollView,
+  View,
+  Text,
+  StatusBar,
+} from 'react-native';
+
+import {
+  Header,
+  LearnMoreLinks,
+  Colors,
+  DebugInstructions,
+  ReloadInstructions,
+} from 'react-native/Libraries/NewAppScreen';
+
+const App: () => React$Node = () => {
+  return (
+    <>
+      <StatusBar barStyle="dark-content" />
+      <SafeAreaView>
+        <ScrollView
+          contentInsetAdjustmentBehavior="automatic"
+          style={styles.scrollView}>
+          <Header />
+          {global.HermesInternal == null ? null : (
+            <View style={styles.engine}>
+              <Text style={styles.footer}>Engine: Hermes</Text>
+            </View>
+          )}
+          <View style={styles.body}>
+            <View style={styles.sectionContainer}>
+              <Text style={styles.sectionTitle}>Step One</Text>
+              <Text style={styles.sectionDescription}>
+                Edit <Text style={styles.highlight}>App.js</Text> to change this
+                screen and then come back to see your edits.
+              </Text>
+            </View>
+            <View style={styles.sectionContainer}>
+              <Text style={styles.sectionTitle}>See Your Changes</Text>
+              <Text style={styles.sectionDescription}>
+                <ReloadInstructions />
+              </Text>
+            </View>
+            <View style={styles.sectionContainer}>
+              <Text style={styles.sectionTitle}>Debug</Text>
+              <Text style={styles.sectionDescription}>
+                <DebugInstructions />
+              </Text>
+            </View>
+            <View style={styles.sectionContainer}>
+              <Text style={styles.sectionTitle}>Learn More</Text>
+              <Text style={styles.sectionDescription}>
+                Read the docs to discover what to do next:
+              </Text>
+            </View>
+            <LearnMoreLinks />
+          </View>
+        </ScrollView>
+      </SafeAreaView>
+    </>
+  );
+};
+
+const styles = StyleSheet.create({
+  scrollView: {
+    backgroundColor: Colors.lighter,
+  },
+  engine: {
+    position: 'absolute',
+    right: 0,
+  },
+  body: {
+    backgroundColor: Colors.white,
+  },
+  sectionContainer: {
+    marginTop: 32,
+    paddingHorizontal: 24,
+  },
+  sectionTitle: {
+    fontSize: 24,
+    fontWeight: '600',
+    color: Colors.black,
+  },
+  sectionDescription: {
+    marginTop: 8,
+    fontSize: 18,
+    fontWeight: '400',
+    color: Colors.dark,
+  },
+  highlight: {
+    fontWeight: '700',
+  },
+  footer: {
+    color: Colors.dark,
+    fontSize: 12,
+    fontWeight: '600',
+    padding: 4,
+    paddingRight: 12,
+    textAlign: 'right',
+  },
+});
+
+export default App;

App.tsx

+import React, {Component} from 'react';
+import { View, Text, StatusBar, DeviceEventEmitter, StyleSheet, ScrollView, NativeModules, ImageBackground } from 'react-native';
+import { NavigationContainer, DefaultTheme, TabActions } from '@react-navigation/native';
+import { createStackNavigator } from '@react-navigation/stack';
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+const MyNative = NativeModules.MyNative;
+// import Orientation from 'react-native-orientation';
+import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
+import SplashScreen from 'react-native-splash-screen';
+import IdleTimerManager from 'react-native-idle-timer';
+// 公共组件
+import Constants from './Constants';
+import Api from './Api';
+import Tabbar from './src/components/Tabbar';
+import MainNavHeader from './src/components/MainNavHeader';
+import NavHeader from './src/components/NavHeader';
+
+import Login from './src/components/Login';
+import Reset from './src/components/Reset';
+
+// 业务逻辑组件 [首页]
+import HomeIndex from './src/home/Index';
+
+// 业务逻辑组件 [班级]
+import CourseIndex from './src/course/Index';
+import Comment from './src/course/Comment';
+
+// 业务逻辑组件 [我的]
+import MineIndex from './src/mine/Index';
+
+// 业务逻辑组件 [直播]
+import LiveIndex from './src/live/Index';
+import Check from './src/live/Check';
+import MyVideo from './src/live/MyVideo';
+
+const Root = createStackNavigator();
+const Stack = createStackNavigator();
+const Tab = createBottomTabNavigator();
+
+const screenOptions = {
+  headerTintColor: 'white',
+  headerStyle: {
+    backgroundColor: '#377dbb',
+    borderBottomWidth: 0
+  },
+};
+
+const customTheme = {
+  ...DefaultTheme,
+  colors: {
+    ...DefaultTheme.colors,
+    border: '#377dbb',
+  },
+};
+
+// 首页页面堆栈
+const HomeNav = () => {
+  return (
+      <Stack.Navigator initialRouteName="Home" screenOptions={screenOptions} headerMode="screen">
+        <Stack.Screen name="Home" component={HomeIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+            return <MainNavHeader />;
+            //   return null;
+          }
+        }} />
+        <Stack.Screen name="LiveIndex" component={LiveIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }} />
+        <Stack.Screen name="Check" component={Check} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }} />
+          <Stack.Screen name="MyVideo" component={MyVideo} options={{
+              header: ({ scene, previous, navigation }) => {
+                  return null;
+              }
+          }} />
+          <Stack.Screen name="Comment" component={Comment} options={{
+              header: ({ scene, previous, navigation }) => {
+                  return <NavHeader title="老师评价" navigation={navigation}/>;
+              }
+          }} />
+
+      </Stack.Navigator>
+  );
+}
+
+// 班级页面堆栈
+const CourseNav = ({ navigation }) => {
+
+    return (
+      <Stack.Navigator initialRouteName="Course" screenOptions={screenOptions}>
+        <Stack.Screen name="Course" component={CourseIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }}/>
+        <Stack.Screen name="LiveIndex" component={LiveIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }} />
+        <Stack.Screen name="Check" component={Check} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }} />
+          <Stack.Screen name="Comment" component={Comment} options={{
+              header: ({ scene, previous, navigation }) => {
+                  return <NavHeader title="老师评价" navigation={navigation}/>;
+              }
+          }} />
+          <Stack.Screen name="MyVideo" component={MyVideo} options={{
+              header: ({ scene, previous, navigation }) => {
+                  return null;
+              }
+          }} />
+      </Stack.Navigator>
+  );
+}
+
+// 我的页面堆栈
+const MineNav = () => {
+  return (
+      <Stack.Navigator initialRouteName="Mine" screenOptions={screenOptions}>
+        <Stack.Screen name="Mine" component={MineIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+              return <MainNavHeader />;
+          }
+        }}/>
+      </Stack.Navigator>
+  );
+}
+
+// 底部 tabbar 配置
+const tabbarConfig = [{
+    title: '首页',
+    icon: require('./images/tabbar/home.png'),
+    iconActive: require('./images/tabbar/home-active.png'),
+    name: 'HomeNav',
+    width: Constants.unitWidth * 18,
+    height: Constants.unitWidth * 19,
+}, {
+  title: '班级',
+  icon: require('./images/tabbar/class.png'),
+  iconActive: require('./images/tabbar/class-active.png'),
+  name: 'CourseNav',
+  width: Constants.unitWidth * 18,
+  height: Constants.unitWidth * 19,
+}, {
+  title: '我的',
+  icon: require('./images/tabbar/mine.png'),
+  iconActive: require('./images/tabbar/mine-active.png'),
+  name: 'MineNav',
+  width: Constants.unitWidth * 18,
+  height: Constants.unitWidth * 19,
+}];
+
+function MainStack () {
+  return (
+      <Tab.Navigator tabBar={props => {
+        return <Tabbar options={tabbarConfig} {...props}/>
+      }}>
+        <Tab.Screen name="HomeNav" component={HomeNav} />
+        <Tab.Screen name="CourseNav" component={CourseNav}/>
+        <Tab.Screen name="MineNav" component={MineNav} />
+      </Tab.Navigator>
+  );
+}
+
+export default class App extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+        showLogin: false,
+        inited: false
+    };
+    this.navigationRef = null;
+    this.checkTimer = null;
+  }
+
+  componentDidMount() {
+      // Orientation.lockToLandscape();
+    // setTimeout(this.getMemberInfo, 2000);
+    IdleTimerManager.setIdleTimerDisabled(true);
+    this.checkUserInfo();
+      DeviceEventEmitter.addListener('showLogin', (data) => {
+          this.setState(data);
+      })
+  }
+
+  checkUserInfo = () => {
+    if (this.checkTimer) {
+      clearTimeout(this.checkTimer);
+    }
+    if (this.navigationRef) {
+        this.getUserInfo();
+        this.checkTimer = setTimeout(this.checkUserInfo, 3000);
+    } else {
+        this.checkTimer = setTimeout(this.checkUserInfo, 500);
+    }
+
+  }
+
+  getUserInfo = () => {
+    Constants.readData('userInfo').then((userInfo) => {
+      if (userInfo) {
+        // console.log('userinfo', userInfo);
+        userInfo = JSON.parse(userInfo);
+        Constants.token = userInfo.token;
+        Constants.get(Api.getUserInfo({
+        }))
+            .then((response) => {
+              return response.json()
+            })
+            .then(data => {
+              if (data.memo && data.memo === '未登录') {
+                  console.log(this.navigationRef.getCurrentRoute());
+                  if (this.navigationRef && this.navigationRef.getCurrentRoute() && this.navigationRef.getCurrentRoute().name !== 'Login') {
+                      let currentRoute = this.navigationRef.getCurrentRoute().name;
+                      if (!['Login', 'Reset'].includes(currentRoute)) {
+                          this.navigationRef.navigate('Login');
+                      }
+                  }
+              } else {
+                let _data = data.data;
+                _data.token = Constants.token;
+                Constants.storeData('userInfo', JSON.stringify(_data));
+                this.setState({
+                  userInfo: _data
+                });
+              }
+                if (!this.state.inited) {
+                    setTimeout(() => {
+                        SplashScreen.hide();
+                        DeviceEventEmitter.emit('inited', {
+                        });
+                    }, 500)
+                }
+              this.setState({
+                  inited: true
+              });
+            })
+            .catch(error => {
+              // console.log('error', error)
+            });
+      } else {
+          if (this.navigationRef && this.navigationRef.getCurrentRoute() && this.navigationRef.getCurrentRoute().name !== 'Login') {
+              let currentRoute = this.navigationRef.getCurrentRoute().name;
+              if (!['Login', 'Reset'].includes(currentRoute)) {
+                  this.navigationRef.navigate('Login');
+              }
+          }
+          if (!this.state.inited) {
+              setTimeout(() => {
+                  SplashScreen.hide();
+                  DeviceEventEmitter.emit('inited', {
+                  });
+              }, 500)
+          }
+          this.setState({
+              inited: true
+          });
+
+
+      }
+    })
+
+  }
+
+  render () {
+    return (
+        <SafeAreaProvider>
+          <StatusBar
+              translucent={true}
+              backgroundColor={"rgba(0,0,0,0)"}
+          />
+          <NavigationContainer theme={customTheme} ref={(navigationRef) => {
+            this.navigationRef = navigationRef;
+          }}>
+            <Root.Navigator mode="modal" initialRouteName="Main">
+              <Root.Screen
+                  name="Main"
+                  component={MainStack}
+                  options={{ headerShown: false }}
+              />
+              <Root.Screen
+                  name="Login"
+                  component={Login}
+                  options={{ headerShown: false }}
+              />
+            <Root.Screen
+                name="Reset"
+                component={Reset}
+                options={{ headerShown: false }}
+            />
+            </Root.Navigator>
+          </NavigationContainer>
+        </SafeAreaProvider>
+    );
+  }
+}
+

App的副本.tsx

+import React, {Component} from 'react';
+import { View, Text, StatusBar, DeviceEventEmitter, StyleSheet, ScrollView, NativeModules, ImageBackground } from 'react-native';
+import 'react-native-gesture-handler';
+import { NavigationContainer, DefaultTheme } from '@react-navigation/native';
+import { createStackNavigator } from '@react-navigation/stack';
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import Button from 'react-native-button';
+const MyNative = NativeModules.MyNative;
+import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
+// import SplashScreen from 'react-native-splash-screen';
+// import LinearGradient from "react-native-linear-gradient";
+// 公共组件
+import Constants from './Constants';
+import Api from './Api';
+import Tabbar from './src/components/Tabbar';
+import Toast from './src/components/Toast';
+import Login from './src/components/Login';
+
+//首页页面组件
+import HomeIndex from './src/home/Index';
+//课程页面组件
+import CourseIndex from './src/course/Index';
+//云盘页面组件
+import DiskIndex from './src/disk/Index';
+//设置页面组件
+import SettingIndex from './src/setting/Index';
+//直播页面组件
+import LiveIndex from './src/live/Index';
+
+const Root = createStackNavigator();
+const Stack = createStackNavigator();
+const Tab = createBottomTabNavigator();
+
+const screenOptions = {
+  headerTintColor: 'white',
+  headerStyle: {
+    backgroundColor: '#377dbb',
+    borderBottomWidth: 0
+  },
+};
+
+const customTheme = {
+  ...DefaultTheme,
+  colors: {
+    ...DefaultTheme.colors,
+    border: '#377dbb',
+  },
+};
+
+// 首页页面堆栈
+const HomeNav = () => {
+  return (
+      <Stack.Navigator initialRouteName="Home" screenOptions={screenOptions} headerMode="screen">
+        <Stack.Screen name="Home" component={HomeIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }} />
+          <Stack.Screen name="LiveIndex" component={LiveIndex} options={{
+              header: ({ scene, previous, navigation }) => {
+                  return null;
+              }
+          }} />
+      </Stack.Navigator>
+  );
+}
+
+// 课程页面堆栈
+const CourseNav = () => {
+  return (
+      <Stack.Navigator initialRouteName="Course" screenOptions={screenOptions}>
+        <Stack.Screen name="Course" component={CourseIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }}/>
+
+      </Stack.Navigator>
+  );
+}
+
+// 云盘页面堆栈
+const DiskNav = () => {
+  return (
+      <Stack.Navigator initialRouteName="Disk" screenOptions={screenOptions}>
+        <Stack.Screen name="Disk" component={DiskIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }}/>
+
+      </Stack.Navigator>
+  );
+}
+
+// 设置页面堆栈
+const SettingNav = () => {
+  return (
+      <Stack.Navigator initialRouteName="Setting" screenOptions={screenOptions}>
+        <Stack.Screen name="Setting" component={SettingIndex} options={{
+          header: ({ scene, previous, navigation }) => {
+            return null;
+          }
+        }}/>
+
+      </Stack.Navigator>
+  );
+}
+
+// 底部 tabbar 配置
+
+function MainStack () {
+  return (
+      <Tab.Navigator tabBar={props => {
+          return null;
+      }}>
+        <Tab.Screen name="HomeNav" component={HomeNav} />
+        <Tab.Screen name="CourseNav" component={CourseNav} />
+        <Tab.Screen name="DiskNav" component={DiskNav} />
+        <Tab.Screen name="SettingNav" component={SettingNav} />
+      </Tab.Navigator>
+  );
+}
+
+export default class App extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+        showToast: false,
+        msg: '',
+        tipsIcon: '',
+        index: 0,
+        showLogin: false,
+        showTabbar: true
+    };
+    this.navigationRef = null;
+  }
+
+  componentDidMount() {
+    this.getUserInfo();
+    // SplashScreen.hide();
+      DeviceEventEmitter.addListener('showToast', (data) => {
+          // console.log('updateRestaurant', data, this);
+          if (data.type === 'success') {
+              this.setState({
+                  showToast: true,
+                  msg: data.msg,
+                  tipsIcon: require('./images/common/success.png')
+              });
+          } else {
+              this.setState({
+                  showToast: true,
+                  msg: data.msg,
+                  tipsIcon: require('./images/common/error.png')
+              });
+          }
+
+      });
+      DeviceEventEmitter.addListener('showLogin', (data) => {
+          this.setState(data);
+      });
+      DeviceEventEmitter.addListener('showTabbar', (data) => {
+          this.setState(data);
+      });
+
+  }
+
+  getUserInfo = () => {
+      Constants.readData('userInfo').then((userInfo) => {
+          if (userInfo) {
+              userInfo = JSON.parse(userInfo);
+              Constants.token = userInfo.token;
+              Constants.get(Api.getUserInfo({
+              }))
+                  .then((response) => {
+                      // console.log(response);
+                      return response.json()
+                  })
+                  .then(data => {
+                      console.log('getUserInfo', data);
+                      if (data.memo && data.memo === '未登录') {
+                          // console.log('还没登录');
+                          this.setState({
+                              showLogin: true
+                          })
+                      } else {
+                          console.log('登录了');
+                      }
+                  })
+                  .catch(error => {
+                      console.log('error', error)
+                  });
+          } else {
+              this.setState({
+                  showLogin: true
+              })
+          }
+      })
+
+  }
+
+    moduleClick = (data) => {
+      // console.log('moduleClick', data);
+        this.setState(data.data);
+        this.navigationRef.navigate(data.link);
+    }
+
+  render () {
+    return (
+        <SafeAreaProvider style={{
+            backgroundColor: '#30323D'
+        }}>
+          <StatusBar
+              translucent={false}
+              barStyle="dark-content"
+          />
+          <View style={{
+              flexDirection: 'row',
+              flex: 1,
+              paddingTop: Constants.statusBarHeight
+          }}>
+              {
+                  this.state.showTabbar &&
+                  <Tabbar style={{
+                      // backgroundColor: ,
+                      width: Constants.unitWidth * 90
+                  }} index={this.state.index} moduleClick={this.moduleClick}/>
+              }
+              <View style={{
+                  flex: 1,
+                  backgroundColor: '#ee0000'
+              }}>
+                  <NavigationContainer theme={customTheme} ref={(navigationRef) => {
+                      this.navigationRef = navigationRef;
+                  }}>
+                      <Root.Navigator mode="modal" initialRouteName="Main">
+                          <Root.Screen
+                              name="Main"
+                              component={MainStack}
+                              options={{ headerShown: false }}
+                          />
+                      </Root.Navigator>
+                  </NavigationContainer>
+              </View>
+
+          </View>
+            <Login show={this.state.showLogin} />
+            <Toast onHide={() => {
+                this.setState({
+                    showToast: false
+                })
+            }} show={this.state.showToast} msg={this.state.msg} icon={this.state.tipsIcon}/>
+        </SafeAreaProvider>
+    );
+  }
+}

Constants.js

+import AsyncStorage from '@react-native-async-storage/async-storage';
+import {Dimensions, StatusBar, Platform} from 'react-native';
+
+const designWidth = 1024;
+const screenWidth = Dimensions.get('window').height;
+const  screenHeight = Dimensions.get('window').width;
+const unitWidth = screenHeight / designWidth;
+
+export default {
+    // apiPath: 'http://121.36.221.250:3001/mock/11',
+    apiPath: 'http://education-tst.sinocanada.cn',
+    imgPath: '',
+
+    token: '',
+    numOfPage: 10,
+    baseFontSize: 15,
+
+    width: screenWidth,
+    height: screenHeight,
+    unitWidth: unitWidth,
+    statusBarHeight: getStatusBarHeight(),
+    safeAreaBottomHeight: isIphoneX() ? 34 : 0,
+
+    homeCates: [
+        {
+            title: '推荐',
+        },
+        {
+            title: '政声',
+        },
+        {
+            title: '民生',
+        },
+        {
+            title: '发现',
+        },
+        {
+            title: '专题',
+        },
+    ],
+
+    storeData: async (key, value) => {
+        try {
+            return await AsyncStorage.setItem(key, value);
+        } catch (e) {
+            // saving error
+        }
+    },
+    readData: async (key) => {
+        try {
+            return await AsyncStorage.getItem(key);
+        } catch(e) {
+            // error reading value
+        }
+    },
+    removeData: async (key) => {
+        try {
+            await AsyncStorage.removeItem(key);
+        } catch (error) {
+            // Error saving data
+        }
+    },
+
+    getParam: function (json) {
+        if (!json) return ''
+        return cleanArray(Object.keys(json).map(key => {
+            if (json[key] === undefined) return ''
+            return encodeURIComponent(key) + '=' +
+                encodeURIComponent(json[key])
+        })).join('&')
+    },
+    get: function (request) {
+        let url = request.host;
+        let keys = Object.keys(request.params);
+        let params = [];
+        keys.map((key, index) => {
+            params.push(key + '=' + request.params[key]);
+        });
+        url += '?' + params.join('&');
+        // console.log(url, request);
+        return fetch(url, {
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'token': this.token,
+            },
+        });
+    },
+    getWithBodyParams: function (request) {
+        let url = request.host;
+        let keys = Object.keys(request.params);
+        let params = [];
+        keys.map((key, index) => {
+            params.push(key + '=' + request.params[key]);
+        });
+        url += '?' + params.join('&');
+        // console.log(url, request);
+        return fetch(url, {
+            mode: "cors",
+            credentials: 'include',
+            method:'GET',
+            headers: {
+                'token': this.token,
+            },
+        });
+    },
+    post: function (request) {
+        let url = request.host;
+        let data = request.params;
+        return fetch(url, {
+            method:'POST',
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'Content-Type': 'application/x-www-form-urlencoded',
+            },
+            body: this.getParam(data),
+        });
+    },
+    postJSON: function (request) {
+        let url = request.host;
+        let data = request.params;
+        return fetch(url, {
+            method:'POST',
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'Content-Type': 'application/json',
+                'apptype': "ipad"
+            },
+            body: JSON.stringify(data),
+        });
+    },
+    putJSON: function (request) {
+        let url = request.host;
+        let data = request.params;
+        return fetch(url, {
+            method:'PUT',
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'Content-Type': 'application/json',
+                'apptype': "ipad"
+            },
+            body: JSON.stringify(data),
+        });
+    },
+    postWithToken: function (request) {
+        let url = request.host;
+        let data = request.params;
+        // console.log(url, this.token, data);
+        return fetch(url, {
+            method:'POST',
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'token': this.token,
+            },
+            body: this.getParam(data),
+        });
+    },
+    postJSONWithToken: function (request) {
+        let url = request.host;
+        let data = request.params;
+        return fetch(url, {
+            method:'POST',
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'token': this.token,
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(data),
+        });
+    },
+    putJSONWithToken: function (request) {
+        let url = request.host;
+        let data = request.params;
+        console.log(url, this.token, data);
+        return fetch(url, {
+            method:'PUT',
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'token': this.token,
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(data),
+        });
+    },
+    patchJSONWithToken: function (request) {
+        let url = request.host;
+        let data = request.params;
+        console.log(url, this.token, data, JSON.stringify(data));
+        return fetch(url, {
+            method:'PATCH',
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'token': this.token,
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(data),
+        });
+    },
+    deleteJSONWithToken: function (request) {
+        let url = request.host;
+        let data = request.params;
+        return fetch(url, {
+            method:'delete',
+            mode: "cors",
+            credentials: 'include',
+            headers: {
+                'token': this.token,
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(data),
+        });
+    },
+    uploadFile: function (request) {
+        let url = request.host;
+        let formData = new FormData();
+        let file = {uri: request.params.file, type: 'multipart/form-data', name: 'jpg'};
+        formData.append("files", file);
+        if (request.params.params) {
+            formData.append("params", request.params.params);
+        }
+        // console.log(formData);
+        return fetch(url, {
+            method:'POST',
+            mode: "cors",
+            credentials: 'include',
+            headers:{
+                'token': this.token,
+                'Content-Type':'multipart/form-data',
+            },
+            body: formData,
+        });
+    }
+}
+/**
+ * 判断是否为iphoneX
+ * @returns {boolean}
+ */
+export function isIphoneX() {
+    return Platform.OS === 'ios' && (
+            (screenHeight == 812 && screenWidth == 375)
+        || (screenHeight == 896 && screenWidth == 414))
+}
+
+//状态栏的高度
+export function getStatusBarHeight() {
+    if (Platform.OS === 'android') return StatusBar.currentHeight;
+    if (isIphoneX()) {
+        return 44;
+    }
+    return 20;
+}
+
+export function cleanArray(actual) {
+    const newArray = []
+    for (let i = 0; i < actual.length; i++) {
+        if (actual[i]) {
+            newArray.push(actual[i])
+        }
+    }
+    return newArray
+}

Permission.ts

+import { PermissionsAndroid } from 'react-native';
+
+/**
+ * @name requestCameraAndAudioPermission
+ * @description Function to request permission for Audio and Camera
+ */
+export default async function requestCameraAndAudioPermission() {
+  try {
+    const granted = await PermissionsAndroid.requestMultiple([
+      PermissionsAndroid.PERMISSIONS.CAMERA,
+      PermissionsAndroid.PERMISSIONS.RECORD_AUDIO,
+    ]);
+    if (
+      granted['android.permission.RECORD_AUDIO'] ===
+        PermissionsAndroid.RESULTS.GRANTED &&
+      granted['android.permission.CAMERA'] ===
+        PermissionsAndroid.RESULTS.GRANTED
+    ) {
+      console.log('You can use the cameras & mic');
+    } else {
+      console.log('Permission denied');
+    }
+  } catch (err) {
+    console.warn(err);
+  }
+}

__tests__/App-test.js

+/**
+ * @format
+ */
+
+import 'react-native';
+import React from 'react';
+import App from '../App';
+
+// Note: test renderer must be required after react-native.
+import renderer from 'react-test-renderer';
+
+it('renders correctly', () => {
+  renderer.create(<App />);
+});

android/app/_BUCK

+# To learn about Buck see [Docs](https://buckbuild.com/).
+# To run your application with Buck:
+# - install Buck
+# - `npm start` - to start the packager
+# - `cd android`
+# - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US"`
+# - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck
+# - `buck install -r android/app` - compile, install and run application
+#
+
+load(":build_defs.bzl", "create_aar_targets", "create_jar_targets")
+
+lib_deps = []
+
+create_aar_targets(glob(["libs/*.aar"]))
+
+create_jar_targets(glob(["libs/*.jar"]))
+
+android_library(
+    name = "all-libs",
+    exported_deps = lib_deps,
+)
+
+android_library(
+    name = "app-code",
+    srcs = glob([
+        "src/main/java/**/*.java",
+    ]),
+    deps = [
+        ":all-libs",
+        ":build_config",
+        ":res",
+    ],
+)
+
+android_build_config(
+    name = "build_config",
+    package = "com.fenghua_student_client",
+)
+
+android_resource(
+    name = "res",
+    package = "com.fenghua_student_client",
+    res = "src/main/res",
+)
+
+android_binary(
+    name = "app",
+    keystore = "//android/keystores:debug",
+    manifest = "src/main/AndroidManifest.xml",
+    package_type = "debug",
+    deps = [
+        ":app-code",
+    ],
+)

android/app/build.gradle

+apply plugin: "com.android.application"
+
+import com.android.build.OutputFile
+
+/**
+ * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets
+ * and bundleReleaseJsAndAssets).
+ * These basically call `react-native bundle` with the correct arguments during the Android build
+ * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
+ * bundle directly from the development server. Below you can see all the possible configurations
+ * and their defaults. If you decide to add a configuration block, make sure to add it before the
+ * `apply from: "../../node_modules/react-native/react.gradle"` line.
+ *
+ * project.ext.react = [
+ *   // the name of the generated asset file containing your JS bundle
+ *   bundleAssetName: "index.android.bundle",
+ *
+ *   // the entry file for bundle generation. If none specified and
+ *   // "index.android.js" exists, it will be used. Otherwise "index.js" is
+ *   // default. Can be overridden with ENTRY_FILE environment variable.
+ *   entryFile: "index.android.js",
+ *
+ *   // https://reactnative.dev/docs/performance#enable-the-ram-format
+ *   bundleCommand: "ram-bundle",
+ *
+ *   // whether to bundle JS and assets in debug mode
+ *   bundleInDebug: false,
+ *
+ *   // whether to bundle JS and assets in release mode
+ *   bundleInRelease: true,
+ *
+ *   // whether to bundle JS and assets in another build variant (if configured).
+ *   // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants
+ *   // The configuration property can be in the following formats
+ *   //         'bundleIn${productFlavor}${buildType}'
+ *   //         'bundleIn${buildType}'
+ *   // bundleInFreeDebug: true,
+ *   // bundleInPaidRelease: true,
+ *   // bundleInBeta: true,
+ *
+ *   // whether to disable dev mode in custom build variants (by default only disabled in release)
+ *   // for example: to disable dev mode in the staging build type (if configured)
+ *   devDisabledInStaging: true,
+ *   // The configuration property can be in the following formats
+ *   //         'devDisabledIn${productFlavor}${buildType}'
+ *   //         'devDisabledIn${buildType}'
+ *
+ *   // the root of your project, i.e. where "package.json" lives
+ *   root: "../../",
+ *
+ *   // where to put the JS bundle asset in debug mode
+ *   jsBundleDirDebug: "$buildDir/intermediates/assets/debug",
+ *
+ *   // where to put the JS bundle asset in release mode
+ *   jsBundleDirRelease: "$buildDir/intermediates/assets/release",
+ *
+ *   // where to put drawable resources / React Native assets, e.g. the ones you use via
+ *   // require('./image.png')), in debug mode
+ *   resourcesDirDebug: "$buildDir/intermediates/res/merged/debug",
+ *
+ *   // where to put drawable resources / React Native assets, e.g. the ones you use via
+ *   // require('./image.png')), in release mode
+ *   resourcesDirRelease: "$buildDir/intermediates/res/merged/release",
+ *
+ *   // by default the gradle tasks are skipped if none of the JS files or assets change; this means
+ *   // that we don't look at files in android/ or ios/ to determine whether the tasks are up to
+ *   // date; if you have any other folders that you want to ignore for performance reasons (gradle
+ *   // indexes the entire tree), add them here. Alternatively, if you have JS files in android/
+ *   // for example, you might want to remove it from here.
+ *   inputExcludes: ["android/**", "ios/**"],
+ *
+ *   // override which node gets called and with what additional arguments
+ *   nodeExecutableAndArgs: ["node"],
+ *
+ *   // supply additional arguments to the packager
+ *   extraPackagerArgs: []
+ * ]
+ */
+
+project.ext.react = [
+    enableHermes: false,  // clean and rebuild if changing
+]
+
+apply from: "../../node_modules/react-native/react.gradle"
+
+/**
+ * Set this to true to create two separate APKs instead of one:
+ *   - An APK that only works on ARM devices
+ *   - An APK that only works on x86 devices
+ * The advantage is the size of the APK is reduced by about 4MB.
+ * Upload all the APKs to the Play Store and people will download
+ * the correct one based on the CPU architecture of their device.
+ */
+def enableSeparateBuildPerCPUArchitecture = false
+
+/**
+ * Run Proguard to shrink the Java bytecode in release builds.
+ */
+def enableProguardInReleaseBuilds = false
+
+/**
+ * The preferred build flavor of JavaScriptCore.
+ *
+ * For example, to use the international variant, you can use:
+ * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
+ *
+ * The international variant includes ICU i18n library and necessary data
+ * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
+ * give correct results when using with locales other than en-US.  Note that
+ * this variant is about 6MiB larger per architecture than default.
+ */
+def jscFlavor = 'org.webkit:android-jsc:+'
+
+/**
+ * Whether to enable the Hermes VM.
+ *
+ * This should be set on project.ext.react and mirrored here.  If it is not set
+ * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode
+ * and the benefits of using Hermes will therefore be sharply reduced.
+ */
+def enableHermes = project.ext.react.get("enableHermes", false);
+
+android {
+    compileSdkVersion rootProject.ext.compileSdkVersion
+
+    compileOptions {
+        sourceCompatibility JavaVersion.VERSION_1_8
+        targetCompatibility JavaVersion.VERSION_1_8
+    }
+
+    defaultConfig {
+        applicationId "com.fenghua_student_client"
+        minSdkVersion rootProject.ext.minSdkVersion
+        targetSdkVersion rootProject.ext.targetSdkVersion
+        versionCode 1
+        versionName "1.0"
+    }
+    splits {
+        abi {
+            reset()
+            enable enableSeparateBuildPerCPUArchitecture
+            universalApk false  // If true, also generate a universal APK
+            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
+        }
+    }
+    signingConfigs {
+        debug {
+            storeFile file('debug.keystore')
+            storePassword 'android'
+            keyAlias 'androiddebugkey'
+            keyPassword 'android'
+        }
+    }
+    buildTypes {
+        debug {
+            signingConfig signingConfigs.debug
+        }
+        release {
+            // Caution! In production, you need to generate your own keystore file.
+            // see https://reactnative.dev/docs/signed-apk-android.
+            signingConfig signingConfigs.debug
+            minifyEnabled enableProguardInReleaseBuilds
+            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
+        }
+    }
+
+    // applicationVariants are e.g. debug, release
+    applicationVariants.all { variant ->
+        variant.outputs.each { output ->
+            // For each separate APK per architecture, set a unique version code as described here:
+            // https://developer.android.com/studio/build/configure-apk-splits.html
+            def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
+            def abi = output.getFilter(OutputFile.ABI)
+            if (abi != null) {  // null for the universal-debug, universal-release variants
+                output.versionCodeOverride =
+                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
+            }
+
+        }
+    }
+}
+
+dependencies {
+    implementation fileTree(dir: "libs", include: ["*.jar"])
+    //noinspection GradleDynamicVersion
+    implementation "com.facebook.react:react-native:+"  // From node_modules
+
+    implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0"
+
+    debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") {
+      exclude group:'com.facebook.fbjni'
+    }
+
+    debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") {
+        exclude group:'com.facebook.flipper'
+        exclude group:'com.squareup.okhttp3', module:'okhttp'
+    }
+
+    debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") {
+        exclude group:'com.facebook.flipper'
+    }
+
+    if (enableHermes) {
+        def hermesPath = "../../node_modules/hermes-engine/android/";
+        debugImplementation files(hermesPath + "hermes-debug.aar")
+        releaseImplementation files(hermesPath + "hermes-release.aar")
+    } else {
+        implementation jscFlavor
+    }
+}
+
+// Run this once to be able to run the application with BUCK
+// puts all compile dependencies into folder libs for BUCK to use
+task copyDownloadableDepsToLibs(type: Copy) {
+    from configurations.compile
+    into 'libs'
+}
+
+apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)

android/app/build_defs.bzl

+"""Helper definitions to glob .aar and .jar targets"""
+
+def create_aar_targets(aarfiles):
+    for aarfile in aarfiles:
+        name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")]
+        lib_deps.append(":" + name)
+        android_prebuilt_aar(
+            name = name,
+            aar = aarfile,
+        )
+
+def create_jar_targets(jarfiles):
+    for jarfile in jarfiles:
+        name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")]
+        lib_deps.append(":" + name)
+        prebuilt_jar(
+            name = name,
+            binary_jar = jarfile,
+        )

android/app/proguard-rules.pro

+# Add project specific ProGuard rules here.
+# By default, the flags in this file are appended to flags specified
+# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
+# You can edit the include path and order by changing the proguardFiles
+# directive in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# Add any project specific keep options here:

android/app/src/debug/AndroidManifest.xml

+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+
+    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
+</manifest>

android/app/src/debug/java/com/fenghua_student_client/ReactNativeFlipper.java

+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * <p>This source code is licensed under the MIT license found in the LICENSE file in the root
+ * directory of this source tree.
+ */
+package com.fenghua_student_client;
+
+import android.content.Context;
+import com.facebook.flipper.android.AndroidFlipperClient;
+import com.facebook.flipper.android.utils.FlipperUtils;
+import com.facebook.flipper.core.FlipperClient;
+import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
+import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
+import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
+import com.facebook.flipper.plugins.inspector.DescriptorMapping;
+import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
+import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
+import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
+import com.facebook.flipper.plugins.react.ReactFlipperPlugin;
+import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
+import com.facebook.react.ReactInstanceManager;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.modules.network.NetworkingModule;
+import okhttp3.OkHttpClient;
+
+public class ReactNativeFlipper {
+  public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
+    if (FlipperUtils.shouldEnableFlipper(context)) {
+      final FlipperClient client = AndroidFlipperClient.getInstance(context);
+
+      client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
+      client.addPlugin(new ReactFlipperPlugin());
+      client.addPlugin(new DatabasesFlipperPlugin(context));
+      client.addPlugin(new SharedPreferencesFlipperPlugin(context));
+      client.addPlugin(CrashReporterPlugin.getInstance());
+
+      NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
+      NetworkingModule.setCustomClientBuilder(
+          new NetworkingModule.CustomClientBuilder() {
+            @Override
+            public void apply(OkHttpClient.Builder builder) {
+              builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
+            }
+          });
+      client.addPlugin(networkFlipperPlugin);
+      client.start();
+
+      // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
+      // Hence we run if after all native modules have been initialized
+      ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
+      if (reactContext == null) {
+        reactInstanceManager.addReactInstanceEventListener(
+            new ReactInstanceManager.ReactInstanceEventListener() {
+              @Override
+              public void onReactContextInitialized(ReactContext reactContext) {
+                reactInstanceManager.removeReactInstanceEventListener(this);
+                reactContext.runOnNativeModulesQueueThread(
+                    new Runnable() {
+                      @Override
+                      public void run() {
+                        client.addPlugin(new FrescoFlipperPlugin());
+                      }
+                    });
+              }
+            });
+      } else {
+        client.addPlugin(new FrescoFlipperPlugin());
+      }
+    }
+  }
+}

android/app/src/main/AndroidManifest.xml

+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+  package="com.fenghua_student_client">
+
+    <uses-permission android:name="android.permission.INTERNET" />
+
+    <application
+      android:name=".MainApplication"
+      android:label="@string/app_name"
+      android:icon="@mipmap/ic_launcher"
+      android:roundIcon="@mipmap/ic_launcher_round"
+      android:allowBackup="false"
+      android:theme="@style/AppTheme">
+      <activity
+        android:name=".MainActivity"
+        android:label="@string/app_name"
+        android:configChanges="keyboard|keyboardHidden|orientation|screenSize|uiMode"
+        android:launchMode="singleTask"
+        android:windowSoftInputMode="adjustResize">
+        <intent-filter>
+            <action android:name="android.intent.action.MAIN" />
+            <category android:name="android.intent.category.LAUNCHER" />
+        </intent-filter>
+      </activity>
+      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
+    </application>
+
+</manifest>

android/app/src/main/java/com/fenghua_student_client/MainActivity.java

+package com.fenghua_student_client;
+
+import com.facebook.react.ReactActivity;
+
+public class MainActivity extends ReactActivity {
+
+  /**
+   * Returns the name of the main component registered from JavaScript. This is used to schedule
+   * rendering of the component.
+   */
+  @Override
+  protected String getMainComponentName() {
+    return "fenghua_student_client";
+  }
+}

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

+package com.fenghua_student_client;
+
+import android.app.Application;
+import android.content.Context;
+import com.facebook.react.PackageList;
+import com.facebook.react.ReactApplication;
+import com.github.yamill.orientation.OrientationPackage;
+import fr.greweb.reactnativeviewshot.RNViewShotPackage;
+import com.zyu.ReactNativeWheelPickerPackage;
+import com.zmxv.RNSound.RNSoundPackage;
+import com.zmxv.RNSound.RNSoundPackage;
+import com.brentvatne.react.ReactVideoPackage;
+import org.devio.rn.splashscreen.SplashScreenReactPackage;
+import com.reactnativecommunity.cameraroll.CameraRollPackage;
+import com.reactnative.ivpusic.imagepicker.PickerPackage;
+import com.marcshilling.idletimer.IdleTimerPackage;
+import com.rnfs.RNFSPackage;
+import com.reactnativecommunity.art.ARTPackage;
+import com.beefe.picker.PickerViewPackage;
+import com.BV.LinearGradient.LinearGradientPackage;
+import io.agora.agora_rtm.AgoraRTMPackage;
+import com.reactnativecommunity.asyncstorage.AsyncStoragePackage;
+import com.reactnativecommunity.asyncstorage.AsyncStoragePackage;
+import com.facebook.react.ReactInstanceManager;
+import com.facebook.react.ReactNativeHost;
+import com.facebook.react.ReactPackage;
+import com.facebook.soloader.SoLoader;
+import java.lang.reflect.InvocationTargetException;
+import java.util.List;
+
+public class MainApplication extends Application implements ReactApplication {
+
+  private final ReactNativeHost mReactNativeHost =
+      new ReactNativeHost(this) {
+        @Override
+        public boolean getUseDeveloperSupport() {
+          return BuildConfig.DEBUG;
+        }
+
+        @Override
+        protected List<ReactPackage> getPackages() {
+          @SuppressWarnings("UnnecessaryLocalVariable")
+          List<ReactPackage> packages = new PackageList(this).getPackages();
+          // Packages that cannot be autolinked yet can be added manually here, for example:
+          // packages.add(new MyReactNativePackage());
+          return packages;
+        }
+
+        @Override
+        protected String getJSMainModuleName() {
+          return "index";
+        }
+      };
+
+  @Override
+  public ReactNativeHost getReactNativeHost() {
+    return mReactNativeHost;
+  }
+
+  @Override
+  public void onCreate() {
+    super.onCreate();
+    SoLoader.init(this, /* native exopackage */ false);
+    initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
+  }
+
+  /**
+   * Loads Flipper in React Native templates. Call this in the onCreate method with something like
+   * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
+   *
+   * @param context
+   * @param reactInstanceManager
+   */
+  private static void initializeFlipper(
+      Context context, ReactInstanceManager reactInstanceManager) {
+    if (BuildConfig.DEBUG) {
+      try {
+        /*
+         We use reflection here to pick up the class that initializes Flipper,
+        since Flipper library is not available in release mode
+        */
+        Class<?> aClass = Class.forName("com.fenghua_student_client.ReactNativeFlipper");
+        aClass
+            .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
+            .invoke(null, context, reactInstanceManager);
+      } catch (ClassNotFoundException e) {
+        e.printStackTrace();
+      } catch (NoSuchMethodException e) {
+        e.printStackTrace();
+      } catch (IllegalAccessException e) {
+        e.printStackTrace();
+      } catch (InvocationTargetException e) {
+        e.printStackTrace();
+      }
+    }
+  }
+}

android/app/src/main/res/values/strings.xml

+<resources>
+    <string name="app_name">fenghua_student_client</string>
+</resources>

android/app/src/main/res/values/styles.xml

+<resources>
+
+    <!-- Base application theme. -->
+    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
+        <!-- Customize your theme here. -->
+        <item name="android:textColor">#000000</item>
+    </style>
+
+</resources>

android/build.gradle

+// Top-level build file where you can add configuration options common to all sub-projects/modules.
+
+buildscript {
+    ext {
+        buildToolsVersion = "29.0.2"
+        minSdkVersion = 16
+        compileSdkVersion = 29
+        targetSdkVersion = 29
+    }
+    repositories {
+        google()
+        jcenter()
+    }
+    dependencies {
+        classpath("com.android.tools.build:gradle:3.5.3")
+        // NOTE: Do not place your application dependencies here; they belong
+        // in the individual module build.gradle files
+    }
+}
+
+allprojects {
+    repositories {
+        mavenLocal()
+        maven {
+            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
+            url("$rootDir/../node_modules/react-native/android")
+        }
+        maven {
+            // Android JSC is installed from npm
+            url("$rootDir/../node_modules/jsc-android/dist")
+        }
+
+        google()
+        jcenter()
+        maven { url 'https://www.jitpack.io' }
+    }
+}

android/gradle.properties

+# Project-wide Gradle settings.
+
+# IDE (e.g. Android Studio) users:
+# Gradle settings configured through the IDE *will override*
+# any settings specified in this file.
+
+# For more details on how to configure your build environment visit
+# http://www.gradle.org/docs/current/userguide/build_environment.html
+
+# Specifies the JVM arguments used for the daemon process.
+# The setting is particularly useful for tweaking memory settings.
+# Default value: -Xmx10248m -XX:MaxPermSize=256m
+# org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8
+
+# When configured, Gradle will run in incubating parallel mode.
+# This option should only be used with decoupled projects. More details, visit
+# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
+# org.gradle.parallel=true
+
+# AndroidX package structure to make it clearer which packages are bundled with the
+# Android operating system, and which are packaged with your app's APK
+# https://developer.android.com/topic/libraries/support-library/androidx-rn
+android.useAndroidX=true
+# Automatically convert third-party libraries to use AndroidX
+android.enableJetifier=true
+
+# Version of flipper SDK to use with React Native
+FLIPPER_VERSION=0.54.0

android/gradle/wrapper/gradle-wrapper.properties

+distributionBase=GRADLE_USER_HOME
+distributionPath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.2-all.zip
+zipStoreBase=GRADLE_USER_HOME
+zipStorePath=wrapper/dists

android/gradlew

+#!/usr/bin/env sh
+
+#
+# Copyright 2015 the original author or authors.
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#      https://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+#
+
+##############################################################################
+##
+##  Gradle start up script for UN*X
+##
+##############################################################################
+
+# Attempt to set APP_HOME
+# Resolve links: $0 may be a link
+PRG="$0"
+# Need this for relative symlinks.
+while [ -h "$PRG" ] ; do
+    ls=`ls -ld "$PRG"`
+    link=`expr "$ls" : '.*-> \(.*\)$'`
+    if expr "$link" : '/.*' > /dev/null; then
+        PRG="$link"
+    else
+        PRG=`dirname "$PRG"`"/$link"
+    fi
+done
+SAVED="`pwd`"
+cd "`dirname \"$PRG\"`/" >/dev/null
+APP_HOME="`pwd -P`"
+cd "$SAVED" >/dev/null
+
+APP_NAME="Gradle"
+APP_BASE_NAME=`basename "$0"`
+
+# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
+
+# Use the maximum available, or set MAX_FD != -1 to use that value.
+MAX_FD="maximum"
+
+warn () {
+    echo "$*"
+}
+
+die () {
+    echo
+    echo "$*"
+    echo
+    exit 1
+}
+
+# OS specific support (must be 'true' or 'false').
+cygwin=false
+msys=false
+darwin=false
+nonstop=false
+case "`uname`" in
+  CYGWIN* )
+    cygwin=true
+    ;;
+  Darwin* )
+    darwin=true
+    ;;
+  MINGW* )
+    msys=true
+    ;;
+  NONSTOP* )
+    nonstop=true
+    ;;
+esac
+
+CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar
+
+# Determine the Java command to use to start the JVM.
+if [ -n "$JAVA_HOME" ] ; then
+    if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
+        # IBM's JDK on AIX uses strange locations for the executables
+        JAVACMD="$JAVA_HOME/jre/sh/java"
+    else
+        JAVACMD="$JAVA_HOME/bin/java"
+    fi
+    if [ ! -x "$JAVACMD" ] ; then
+        die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+    fi
+else
+    JAVACMD="java"
+    which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+
+Please set the JAVA_HOME variable in your environment to match the
+location of your Java installation."
+fi
+
+# Increase the maximum file descriptors if we can.
+if [ "$cygwin" = "false" -a "$darwin" = "false" -a "$nonstop" = "false" ] ; then
+    MAX_FD_LIMIT=`ulimit -H -n`
+    if [ $? -eq 0 ] ; then
+        if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then
+            MAX_FD="$MAX_FD_LIMIT"
+        fi
+        ulimit -n $MAX_FD
+        if [ $? -ne 0 ] ; then
+            warn "Could not set maximum file descriptor limit: $MAX_FD"
+        fi
+    else
+        warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT"
+    fi
+fi
+
+# For Darwin, add options to specify how the application appears in the dock
+if $darwin; then
+    GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\""
+fi
+
+# For Cygwin or MSYS, switch paths to Windows format before running java
+if [ "$cygwin" = "true" -o "$msys" = "true" ] ; then
+    APP_HOME=`cygpath --path --mixed "$APP_HOME"`
+    CLASSPATH=`cygpath --path --mixed "$CLASSPATH"`
+    JAVACMD=`cygpath --unix "$JAVACMD"`
+
+    # We build the pattern for arguments to be converted via cygpath
+    ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null`
+    SEP=""
+    for dir in $ROOTDIRSRAW ; do
+        ROOTDIRS="$ROOTDIRS$SEP$dir"
+        SEP="|"
+    done
+    OURCYGPATTERN="(^($ROOTDIRS))"
+    # Add a user-defined pattern to the cygpath arguments
+    if [ "$GRADLE_CYGPATTERN" != "" ] ; then
+        OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)"
+    fi
+    # Now convert the arguments - kludge to limit ourselves to /bin/sh
+    i=0
+    for arg in "$@" ; do
+        CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -`
+        CHECK2=`echo "$arg"|egrep -c "^-"`                                 ### Determine if an option
+
+        if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then                    ### Added a condition
+            eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"`
+        else
+            eval `echo args$i`="\"$arg\""
+        fi
+        i=`expr $i + 1`
+    done
+    case $i in
+        0) set -- ;;
+        1) set -- "$args0" ;;
+        2) set -- "$args0" "$args1" ;;
+        3) set -- "$args0" "$args1" "$args2" ;;
+        4) set -- "$args0" "$args1" "$args2" "$args3" ;;
+        5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;;
+        6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;;
+        7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;;
+        8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;;
+        9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;;
+    esac
+fi
+
+# Escape application args
+save () {
+    for i do printf %s\\n "$i" | sed "s/'/'\\\\''/g;1s/^/'/;\$s/\$/' \\\\/" ; done
+    echo " "
+}
+APP_ARGS=`save "$@"`
+
+# Collect all arguments for the java command, following the shell quoting and substitution rules
+eval set -- $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS "\"-Dorg.gradle.appname=$APP_BASE_NAME\"" -classpath "\"$CLASSPATH\"" org.gradle.wrapper.GradleWrapperMain "$APP_ARGS"
+
+exec "$JAVACMD" "$@"

android/gradlew.bat

+@rem
+@rem Copyright 2015 the original author or authors.
+@rem
+@rem Licensed under the Apache License, Version 2.0 (the "License");
+@rem you may not use this file except in compliance with the License.
+@rem You may obtain a copy of the License at
+@rem
+@rem      https://www.apache.org/licenses/LICENSE-2.0
+@rem
+@rem Unless required by applicable law or agreed to in writing, software
+@rem distributed under the License is distributed on an "AS IS" BASIS,
+@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+@rem See the License for the specific language governing permissions and
+@rem limitations under the License.
+@rem
+
+@if "%DEBUG%" == "" @echo off
+@rem ##########################################################################
+@rem
+@rem  Gradle startup script for Windows
+@rem
+@rem ##########################################################################
+
+@rem Set local scope for the variables with windows NT shell
+if "%OS%"=="Windows_NT" setlocal
+
+set DIRNAME=%~dp0
+if "%DIRNAME%" == "" set DIRNAME=.
+set APP_BASE_NAME=%~n0
+set APP_HOME=%DIRNAME%
+
+@rem Resolve any "." and ".." in APP_HOME to make it shorter.
+for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
+
+@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
+set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
+
+@rem Find java.exe
+if defined JAVA_HOME goto findJavaFromJavaHome
+
+set JAVA_EXE=java.exe
+%JAVA_EXE% -version >NUL 2>&1
+if "%ERRORLEVEL%" == "0" goto init
+
+echo.
+echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
+echo.
+echo Please set the JAVA_HOME variable in your environment to match the
+echo location of your Java installation.
+
+goto fail
+
+:findJavaFromJavaHome
+set JAVA_HOME=%JAVA_HOME:"=%
+set JAVA_EXE=%JAVA_HOME%/bin/java.exe
+
+if exist "%JAVA_EXE%" goto init
+
+echo.
+echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
+echo.
+echo Please set the JAVA_HOME variable in your environment to match the
+echo location of your Java installation.
+
+goto fail
+
+:init
+@rem Get command-line arguments, handling Windows variants
+
+if not "%OS%" == "Windows_NT" goto win9xME_args
+
+:win9xME_args
+@rem Slurp the command line arguments.
+set CMD_LINE_ARGS=
+set _SKIP=2
+
+:win9xME_args_slurp
+if "x%~1" == "x" goto execute
+
+set CMD_LINE_ARGS=%*
+
+:execute
+@rem Setup the command line
+
+set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
+
+@rem Execute Gradle
+"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS%
+
+:end
+@rem End local scope for the variables with windows NT shell
+if "%ERRORLEVEL%"=="0" goto mainEnd
+
+:fail
+rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
+rem the _cmd.exe /c_ return code!
+if  not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
+exit /b 1
+
+:mainEnd
+if "%OS%"=="Windows_NT" endlocal
+
+:omega

android/settings.gradle

+rootProject.name = 'fenghua_student_client'
+include ':react-native-orientation'
+project(':react-native-orientation').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-orientation/android')
+include ':react-native-view-shot'
+project(':react-native-view-shot').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-view-shot/android')
+include ':react-native-wheel-picker'
+project(':react-native-wheel-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-wheel-picker/android')
+include ':react-native-sound'
+project(':react-native-sound').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-sound/android')
+include ':react-native-sound'
+project(':react-native-sound').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-sound/android')
+include ':react-native-video'
+project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android')
+include ':react-native-splash-screen'
+project(':react-native-splash-screen').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-splash-screen/android')
+include ':@react-native-community_cameraroll'
+project(':@react-native-community_cameraroll').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/cameraroll/android')
+include ':react-native-image-crop-picker'
+project(':react-native-image-crop-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-image-crop-picker/android')
+include ':react-native-idle-timer'
+project(':react-native-idle-timer').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-idle-timer/android')
+include ':react-native-fs'
+project(':react-native-fs').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fs/android')
+include ':@react-native-community_art'
+project(':@react-native-community_art').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/art/android')
+include ':react-native-picker'
+project(':react-native-picker').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-picker/android')
+include ':react-native-linear-gradient'
+project(':react-native-linear-gradient').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-linear-gradient/android')
+include ':agora-react-native-rtm'
+project(':agora-react-native-rtm').projectDir = new File(rootProject.projectDir, '../node_modules/agora-react-native-rtm/android')
+include ':@react-native-async-storage_async-storage'
+project(':@react-native-async-storage_async-storage').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-async-storage/async-storage/android')
+include ':@react-native-async-storage_async-storage'
+project(':@react-native-async-storage_async-storage').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-async-storage/async-storage/android')
+apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
+include ':app'

app.json

+{
+  "name": "fenghua_student_client",
+  "displayName": "fenghua_student_client"
+}
\ No newline at end of file

babel.config.js

+module.exports = {
+  presets: ['module:metro-react-native-babel-preset'],
+};

css/Component.css.ts

+import {
+  StyleSheet, Dimensions
+} from 'react-native';
+
+import Constants from '../Constants';
+
+let ComponentCSS = StyleSheet.create({
+  alarmWrapper: {
+    position: 'absolute',
+    left: Constants.unitWidth * 1,
+    top: Constants.statusBarHeight + Constants.unitWidth * 128,
+    width: Constants.unitWidth * 312,
+    height: Constants.unitWidth * 200,
+    backgroundColor: '#252627'
+  },
+  alarmSeperator: {
+    width: Constants.unitWidth * 312,
+    height: Constants.unitWidth * 1,
+    backgroundColor: 'rgba(255, 255, 255, 0.1)'
+  },
+  alarmTitle: {
+    height: Constants.unitWidth * 43,
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  alarmTitleTxt: {
+    marginLeft: Constants.unitWidth * 10,
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.2,
+    color: '#C1C1C1'
+  },
+  alarmBgWrapepr: {
+    width: Constants.unitWidth * 312,
+    height: Constants.unitWidth * 156
+  },
+  QAWrapepr: {
+    width: Constants.unitWidth * 312,
+    paddingTop: Constants.unitWidth * 20,
+    paddingBottom: Constants.unitWidth * 25,
+  },
+  alarmBg: {
+    width: Constants.unitWidth * 207,
+    height: Constants.unitWidth * 109,
+    flexDirection: 'row'
+  },
+  alarmTimerSeperator: {
+    width: Constants.unitWidth * 33,
+    height: Constants.unitWidth * 109,
+    flexDirection: 'column',
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  alarmPoint: {
+    width: Constants.unitWidth * 6,
+    height: Constants.unitWidth * 6,
+    backgroundColor: '#D8D8D8',
+    borderRadius: Constants.unitWidth * 3
+  },
+  alarmTimeTxt: {
+    width: Constants.unitWidth * 43,
+    color: '#E1E1E1',
+    fontSize: Constants.baseFontSize * 2.8,
+    textAlign: 'center',
+    fontFamily: 'PingFang SC',
+  },
+  alarmTimeTxt2: {
+    width: Constants.unitWidth * 41,
+    color: '#E1E1E1',
+    fontSize: Constants.baseFontSize * 2.8,
+    textAlign: 'center',
+    fontFamily: 'PingFang SC',
+    // height: Constants.unitWidth * 100,
+    lineHeight: Constants.unitWidth * 70
+  },
+  topWrapper: {
+    width: Constants.unitWidth * 42,
+    height: Constants.unitWidth * 35,
+    backgroundColor: '#616161',
+    position: 'absolute',
+    zIndex: 100,
+    right: Constants.unitWidth * 1,
+    top: Constants.unitWidth * 19,
+    borderTopLeftRadius: Constants.unitWidth * 5,
+    borderTopRightRadius: Constants.unitWidth * 5,
+    // overflow: 'hidden',
+    // borderWidth: Constants.unitWidth * 1,
+    // borderColor: '#ee0000'
+  },
+  centerSpearator: {
+    width: Constants.unitWidth * 312,
+    height: Constants.unitWidth * 1,
+    position: 'absolute',
+    left: 0,
+    top: Constants.unitWidth * 77,
+    backgroundColor: '#252627',
+    zIndex: 1000
+  },
+  submitBtn: {
+    width: Constants.unitWidth * 200,
+    height: Constants.unitWidth * 44,
+    backgroundColor: '#F9AE2B',
+    borderRadius: Constants.unitWidth * 4,
+  },
+  submitBtnTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.067,
+    color: '#ffffff'
+  },
+  selectBtnWrapper: {
+    width: Constants.unitWidth * 272,
+    // height: Constants.unitWidth * 100,
+    marginTop: Constants.unitWidth * 25,
+    // backgroundColor: '#eee000',
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    flexWrap: 'wrap'
+  },
+  selectBtn: {
+    flexDirection: 'row',
+    justifyContent: 'center',
+    width: Constants.unitWidth * 68,
+    marginBottom: Constants.unitWidth * 10
+  },
+  selectValue: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.2,
+    color: '#ffffff',
+    marginLeft: Constants.unitWidth * 5
+  },
+  selectCheckBox: {
+    width: Constants.unitWidth * 24,
+    height: Constants.unitWidth * 24,
+  },
+  randomResult: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.333,
+    color: '#ffffff',
+    marginTop: Constants.unitWidth * 35
+  },
+  showName: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.333,
+    color: '#ffffff',
+  },
+  showNameWrapper: {
+    width: Constants.unitWidth * 252,
+    height: Constants.unitWidth * 89,
+    // backgroundColor: '#eee000',
+  },
+  randBg: {
+    width: Constants.unitWidth * 252,
+    height: Constants.unitWidth * 96,
+    marginTop: Constants.unitWidth * 25,
+    overflow: 'hidden'
+  },
+  resultWrapper: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    // backgroundColor: '#eee000',
+    width: '90%',
+    marginBottom: Constants.unitWidth * 20
+  },
+  resultCell: {
+    flexDirection: 'column',
+    width: Constants.unitWidth * 33,
+    alignItems: 'center',
+    justifyContent: 'flex-end'
+  },
+  resultCellNum: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#ffffff',
+  },
+  resultBar: {
+    backgroundColor: '#ffffff',
+    width: Constants.unitWidth * 22,
+    borderRadius: Constants.unitWidth * 2,
+    marginTop: Constants.unitWidth * 5,
+    marginBottom: Constants.unitWidth * 2,
+  },
+  resultCellValue: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#666666',
+  },
+  resultTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.933,
+    color: 'rgba(255, 255, 255, 0.5)',
+  },
+  resultTxt2: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.933,
+    color: '#ffffff',
+  },
+  colorWrapper: {
+
+  }
+});
+
+module.exports = ComponentCSS;

css/Course.css.ts

+import {
+  StyleSheet, Dimensions
+} from 'react-native';
+
+import Constants from '../Constants';
+
+let CourseCSS = StyleSheet.create({
+  classWrapper: {
+    width: Constants.unitWidth * 300
+  },
+  courseWrapper: {
+    flex: 1,
+  },
+  searchBar: {
+    height: Constants.unitWidth * 84,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'flex-end',
+    paddingRight: Constants.unitWidth * 20
+  },
+  searchBar2: {
+    height: Constants.unitWidth * 84,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'flex-start',
+    paddingLeft: Constants.unitWidth * 0
+  },
+  searchWrapper: {
+    width: Constants.unitWidth * 145,
+    height: Constants.unitWidth * 44,
+    backgroundColor: '#ffffff',
+    justifyContent: 'center',
+    borderRadius: Constants.unitWidth * 4,
+  },
+  searchIcon: {
+    width: Constants.unitWidth * 18,
+    height: Constants.unitWidth * 18,
+    marginLeft: Constants.unitWidth * 8
+  },
+  searchTxt: {
+    width: Constants.unitWidth * 145,
+    height: Constants.unitWidth * 22,
+    paddingLeft: Constants.unitWidth * 30,
+    fontFamily: 'PingFangSC-Regular',
+    fontSize: Constants.baseFontSize * 0.933,
+    position: 'absolute',
+    top: Constants.unitWidth * 11,
+  },
+  statusTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.933,
+    color: '#333333'
+  },
+  statusWrapper: {
+    flexDirection: 'row',
+    width: Constants.unitWidth * 100,
+    height: Constants.unitWidth * 44,
+    paddingLeft: Constants.unitWidth * 10,
+    paddingRight: Constants.unitWidth * 8,
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    borderRadius: Constants.unitWidth * 4,
+    marginLeft: Constants.unitWidth * 10,
+    backgroundColor: '#ffffff'
+  },
+  statusIcon: {
+    width: Constants.unitWidth * 8,
+    height: Constants.unitWidth * 5,
+  },
+  courseCell: {
+    marginTop: Constants.unitWidth * 4,
+    width: Constants.unitWidth * 255,
+    height: Constants.unitWidth * 140,
+    backgroundColor: '#ffffff',
+    borderRadius: Constants.unitWidth * 4,
+    shadowColor: "#000",
+    shadowOffset: {
+      width: 0,
+      height: 2,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 3.84,
+    marginLeft: Constants.unitWidth * 4,
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  listSeparator: {
+    height: Constants.unitWidth * 8
+  },
+  classListWrapper: {
+    flex: 1
+  },
+  classListWrapperBaba: {
+    width: Constants.unitWidth * 265,
+    marginLeft: Constants.unitWidth * 20,
+    flex: 1,
+  },
+  curcle: {
+    height: Constants.unitWidth * 60,
+    width: Constants.unitWidth * 60,
+  },
+  courseCellInfo: {
+    flex: 1,
+    paddingLeft: Constants.unitWidth * 10
+  },
+  courseTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1,
+    color: '#313131',
+    fontWeight: '500'
+  },
+  courseSubTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#616161',
+    marginTop: Constants.unitWidth * 5
+  },
+  subClassCell: {
+    width: Constants.unitWidth * 635,
+    height: Constants.unitWidth * 92,
+    backgroundColor: '#ffffff',
+    borderStyle: 'solid',
+    borderRadius: Constants.unitWidth * 4,
+    shadowColor: "rgba(180, 180, 180, 0.5)",
+    shadowOffset: {
+      width: 0,
+      height: Constants.unitWidth * 2,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: Constants.unitWidth * 4,
+    position: 'relative',
+    flexDirection: 'row',
+    alignItems: 'center',
+
+  },
+  subClassIndex: {
+    width: Constants.unitWidth * 34,
+    height: Constants.unitWidth * 92,
+    borderTopLeftRadius: Constants.unitWidth * 4,
+    borderBottomLeftRadius: Constants.unitWidth * 4,
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.933,
+    color: '#616161',
+    fontWeight: '600'
+  },
+  subClassTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1,
+    color: '#333333',
+    fontWeight: '500',
+    width: Constants.unitWidth * 200,
+  },
+  subClassTitleWrapper: {
+    width: Constants.unitWidth * 200,
+    marginLeft: Constants.unitWidth * 15,
+    flexDirection: 'column',
+    justifyContent: 'center'
+  },
+  subClassSubTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#616161',
+    marginTop: Constants.unitWidth * 5,
+    width: Constants.unitWidth * 200,
+  },
+  subClassRightIcon: {
+    flexDirection: 'column',
+    alignItems: 'center',
+    justifyContent: 'center',
+    height: Constants.unitWidth * 92,
+  },
+  subClassRightIcon2: {
+    width: Constants.unitWidth * 4,
+    height: Constants.unitWidth * 4,
+    borderRadius: Constants.unitWidth * 2,
+    backgroundColor: '#A8B1B8'
+  },
+  subClassRightIcon1: {
+    width: Constants.unitWidth * 4,
+    height: Constants.unitWidth * 4,
+    borderRadius: Constants.unitWidth * 2,
+    backgroundColor: '#DADEE1'
+  },
+  subClassBtn: {
+    position: 'absolute',
+    right: Constants.unitWidth * 65,
+    width: Constants.unitWidth * 120,
+    flexDirection: 'column',
+    alignItems: 'center'
+  },
+  commentCourseTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.33,
+    color: '#616161',
+  },
+  commentCourseTime: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#616161',
+    marginLeft: Constants.unitWidth * 20
+  },
+  commentCourseRow: {
+    flexDirection: 'row',
+    height: Constants.unitWidth * 44,
+    alignItems: 'center'
+  },
+  commentCourseDesc: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.03,
+    color: '#313131',
+  },
+  commentRow: {
+    marginTop: Constants.unitWidth * 25,
+    flexDirection: 'row',
+    height: Constants.unitWidth * 30,
+    alignItems: 'center'
+  },
+  starWrapper: {
+    flexDirection: 'row',
+    marginLeft: Constants.unitWidth * 20
+  },
+  star: {
+    width: Constants.unitWidth * 31,
+    height: Constants.unitWidth * 30,
+  },
+  commentContent: {
+    borderWidth: Constants.unitWidth * 1,
+    borderColor: '#E6E6E6',
+    borderRadius: Constants.unitWidth * 3,
+    width: Constants.unitWidth * 945,
+    height: Constants.unitWidth * 100,
+  },
+  commentContentWrapper: {
+    width: Constants.unitWidth * 945,
+    height: Constants.unitWidth * 100,
+    marginTop: Constants.unitWidth * 10,
+    position: 'relative'
+  },
+  commentContentNum: {
+    position: 'absolute',
+    right: Constants.unitWidth * 5,
+    bottom: Constants.unitWidth * 8,
+    color: '#999999',
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+  },
+  bigSubmitBtnTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.03,
+    color: '#ffffff',
+    fontWeight: '500'
+  },
+  bigSubmitBtn: {
+    width: Constants.unitWidth * 384,
+    height: Constants.unitWidth * 44,
+    backgroundColor: '#F9AE2B',
+    borderRadius: Constants.unitWidth * 4
+  },
+  bigSubmitBtnWrapper: {
+    marginBottom: Constants.unitWidth * 40
+  },
+  actionSheetWrapper: {
+    width: Constants.height,
+    height: Constants.unitWidth * 240,
+    backgroundColor: '#ffffff',
+    position: 'absolute',
+    // bottom: Constants.unitWidth * 49 + Constants.safeAreaBottomHeight,
+    bottom: 0
+  },
+  actionSheetCell: {
+    width: Constants.height,
+    height: Constants.unitWidth * 60,
+  },
+  actionSheetTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.03,
+    color: '#333333',
+  },
+  actionSheetCellSp: {
+    width: Constants.height,
+    height: Constants.unitWidth * 1,
+    backgroundColor: 'rgba(100, 100, 100, 0.1)'
+  }
+});
+
+module.exports = CourseCSS;

css/Home.css.ts

+import {
+  StyleSheet, Dimensions
+} from 'react-native';
+
+import Constants from '../Constants';
+
+let HomeCSS = StyleSheet.create({
+  title: {
+    fontWeight: '600',
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.93,
+    color: '#333333',
+    marginTop: Constants.unitWidth * 25,
+  },
+  cellWrapper: {
+    width: Constants.unitWidth * 462,
+    height: Constants.unitWidth * 128,
+    backgroundColor: '#ffffff',
+    marginTop: Constants.unitWidth * 10,
+    borderRadius: Constants.unitWidth * 4,
+    flexDirection: 'row',
+    shadowColor: "#000",
+    shadowOffset: {
+      width: 0,
+      height: 1,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 4,
+    marginLeft: Constants.unitWidth * 4
+  },
+  cellWrapper2: {
+    width: Constants.unitWidth * 430,
+    height: Constants.unitWidth * 128,
+    backgroundColor: '#ffffff',
+    marginTop: Constants.unitWidth * 10,
+    borderRadius: Constants.unitWidth * 4,
+    flexDirection: 'row',
+    shadowColor: "#000",
+    shadowOffset: {
+      width: 0,
+      height: 0,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 3,
+    marginRight: Constants.unitWidth * 4
+  },
+  noClass: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.867,
+    color: '#666666',
+    marginLeft: Constants.unitWidth * 5
+  },
+  hasReport: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.067,
+    color: '#313131',
+    marginLeft: Constants.unitWidth * 10,
+    marginRight: Constants.unitWidth * 20,
+  },
+  cellRight: {
+    marginRight: Constants.unitWidth * 20,
+    width: Constants.unitWidth * 120,
+    height: Constants.unitWidth * 128,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  datetime: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#616161',
+    fontWeight: '400',
+    marginTop: Constants.unitWidth * 5
+  },
+  courseTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1,
+    color: '#313131',
+    fontWeight: '500'
+  },
+  courseSubTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#616161',
+    marginTop: Constants.unitWidth * 5
+  },
+  timeTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#F58331',
+    fontWeight: '800',
+  },
+  cellLeft: {
+    width: Constants.unitWidth * 300,
+    height: Constants.unitWidth * 128,
+    flexDirection: 'column',
+    justifyContent: 'center',
+    marginLeft: Constants.unitWidth * 20
+  },
+  topWrapper: {
+    width: Constants.height - Constants.unitWidth * 80,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    paddingRight: Constants.unitWidth * 4,
+  },
+  calendarWrapper: {
+    height: Constants.unitWidth * 432,
+    width: '100%',
+    marginTop: Constants.unitWidth * 15,
+    marginBottom: Constants.unitWidth * 15,
+    borderWidth: Constants.unitWidth * 1,
+    borderColor: '#dddddd',
+    borderStyle: 'solid',
+    backgroundColor: '#ffffff',
+    shadowColor: "#000",
+    shadowOffset: {
+      width: 0,
+      height: 0,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 4,
+    flexDirection: 'row',
+    borderRadius: Constants.unitWidth * 4,
+  },
+  classCell: {
+    marginRight: Constants.unitWidth * 4,
+    width: Constants.unitWidth * 433,
+    height: Constants.unitWidth * 120,
+    borderRadius: Constants.unitWidth * 4,
+    backgroundColor: '#ffffff',
+    borderStyle: 'solid',
+    shadowColor: "#000",
+    shadowOffset: {
+      width: 0,
+      height: 0,
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 3,
+    flexDirection: 'row',
+    // marginTop: Constants.unitWidth * 10,
+    marginBottom: Constants.unitWidth * 10,
+  },
+  classCellLeft: {
+    width: Constants.unitWidth * 5,
+    height: Constants.unitWidth * 120,
+    borderTopLeftRadius: Constants.unitWidth * 4,
+    borderBottomLeftRadius: Constants.unitWidth * 4
+  },
+  classCellInfo: {
+    width: Constants.unitWidth * 250,
+    marginLeft: Constants.unitWidth * 30,
+    flexDirection: 'column',
+    justifyContent: 'center'
+  },
+  enterBtnTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1,
+    color: '#ffffff',
+    fontWeight: '400',
+  }
+});
+
+module.exports = HomeCSS;

css/Login.css.ts

+import React from 'react';
+import {
+    StyleSheet
+} from 'react-native';
+
+import Constants from '../Constants';
+
+var LoginCSS = StyleSheet.create(
+{
+    wrapper: {
+        flexDirection: 'column',
+        justifyContent: 'center',
+        alignItems: 'center',
+        width: Constants.height,
+        height: Constants.width,
+        backgroundColor: 'rgba(255, 255, 255, 0.99)',
+    },
+    logo: {
+        width: Constants.unitWidth * 226,
+        height: Constants.unitWidth * 46,
+    },
+    tabWrapper: {
+        flexDirection: 'row',
+        marginTop: Constants.unitWidth * 60
+    },
+    subTabWrapper: {
+        width: Constants.unitWidth * 148,
+    },
+    tabTxt: {
+        fontSize: Constants.baseFontSize * 1.067,
+        color: '#393939',
+        fontWeight: '500'
+    },
+    tabBtm: {
+        width: Constants.unitWidth * 36,
+        height: Constants.unitWidth * 4,
+        backgroundColor: '#F9AE2B',
+        marginTop: Constants.unitWidth * 15,
+        borderRadius: Constants.unitWidth * 2
+    },
+    mobileWrapper: {
+        marginTop: Constants.unitWidth * 30,
+        backgroundColor: '#F7F7F7',
+        width: Constants.unitWidth * 296,
+        height: Constants.unitWidth * 44,
+        borderRadius: Constants.unitWidth * 6,
+        flexDirection: 'row',
+        alignItems: 'center',
+        borderStyle: 'solid',
+        borderColor: '#F9AE2B',
+    },
+    mobile: {
+        paddingLeft: Constants.unitWidth * 36,
+        fontFamily: 'PingFangSC-Regular',
+        fontSize: Constants.baseFontSize * 0.933,
+        height: Constants.unitWidth * 36,
+        flex: 1,
+        color: '#333333'
+    },
+    areaNoWrapper: {
+        width: Constants.unitWidth * 64,
+        height: Constants.unitWidth * 36
+    },
+    areaNo: {
+        fontSize: Constants.baseFontSize * 0.933,
+        color: '#919191',
+        fontFamily: 'PingFang SC',
+    },
+    jiantou: {
+        width: Constants.unitWidth * 10,
+        height: Constants.unitWidth * 44,
+    },
+    rememberWrapper: {
+        width: Constants.unitWidth * 296,
+        flexDirection: 'row',
+        marginBottom: Constants.unitWidth * 30,
+        marginTop: Constants.unitWidth * 20,
+    },
+    rememberLeft: {
+        flex: 1,
+        height: Constants.unitWidth * 25,
+        flexDirection: 'row',
+        alignItems: 'center'
+    },
+    rememberTxt: {
+        fontFamily: 'PingFangSC-Regular',
+        fontSize: Constants.baseFontSize * 0.9333,
+        marginLeft: Constants.unitWidth * 6,
+        color: '#333333'
+    },
+    forgetTxt: {
+        color: '#F9AE2B',
+        fontFamily: 'PingFangSC-Regular',
+        fontSize: Constants.baseFontSize * 0.933,
+    },
+    loginTxt: {
+        fontFamily: 'PingFang SC',
+        fontSize: Constants.baseFontSize * 1.333,
+        color: '#ffffff',
+    },
+    loginWrapper: {
+        width: Constants.unitWidth * 296,
+        height: Constants.unitWidth * 44,
+        borderRadius: Constants.unitWidth * 4,
+        backgroundColor: '#F9AE2B',
+    },
+    codeTxt: {
+        width: Constants.unitWidth * 186,
+        height: Constants.unitWidth * 44,
+        paddingLeft: Constants.unitWidth * 10,
+        fontFamily: 'PingFangSC-Regular',
+        fontSize: Constants.baseFontSize * 0.933,
+
+    },
+    codeWrapper: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        height: Constants.unitWidth * 44,
+        marginTop: Constants.unitWidth * 10,
+        marginBottom: Constants.unitWidth * 30,
+        justifyContent: 'space-between',
+        width: Constants.unitWidth * 296
+    },
+    getCodeBtn: {
+        width: Constants.unitWidth * 100,
+        height: Constants.unitWidth * 44,
+        borderRadius: Constants.unitWidth * 6,
+        borderStyle: 'solid',
+        borderColor: '#F9AE2B',
+        borderWidth: Constants.unitWidth * 1
+    },
+    getCodeTxt: {
+        fontFamily: 'PingFang SC',
+        fontSize: Constants.baseFontSize * 0.933,
+        color: '#F9AE2B'
+    }
+});
+
+module.exports = LoginCSS;

css/Mine.css.ts

+import {
+  StyleSheet, Dimensions
+} from 'react-native';
+
+import Constants from '../Constants';
+
+let MineCSS = StyleSheet.create({
+  left: {
+    width: Constants.unitWidth * 408,
+    backgroundColor: '#f5f5f5'
+  },
+  right: {
+    flex: 1,
+    backgroundColor: '#ffffff',
+    paddingLeft: Constants.unitWidth * 55,
+    paddingRight: Constants.unitWidth * 55,
+  },
+  avatarWrapper: {
+    height: Constants.unitWidth * 290,
+    // backgroundColor: '#eee000',
+    flexDirection: 'column'
+  },
+  avatar: {
+    width: Constants.unitWidth * 86,
+    height: Constants.unitWidth * 83,
+  },
+  username: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.33,
+    color: '#313131',
+    marginTop: Constants.unitWidth * 6
+  },
+  usernameChangeTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#0FB359',
+    marginTop: Constants.unitWidth * 6
+  },
+  leftCell: {
+    height: Constants.unitWidth * 44,
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  leftCellIcon: {
+    width: Constants.unitWidth * 24,
+    height: Constants.unitWidth * 24,
+    marginLeft: Constants.unitWidth * 40
+  },
+  leftCellTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1,
+    color: '#333333',
+    marginLeft: Constants.unitWidth * 10
+  },
+  title: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.33,
+    color: '#333333',
+    marginTop: Constants.unitWidth * 25
+  },
+  rightCell: {
+    borderBottomColor: '#EEEEEE',
+    borderBottomWidth: Constants.unitWidth * 1
+  },
+  rightCellTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.033,
+    color: '#333333',
+    fontWeight: '500',
+    marginTop: Constants.unitWidth * 15
+  },
+  rightCellTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.933,
+    color: '#919191',
+  },
+  rightCellBtn: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.933,
+    color: '#F9AE2B',
+    fontWeight: '500'
+  },
+  rightCellRow: {
+    flexDirection: 'row',
+    height: Constants.unitWidth * 46,
+    alignItems: 'center',
+    justifyContent: 'space-between'
+  },
+  logoutTxt: {
+    color: '#FF0000',
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 1.033,
+    fontWeight: '500',
+  },
+  scrollViewWrapper: {
+    position: 'absolute',
+    width: '100%',
+    height: '100%',
+    backgroundColor: 'rgba(0, 0, 0, 0.2)'
+  },
+  innerWrapper: {
+    width: Constants.height,
+    height: Constants.width - (Constants.unitWidth * 49 + Constants.safeAreaBottomHeight) - (Constants.unitWidth * 44 + Constants.statusBarHeight),
+  }
+});
+
+module.exports = MineCSS;

css/Public.css.ts

+import React from 'react';
+import {
+    StyleSheet
+} from 'react-native';
+
+import Constants from '../Constants';
+
+var PublicCSS = StyleSheet.create(
+{
+    container: {
+        flex: 1,
+        position: 'relative',
+        display: 'flex',
+        backgroundColor: '#ffffff',
+        paddingLeft: Constants.unitWidth * 40,
+        paddingRight: Constants.unitWidth * 40,
+    },
+    centerAll: {
+        justifyContent: 'center',
+        alignItems: 'center'
+    },
+    headerWrapper: {
+        width: Constants.height,
+        height: Constants.unitWidth * 44 + Constants.statusBarHeight,
+        backgroundColor: '#FBFBFD',
+        flexDirection: 'row',
+        alignItems: 'center',
+        paddingLeft: Constants.unitWidth * 40,
+        paddingTop: Constants.statusBarHeight,
+        borderBottomColor: '#e4e4e4',
+        borderBottomWidth: Constants.unitWidth * 1,
+    },
+    headerAvatar: {
+        width: Constants.unitWidth * 30,
+        height: Constants.unitWidth * 30,
+    },
+    headerUsername: {
+        fontFamily: 'PingFang SC',
+        fontSize: Constants.baseFontSize * 0.933,
+        color: '#333333',
+        marginLeft: Constants.unitWidth * 7
+    },
+    mainBtn: {
+        width: Constants.unitWidth * 120,
+        height: Constants.unitWidth * 44,
+        borderRadius: Constants.unitWidth * 4
+    },
+    noMoreWrapper: {
+        height: Constants.unitWidth * 80,
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center',
+        backgroundColor: '#f4f4f4',
+        marginTop: Constants.unitWidth * 4
+    },
+    noMoreText: {
+        fontSize: Constants.baseFontSize * 1,
+        color: '#999999'
+    },
+    refreshImg: {
+        height: Constants.unitWidth * 30,
+        width: Constants.unitWidth * 30,
+        marginRight: Constants.unitWidth * 10
+    },
+    refreshWrapper: {
+        height: Constants.unitWidth * 80,
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center',
+        // width: Constants.unitWidth * 250,
+        //backgroundColor: '#f0f0f0'
+    },
+    backBtnWrapper: {
+        height: Constants.unitWidth * 44,
+        width: Constants.unitWidth * 44,
+        // backgroundColor: '#eee000'
+    },
+    backBtn: {
+        height: Constants.unitWidth * 20,
+        width: Constants.unitWidth * 20,
+    },
+    headerTitleWrapper: {
+        flex: 1,
+        alignItems: 'center',
+    },
+    headerTitle: {
+        textAlign: 'center',
+        fontSize: Constants.baseFontSize * 1.333,
+        fontWeight: '400',
+        color: '#616161',
+        fontFamily: 'PingFang SC'
+    },
+    headerBtnTitle: {
+        color: '#222222',
+        fontSize: Constants.baseFontSize * 0.933,
+    },
+    headerBtnWrapper: {
+        position: 'absolute',
+        right: Constants.unitWidth * 30,
+        height: Constants.unitWidth * 90,
+    },
+    arrowRight: {
+        width: Constants.unitWidth * 16,
+        height: Constants.unitWidth * 26,
+    },
+});
+
+module.exports = PublicCSS;

css/Reset.css.ts

+import React from 'react';
+import {
+    StyleSheet
+} from 'react-native';
+
+import Constants from '../Constants';
+
+var ResetCSS = StyleSheet.create(
+{
+    stepWrapper: {
+        width: Constants.unitWidth * 585,
+        height: Constants.unitWidth * 56,
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        position: 'relative'
+    },
+    stepCell: {
+        width: Constants.unitWidth * 60,
+        height: Constants.unitWidth * 56,
+    },
+    stepCellIcon: {
+        width: Constants.unitWidth * 30,
+        height: Constants.unitWidth * 30,
+        borderRadius: Constants.unitWidth * 15,
+        backgroundColor: '#F58331'
+    },
+    stepCellIcon2: {
+        width: Constants.unitWidth * 30,
+        height: Constants.unitWidth * 30,
+        borderRadius: Constants.unitWidth * 15,
+        backgroundColor: '#E4E4E4'
+    },
+    stepCellNum: {
+        fontFamily: 'PingFang SC',
+        fontSize: Constants.baseFontSize * 1,
+        color: '#ffffff',
+        fontWeight: '600'
+    },
+    stepCellTtitle: {
+        fontFamily: 'PingFang SC',
+        fontSize: Constants.baseFontSize * 0.7,
+        color: '#F58331',
+        fontWeight: '500'
+    },
+    stepCellTtitle2: {
+        fontFamily: 'PingFang SC',
+        fontSize: Constants.baseFontSize * 0.7,
+        color: '#E4E4E4',
+        fontWeight: '500'
+    },
+    stepLine: {
+        width: Constants.unitWidth * 500,
+        height: Constants.unitWidth * 2,
+        backgroundColor: '#E4E4E4',
+        position: 'absolute',
+        left: Constants.unitWidth * 45,
+        top: Constants.unitWidth * 15,
+        zIndex: -1
+    },
+    step1Wrapper: {
+        width: Constants.unitWidth * 300,
+        height: Constants.width - Constants.statusBarHeight,
+    },
+    stepInput: {
+        width: Constants.unitWidth * 300,
+        height: Constants.unitWidth * 40,
+        backgroundColor: '#F7F7F7',
+        borderRadius: Constants.unitWidth * 6,
+        paddingLeft: Constants.unitWidth * 10,
+        fontFamily: 'PingFangSC-Regular',
+        fontSize: Constants.baseFontSize * 0.9
+    },
+    codeWrapper: {
+        width: Constants.unitWidth * 300,
+        height: Constants.unitWidth * 40,
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        marginTop: Constants.unitWidth * 20,
+    },
+    codeInput: {
+        width: Constants.unitWidth * 180,
+        height: Constants.unitWidth * 40,
+        backgroundColor: '#F7F7F7',
+        borderRadius: Constants.unitWidth * 6,
+        paddingLeft: Constants.unitWidth * 10,
+        fontFamily: 'PingFangSC-Regular',
+        fontSize: Constants.baseFontSize * 0.9
+    },
+    codeTxt: {
+        fontFamily: 'PingFang SC',
+        fontSize: Constants.baseFontSize * 0.8,
+        color: '#F9AE2B'
+    },
+    submitBtn: {
+        width: Constants.unitWidth * 300,
+        height: Constants.unitWidth * 40,
+        backgroundColor: '#F9AE2B',
+        borderRadius: Constants.unitWidth * 6,
+    }
+});
+
+module.exports = ResetCSS;

css/Setting.css.ts

+import {
+  StyleSheet, Dimensions
+} from 'react-native';
+
+import Constants from '../Constants';
+
+let SettingCSS = StyleSheet.create({
+  settingBtn: {
+    width: Constants.unitWidth * 300,
+    height: Constants.unitWidth * 50,
+    backgroundColor: '#eee000',
+    borderRadius: Constants.unitWidth * 5
+  },
+  settingBtnTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.933,
+    color: '#27875C'
+  },
+  profileWrapper: {
+    width: Constants.unitWidth * 215,
+    height: Constants.unitWidth * 260,
+    borderRadius: Constants.unitWidth * 4,
+    backgroundColor: '#ffffff',
+  },
+  passwordWrapper: {
+    width: Constants.unitWidth * 242,
+    height: Constants.unitWidth * 242,
+    borderRadius: Constants.unitWidth * 4,
+    backgroundColor: '#ffffff',
+  },
+  profileRow: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    paddingLeft: Constants.unitWidth * 15,
+    paddingRight: Constants.unitWidth * 15,
+  },
+  profileRow2: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    width: Constants.unitWidth * 185,
+    marginLeft: Constants.unitWidth * 15,
+  },
+  borderBottom: {
+    borderStyle: 'solid',
+    borderBottomColor: 'rgba(0,0,0,0.06)',
+    borderBottomWidth: Constants.unitWidth * 1
+  },
+  profileAvatar: {
+    width: Constants.unitWidth * 32,
+    height: Constants.unitWidth * 32,
+    borderRadius: Constants.unitWidth * 16
+  },
+  profileEdit: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.667,
+    color: '#ffffff'
+  },
+  profileNickname: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.667,
+    color: '#ffffff',
+    marginLeft: Constants.unitWidth * 13
+  },
+  profileRowTitle: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.6,
+    color: '#333333',
+    width: Constants.unitWidth * 50
+  },
+  profileRowValue: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.6,
+    color: '#999999',
+    flex: 1
+  },
+  profileRowEdit: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.6,
+    color: '#0FB359',
+  },
+  modifyRow: {
+    width: Constants.unitWidth * 188,
+    height: Constants.unitWidth * 30,
+    marginLeft: Constants.unitWidth * 27,
+    flexDirection: 'row',
+    alignItems: 'center',
+    borderRadius: Constants.unitWidth * 4,
+    marginTop: Constants.unitWidth * 10
+  },
+  modifyRowHeader: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.8,
+    color: '#333333',
+  },
+  passwordWrapperValue: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.7,
+    color: '#333333',
+    width: Constants.unitWidth * 158,
+    height: Constants.unitWidth * 30
+  },
+  submitTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.867,
+    color: '#ffffff',
+    fontWeight: '500',
+  },
+  mobileWrapper: {
+    width: Constants.unitWidth * 300,
+    height: Constants.unitWidth * 242,
+    borderRadius: Constants.unitWidth * 4,
+    backgroundColor: '#ffffff',
+  },
+  modifyRow2: {
+    width: Constants.unitWidth * 260,
+    height: Constants.unitWidth * 30,
+    marginLeft: Constants.unitWidth * 20,
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginTop: Constants.unitWidth * 10,
+    borderRadius: Constants.unitWidth * 5
+  },
+  mobileTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.733,
+    color: '#999999',
+    fontWeight: '500',
+  },
+  mobileBtn: {
+    width: Constants.unitWidth * 90,
+    height: Constants.unitWidth * 27,
+    backgroundColor: '#f1f1f1',
+    borderRadius: Constants.unitWidth * 4,
+    borderColor: '#dddddd',
+  },
+  mobileBtnTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.73,
+    color: '#333333',
+  },
+  mobileSubmitTxt: {
+    fontFamily: 'PingFang SC',
+    fontSize: Constants.baseFontSize * 0.73,
+    color: '#FFFFFF',
+  },
+  mobileSubmitBtn: {
+    width: Constants.unitWidth * 100,
+    height: Constants.unitWidth * 27,
+    backgroundColor: '#F9AE2B',
+    borderRadius: Constants.unitWidth * 4,
+  }
+});
+
+module.exports = SettingCSS;

css/Tabbar.css.ts

+import React from 'react';
+import {
+  StyleSheet
+} from 'react-native';
+
+import Constants from '../Constants';
+
+var TabbarCSS = StyleSheet.create(
+    {
+      tabbar: {
+        flexDirection: 'row',
+        justifyContent: 'space-around',
+        height: Constants.unitWidth * 49 + Constants.safeAreaBottomHeight,
+        paddingBottom: Constants.safeAreaBottomHeight,
+        backgroundColor: '#ffffff',
+        borderTopColor: '#E1E1E1',
+        borderTopWidth: Constants.unitWidth * 1
+      },
+      btnWrapper: {
+        flex: 1,
+        alignItems: 'center'
+      },
+      itemWrapper: {
+        width: Constants.unitWidth * 200,
+        height: Constants.unitWidth * 49,
+        position: 'relative',
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'center',
+      },
+      title: {
+        fontSize: Constants.baseFontSize * 0.867,
+        color: '#333333',
+      },
+      titleActive: {
+        fontSize: Constants.baseFontSize * 0.9333,
+        color: '#F9AE2B',
+      },
+    });
+
+module.exports = TabbarCSS;

css/Test.css.ts

+import {
+  StyleSheet, Dimensions
+} from 'react-native';
+
+import Constants from '../Constants';
+
+const dimensions = {
+  width: Dimensions.get('window').width,
+  height: Dimensions.get('window').height,
+};
+
+let TestCSS = StyleSheet.create({
+  max: {
+    flex: 1,
+  },
+  remoteContainer: {
+    width: '100%',
+    height: 250,
+    position: 'absolute',
+    top: 5,
+    left: 300,
+    backgroundColor: '#eee000'
+  },
+  remote: {
+    width: 150,
+    height: 150,
+    marginHorizontal: 2.5,
+  },
+  noUserText: {
+    paddingHorizontal: 10,
+    paddingVertical: 5,
+    color: '#0093E9',
+  },
+  btnWrapper: {
+    width: Constants.unitWidth * 900,
+    height: Constants.unitWidth * 200,
+    backgroundColor: '#eee000',
+    marginTop: Constants.unitWidth * 80,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-around'
+  },
+  btn: {
+    width: Constants.unitWidth * 200,
+    height: Constants.unitWidth * 80,
+    borderRadius: Constants.unitWidth * 40,
+    backgroundColor: '#ee0000',
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  btnTxt: {
+    color: '#ffffff',
+    fontSize: Constants.baseFontSize * 1.2
+  },
+  myVideoWrapper: {
+    width: Constants.unitWidth * 300,
+    height: Constants.unitWidth * 300,
+  },
+  frameWrapper: {
+    width: Constants.unitWidth * 1536,
+    flexDirection: 'row'
+  }
+});
+
+module.exports = TestCSS;