React-native-icon-button NPM

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.

Demo

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'
  }
  
});

react-component react-native ios button component icon

@infinitebrahmanuniverse/nolb-react-native-i @everything-registry/sub-chunk-2580 @zalastax/nolb-react-native-i

1.0.0

9 years ago