1/** 2 * Sample React Native App 3 * https://github.com/facebook/react-native 4 * 5 * Generated with the TypeScript template 6 * https://github.com/react-native-community/react-native-template-typescript 7 * 8 * @format 9 */ 10 11import React from 'react'; 12import {StatusBar, StyleSheet, View} from 'react-native'; 13 14import NavBar from './components/navBar'; 15import Operations from './components/operations'; 16import MySheets from './components/mySheets'; 17import MusicBar from '@/components/musicBar'; 18import {Divider} from 'react-native-paper'; 19import {createDrawerNavigator} from '@react-navigation/drawer'; 20import HomeDrawer from './components/drawer'; 21import getStatusBarHeight from '@/utils/getStatusBarHeight'; 22import rpx from '@/utils/rpx'; 23 24function Home() { 25 return ( 26 <View style={styles.appWrapper}> 27 <StatusBar></StatusBar> 28 <NavBar></NavBar> 29 <Divider></Divider> 30 <Operations></Operations> 31 <MySheets></MySheets> 32 <MusicBar></MusicBar> 33 </View> 34 ); 35} 36 37const LeftDrawer = createDrawerNavigator(); 38export default function App() { 39 return ( 40 <LeftDrawer.Navigator 41 screenOptions={{ 42 headerShown: false, 43 drawerStyle: { 44 width: rpx(600), 45 }, 46 }} 47 initialRouteName="HOME-MAIN" 48 drawerContent={props => <HomeDrawer {...props}></HomeDrawer>}> 49 <LeftDrawer.Screen name="HOME-MAIN" component={Home}></LeftDrawer.Screen> 50 </LeftDrawer.Navigator> 51 ); 52} 53 54const styles = StyleSheet.create({ 55 appWrapper: { 56 flexDirection: 'column', 57 height: '100%', 58 paddingTop: getStatusBarHeight(), 59 }, 60}); 61