Button View Source View Guidelines
The button component renders a touchable button with consumes the full width of it's parent container.
Usage
...
import { Button } from 'react-native-material-design';
render() {
return (
<View>
<Button value="NORMAL FLAT" onPress={()=> console.log("I pressed a flat button")} />
<Button value="NORMAL RAISED" raised={true} onPress={()=> console.log("I pressed a raised button")} />
</View>
);
}
...
Props
Prop | Type | Description | Required | Default |
---|---|---|---|---|
value | string | The text which is rendered inside of the button | true | |
theme | THEME_NAME | false | light | |
primary | PRIMARY_COLORS | false | PRIMARY | |
overrides textColor backgroundColor rippleColor |
object string string string |
An object to override any colors Override the text color of the button Override the background color of the button Override the ripple color of the button |
false |
|
disabled | bool | Whether to render the button as disabled. This will prevent any onPress props being triggered | false | false |
onPress | func | A function which is called when the touch of the button is released | false | |
onLongPress | func | A function which is called when the touch of the button is held for a long duration | false |
Examples
Group Buttons
<View style=>
<View style=>
<Button text='Button A' raised={true} />
</View>
<View style=>
<Button text='Button B' raised={true} />
</View>
</View>