1import React from 'react'; 2import { StyleSheet} from 'react-native'; 3import rpx from '@/utils/rpx'; 4import {useNavigation, useRoute, useTheme} from '@react-navigation/native'; 5import {Appbar} from 'react-native-paper'; 6import settingTypes from './settingTypes'; 7import {fontSizeConst, fontWeightConst} from '@/constants/uiConst'; 8import ThemeText from '@/components/themeText'; 9import { SafeAreaView } from 'react-native-safe-area-context'; 10import StatusBar from '@/components/statusBar'; 11 12interface ISettingProps {} 13export default function Setting(props: ISettingProps) { 14 const route = useRoute<any>(); 15 const navigation = useNavigation(); 16 const type: string = route.params?.type; 17 const settingItem = settingTypes[type]; 18 19 const {colors} = useTheme(); 20 21 return ( 22 <SafeAreaView style={style.wrapper}> 23 <StatusBar></StatusBar> 24 <Appbar style={[style.appbar, {backgroundColor: colors.primary}]}> 25 <Appbar.BackAction 26 color={colors.text} 27 onPress={() => { 28 navigation.goBack(); 29 }}></Appbar.BackAction> 30 <Appbar.Header style={style.header}> 31 <ThemeText style={style.header}>{settingItem?.title}</ThemeText> 32 </Appbar.Header> 33 </Appbar> 34 <settingItem.component></settingItem.component> 35 </SafeAreaView> 36 ); 37} 38 39const style = StyleSheet.create({ 40 wrapper: { 41 width: rpx(750), 42 flex: 1 43 }, 44 appbar: { 45 shadowColor: 'transparent', 46 backgroundColor: '#2b333eaa' 47 }, 48 header: { 49 backgroundColor: 'transparent', 50 shadowColor: 'transparent', 51 fontSize: fontSizeConst.big, 52 fontWeight: fontWeightConst.bold, 53 }, 54}); 55