React native module to add a button icon (with text or not)
$ npm install react-native-bm-icon-button --save
$ react-native link react-native-bm-icon-button
Start by adding
import BmIconButton from 'react-native-bm-icon-button';
then use like this :
<BmIconButton
style={styles.menuButtonStyl}
iconStyle={styles.menuButtonIconStyle}
textStyle={styles.menuButtonTextStyle}
text={this.props.module.title}
icon={require('../icons/myicon.png')}
action={this.onClick}/>
Prop | Default | Type | Description | Optional |
---|---|---|---|---|
style | width: 100% |
style object |
Change the default style of the base button | yes |
iconStyle | - | style object |
Change the default style of the icon in the button | yes |
textStyle | - | style object |
Change the default style of the text in the button | yes |
text | - | string |
Add a text under the icon button ( can be restyle ) | yes |
icon | - | icon like require('../myicon.png') or variable contain it |
Add the icon to the button | yes |
action | - | function |
add a callback function to the button | yes |
By default all the properties are optional but if you want to use see it I propose to add at least one of these properties : style
, text
, icon
By default the background take the full width of the screen BUT if you want to crop it to the size of the icon add the style propertie with following lines :
left: 0,
right: 0,
alignSelf:'center'
Enjoy :)