1import StatusBar from '@/components/base/statusBar'; 2import globalStyle from '@/constants/globalStyle'; 3import useOrientation from '@/hooks/useOrientation'; 4import React, {useEffect} from 'react'; 5import {StyleSheet, View} from 'react-native'; 6import {SafeAreaView} from 'react-native-safe-area-context'; 7import Background from './components/background'; 8import Bottom from './components/bottom'; 9import Content from './components/content'; 10import Lyric from './components/content/lyric'; 11import NavBar from './components/navBar'; 12import Config from '@/core/config'; 13import {activateKeepAwakeAsync, deactivateKeepAwake} from 'expo-keep-awake'; 14 15export default function MusicDetail() { 16 const orientation = useOrientation(); 17 18 useEffect(() => { 19 const needAwake = Config.get('setting.basic.musicDetailAwake'); 20 if (needAwake) { 21 activateKeepAwakeAsync(); 22 } 23 return () => { 24 if (needAwake) { 25 deactivateKeepAwake(); 26 } 27 }; 28 }, []); 29 30 return ( 31 <> 32 <Background /> 33 <SafeAreaView style={globalStyle.fwflex1}> 34 <StatusBar backgroundColor={'transparent'} /> 35 <View style={style.bodyWrapper}> 36 <View style={globalStyle.flex1}> 37 <NavBar /> 38 <Content /> 39 <Bottom /> 40 </View> 41 {orientation === 'horizontal' ? ( 42 <View style={globalStyle.flex1}> 43 <Lyric /> 44 </View> 45 ) : null} 46 </View> 47 </SafeAreaView> 48 </> 49 ); 50} 51 52const style = StyleSheet.create({ 53 bodyWrapper: { 54 width: '100%', 55 flex: 1, 56 flexDirection: 'row', 57 }, 58}); 59