react-native-bpk-component-icon
Backpack React Native icon component.
Installation
npm install react-native-bpk-component-icon --save-dev
iOS installation
The most reliable way to install the file on iOS is manually, three simple steps are required:
-
update the
Info.plist
file by adding<key>UIAppFonts</key> <array> <string>BpkIcon.ttf</string> </array>
if the entry
UIAppFonts
it's already there, just add<string>BpkIcon.ttf</string>
inside the<array>
like so<array> ... existing entries <string>BpkIcon.ttf</string> </array>
-
In the
Build Phases
of your project, in the sectionCopy Bundle Resources
add a reference to theBpkIcon.ttf
file path like/path/to/node_modules/bpk-svgs/dist/font/BpkIcon.ttf
-
Rebuild the app
Android installation
This method has the advantage of fonts being copied from this module at build time so that the fonts and JS are always in sync, making upgrades painless.
Edit android/app/build.gradle
( NOT android/build.gradle
) and add the following:
apply from: "node_modules/react-native-bpk-component-icon/fonts.gradle"
Usage
;;;; const styles = StyleSheet; { return <View style=stylescontainer> <BpkIcon icon=iconsbeer style= color: colorSkyBlue small /> <BpkIcon icon=iconsbeer style= color: colorSkyBlue /> </View> ; }
withRtlSupport
HOC
;;;; const BpkIconwithRtlSupport = ; const styles = StyleSheet; { return <View style=stylescontainer> <BpkIconwithRtlSupport icon=iconsbeer style= color: colorSkyBlue /> </View> ; }
Props
Property | PropType | Required | Default Value |
---|---|---|---|
icon | string | true | - |
small | bool | false | false |