react-native-icon-button

A simple button component allowing you to create customisable and visually appealing buttons, utilising images, text or a combination of both depending on the desired result.

Installation

To install simply enter the following...

$ npm install react-native-icon-button

Then require it in your project wherever you need it...

var Button = require('react-native-icon-button');

Properties

Prop	Type	Opt/Required	Default	Note
icon	Image	Optional	N/A	The image resource (must be required directly).
iconSize	Number	Optional	N/A	Scales the icon / image to the specified size.
text	String	Optional	N/A	The text that will be displayed on the button.
onPress	Function	Required	N/A	A function that will be called when the accordion is pressed.
underlayColor	String	Optional	transparent	The underlay color of the TouchableHighlight.
style	Object	Optional	(See Example)	Custom button styling, colors, border radius etc...

Example

  
var Button = require('react-native-icon-button');
 
var testing = React.createClass({
 
  action: function() {
    //Do stuff! :)
  },
  
  render: function() {
    return (
      <View style={styles.container}>
        <Button 
          style={styles.button}
          onPress={this.action}
          icon={require('image!my_icon')}
          iconSize={20}
          color={"white"}
          text={"Press me!"}
        />
      </View>
    );
  }
  
});
 
var styles = StyleSheet.create({
 
  button: {
  	padding: 10,
  	borderRadius: 5,
  	backgroundColor: '#272822',
  	color: 'white'
  }
  
});