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.ts"; 13import { activateKeepAwakeAsync, deactivateKeepAwake } from "expo-keep-awake"; 14 15export default function MusicDetail() { 16 const orientation = useOrientation(); 17 18 useEffect(() => { 19 const needAwake = Config.getConfig('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