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