xref: /MusicFree/src/pages/musicDetail/components/navBar.tsx (revision e650bfb34226e2a09d15cbf7832c4805a87cd60e) 
1import React from 'react';
2import {StyleSheet, Text, View} from 'react-native';
3import rpx from '@/utils/rpx';
4import MusicQueue from '@/core/musicQueue';
5import {useNavigation} from '@react-navigation/native';
6import Tag from '@/components/base/tag';
7import {fontSizeConst, fontWeightConst} from '@/constants/uiConst';
8import Share from 'react-native-share';
9import {B64Asset} from '@/constants/assetsConst';
10import IconButton from '@/components/base/iconButton';
11
12export default function NavBar() {
13    const navigation = useNavigation();
14    const musicItem = MusicQueue.useCurrentMusicItem();
15    // const {showShare} = useShare();
16
17    return (
18        <View style={styles.container}>
19            <IconButton
20                name="arrow-left"
21                sizeType={'normal'}
22                color="white"
23                style={styles.button}
24                onPress={() => {
25                    navigation.goBack();
26                }}
27            />
28            <View style={styles.headerContent}>
29                <Text numberOfLines={1} style={styles.headerTitleText}>
30                    {musicItem?.title ?? '无音乐'}
31                </Text>
32                <View style={styles.headerDesc}>
33                    <Text style={styles.headerArtistText} numberOfLines={1}>
34                        {musicItem?.artist}
35                    </Text>
36                    {musicItem?.platform ? (
37                        <Tag tagName={musicItem.platform} />
38                    ) : null}
39                </View>
40            </View>
41            <IconButton
42                name="share"
43                color="white"
44                sizeType={'normal'}
45                style={styles.button}
46                onPress={async () => {
47                    try {
48                        await Share.open({
49                            type: 'image/jpeg',
50                            title: 'MusicFree-一个插件化的免费音乐播放器',
51                            message: 'MusicFree-一个插件化的免费音乐播放器',
52                            url: B64Asset.share,
53                            subject: 'MusicFree分享',
54                        });
55                    } catch {}
56                }}
57            />
58        </View>
59    );
60}
61
62const styles = StyleSheet.create({
63    container: {
64        width: '100%',
65        height: rpx(150),
66        flexDirection: 'row',
67        alignItems: 'center',
68        justifyContent: 'space-between',
69    },
70    button: {
71        marginHorizontal: rpx(24),
72    },
73    headerContent: {
74        flex: 1,
75        height: rpx(150),
76        justifyContent: 'center',
77        alignItems: 'center',
78    },
79    headerTitleText: {
80        color: 'white',
81        fontWeight: fontWeightConst.semibold,
82        fontSize: fontSizeConst.title,
83        marginBottom: rpx(12),
84        includeFontPadding: false,
85    },
86    headerDesc: {
87        height: rpx(32),
88        flexDirection: 'row',
89        alignItems: 'center',
90        paddingHorizontal: rpx(40),
91    },
92    headerArtistText: {
93        color: 'white',
94        fontSize: fontSizeConst.subTitle,
95        includeFontPadding: false,
96    },
97});
98