1import React from 'react'; 2import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; 3import {ColorKey, iconSizeConst, colorMap} from '@/constants/uiConst'; 4import {useTheme} from 'react-native-paper'; 5import {IconProps} from 'react-native-vector-icons/Icon'; 6import {TapGestureHandler} from 'react-native-gesture-handler'; 7 8interface IIconButtonProps { 9 name: string; 10 style?: IconProps['style']; 11 size?: keyof typeof iconSizeConst; 12 fontColor?: ColorKey; 13 onPress?: () => void; 14} 15export function IconButtonWithGesture(props: IIconButtonProps) { 16 const {name, size = 'normal', fontColor = 'normal', onPress, style} = props; 17 const theme = useTheme(); 18 const textSize = iconSizeConst[size]; 19 const color = theme.colors[colorMap[fontColor]]; 20 return ( 21 <TapGestureHandler onActivated={onPress}> 22 <Icon 23 name={name} 24 color={color} 25 style={[ 26 {height: '100%', minWidth: textSize, textAlignVertical: 'center'}, 27 style, 28 ]} 29 size={textSize}></Icon> 30 </TapGestureHandler> 31 ); 32} 33 34export default function IconButton(props: IIconButtonProps) { 35 const {name, size = 'normal', fontColor = 'normal', onPress, style} = props; 36 const theme = useTheme(); 37 const textSize = iconSizeConst[size]; 38 const color = theme.colors[colorMap[fontColor]]; 39 return ( 40 <Icon 41 name={name} 42 color={color} 43 onPress={onPress} 44 style={[ 45 {height: '100%', minWidth: textSize, textAlignVertical: 'center'}, 46 style, 47 ]} 48 size={textSize}></Icon> 49 ); 50} 51