1import React from 'react'; 2import {StyleSheet, Text, View} from 'react-native'; 3import rpx from '@/utils/rpx'; 4import {useNavigation, useRoute, useTheme} from '@react-navigation/native'; 5import {Appbar} from 'react-native-paper'; 6import getStatusBarHeight from '@/utils/getStatusBarHeight'; 7import settingTypes from './settingTypes'; 8import {fontSizeConst, fontWeightConst} from '@/constants/uiConst'; 9import ThemeText from '@/components/themeText'; 10import useTextColor from '@/hooks/useTextColor'; 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 <> 23 <View style={style.wrapper}> 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 </View> 35 <settingItem.component></settingItem.component> 36 </> 37 ); 38} 39 40const style = StyleSheet.create({ 41 wrapper: { 42 width: rpx(750), 43 backgroundColor: '#2b333eaa', 44 paddingTop: getStatusBarHeight(), 45 }, 46 appbar: { 47 shadowColor: 'transparent', 48 }, 49 header: { 50 backgroundColor: 'transparent', 51 shadowColor: 'transparent', 52 fontSize: fontSizeConst.big, 53 fontWeight: fontWeightConst.bold, 54 }, 55}); 56