React native icon picker (Only For Expo )
A cross platform react native icon picker component for android and ios. It includes vector icon and it is easily customizable. Its includes
- AntDesign
- Entypo
- FontAwesome
- FontAwesome5
- Fontisto
- Ionicons
- MaterialCommunityIcons
- MaterialIcons
we are working for native version. we update you soon...
Screen Capture
Installation
npm install react-native-icon-picker
Usage
Step 1
npm install react-native-icon-picker
Step 2
import IconPicker from "react-native-icon-picker";
Step 3
<IconPicker
showIconPicker={this.state.showIconPicker}
toggleIconPicker={() => this.setState({ showIconPicker: !this.state.showIconPicker })}
iconDetails={[
{ family: "AntDesign", color: "blue", icons: ["wallet"] },
{ family: "Entypo", icons: ["wallet"] },
{ family: "FontAwesome", icons: ["google-wallet"] },
{ family: "FontAwesome5", icons: ["wallet"] },
{ family: "Fontisto", icons: ["wallet"] },
{
family: "MaterialCommunityIcons",
icons: ["wallet-membership"]
},
{ family: "MaterialIcons", icons: ["wallet-travel"] }
]
}
onSelect={(icon) => console.log(icon)}
content={<MaterialIcons name="category" size={32} />}
/>
Available Props
Name | Type | Default | Description |
---|---|---|---|
headerTitle | String | Select Icon | Header Title |
showIconPicker | bool | false | show the icon picker |
onSelect | function | REQUIRED | Called when the icon is selected |
toggleIconPicker | function | REQUIRED | Called when the user taps the close button |
iconDetails | Array | REQUIRED | Icon Details |
selectedIcon | obect | {} | passes the selected icon object |
selectedIconContainerStyle | obect | {} | style applied on selected icon container |
content | any | Open Iconpicker | Icon picker Content |
ClickMe
Icon ListAbove link contain all the icon list
License
MIT
Author
Kawal Jain