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