1import React from 'react'; 2import rpx from '@/utils/rpx'; 3import {StyleSheet, Text, View} from 'react-native'; 4import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; 5import {fontSizeConst} from '@/constants/uiConst'; 6import useColors from '@/hooks/useColors'; 7 8interface IToastBaseProps { 9 text: string; 10 iconName: string; 11 iconColor: string; 12} 13function ToastBase(props: IToastBaseProps) { 14 const {text, iconName, iconColor} = props; 15 const colors = useColors(); 16 return ( 17 <View style={styles.toastBasic}> 18 <Icon 19 style={[ 20 styles.icon, 21 { 22 backgroundColor: colors.backdrop, 23 }, 24 ]} 25 name={iconName} 26 color={iconColor ?? colors.text} 27 /> 28 <Text style={[styles.text, {color: colors.text}]} numberOfLines={2}> 29 {text} 30 </Text> 31 </View> 32 ); 33} 34 35const toastConfig = { 36 success: ({text1}: any) => ( 37 <ToastBase text={text1} iconName="check-circle" iconColor="#457236" /> 38 ), 39 warn: ({text1}: any) => ( 40 <ToastBase text={text1} iconName="alert-circle" iconColor="#de7622" /> 41 ), 42}; 43 44export default toastConfig; 45 46const styles = StyleSheet.create({ 47 toastBasic: { 48 width: rpx(600), 49 height: rpx(84), 50 borderRadius: rpx(48), 51 backgroundColor: '#fbeee2', 52 flexDirection: 'row', 53 alignItems: 'center', 54 }, 55 text: { 56 fontSize: fontSizeConst.content, 57 includeFontPadding: false, 58 marginLeft: fontSizeConst.tag, 59 width: rpx(488), 60 color: '#333333', 61 }, 62 icon: { 63 fontSize: fontSizeConst.appbar, 64 includeFontPadding: false, 65 marginLeft: fontSizeConst.content, 66 }, 67}); 68