1import React from 'react'; 2import {Appbar} from 'react-native-paper'; 3import {StyleSheet, Text, View} from 'react-native'; 4import rpx from '@/utils/rpx'; 5import {useNavigation} from '@react-navigation/native'; 6import getStatusBarHeight from '@/utils/getStatusBarHeight'; 7import usePrimaryColor from '@/hooks/usePrimaryColor'; 8 9interface IProps {} 10export default function (props: IProps) { 11 const navigation = useNavigation(); 12 const primaryColor = usePrimaryColor(); 13 14 return ( 15 <View style={[style.wrapper, {backgroundColor: primaryColor}]}> 16 <Appbar.Header style={[style.appbar, {backgroundColor: primaryColor}]}> 17 <Appbar.BackAction 18 onPress={() => { 19 navigation.goBack(); 20 }} 21 /> 22 <Appbar.Content title="歌单" /> 23 <Appbar.Action icon="magnify" onPress={() => {}} /> 24 <Appbar.Action icon={'dots-vertical'} onPress={() => {}} /> 25 </Appbar.Header> 26 </View> 27 ); 28} 29 30const style = StyleSheet.create({ 31 wrapper: { 32 paddingTop: getStatusBarHeight(), 33 }, 34 appbar: { 35 shadowColor: 'transparent', 36 flexDirection: 'row', 37 width: rpx(750), 38 }, 39}); 40