react-native-modal-select
Version:
Simple select component for iOS and Android
69 lines (63 loc) • 4.78 kB
JavaScript
import React from 'react';
import { View } from 'react-native';
import { MaterialIcons, Entypo, Ionicons, MaterialCommunityIcons, Foundation, FontAwesome5, AntDesign, FontAwesome, EvilIcons, Feather, Octicons, SimpleLineIcons, Zocial } from '@expo/vector-icons'
const Icon = props => {
let icon
let bgColor = props.itemColor
let iconColor = props.iconColor
let iconType = props.iconType
let iconPadding = props.iconPadding
let iconName = props.iconName
let iconSize = props.iconSize
let inputHeight = props.inputHeight
switch (iconType) {
case "material":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><MaterialIcons name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "octicons":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><Octicons name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "zocial":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><Zocial name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "simple":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><SimpleLineIcons name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "evil":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><EvilIcons name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "feather":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><Feather name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "entypo":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><Entypo name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "community":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><MaterialCommunityIcons name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "foundation":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><Foundation name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "fontawesome5":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><FontAwesome5 name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "fontawesome":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><FontAwesome name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "antdesign":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><AntDesign name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
case "ionicons":
icon = <View style={{ alignItems: 'center', justifyContent: 'center', backgroundColor: bgColor, marginLeft: iconPadding, marginRight: iconPadding, height: '100%' }}><Ionicons name={ iconName } size={ iconSize } color={ iconColor } /></View>
break;
default:
icon = <View style={{ marginLeft: iconPadding, marginRight: iconPadding }}></View>
break;
}
return (
<View style={{ height: inputHeight, alignItems: 'center' }}>
{ icon }
</View>
)
}
export default Icon