Merge pull request react-native-elements#35 from tolu360/master

Support for disabled buttons
flyingcircle · Sep 25, 2016 · 50af533 · 50af533
2 parents c7ee0e8 + dfaed34
commit 50af533
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 4 deletions.
diff --git a/Readme.MD b/Readme.MD
@@ -147,6 +147,7 @@ import { Button } from 'react-native-elements'
 | fontSize | 18 | number | font size (optional)  |
 | underlayColor | transparent | string(color) | underlay color for button press (optional)  |
 | raised | false | boolean | flag to add raised button styling (optional)  |
+| disabled | false | boolean | prop to indicate button is disabled (optional) |
 
 
 ## Social Icons & Buttons

diff --git a/src/buttons/Button.js b/src/buttons/Button.js
@@ -31,6 +31,7 @@ const Button = ({
   textStyle,
   small,
   iconRight,
+  disabled,
   fontWeight,
   fontFamily}) => {
   let iconElement
@@ -55,7 +56,8 @@ const Button = ({
   return (
     <TouchableHighlight
       underlayColor={underlayColor || 'transparent'}
-      onPress={onPress || log}>
+      onPress={onPress || log}
+      disabled={disabled || false}>
       <View
         style={[
           styles.button,
@@ -64,7 +66,7 @@ const Button = ({
           secondary3 && {backgroundColor: colors.secondary3},
           primary1 && {backgroundColor: colors.primary1},
           primary2 && {backgroundColor: colors.primary2},
-          backgroundColor && {backgroundColor},
+          backgroundColor && {backgroundColor: disabled ? colors.disabled : backgroundColor},
           borderRadius && {borderRadius},
           buttonStyle && buttonStyle,
           raised && styles.raised,
@@ -110,7 +112,8 @@ Button.propTypes = {
   fontSize: PropTypes.number,
   underlayColor: PropTypes.string,
   raised: PropTypes.bool,
-  textStyle: PropTypes.any
+  textStyle: PropTypes.any,
+  disabled: PropTypes.bool
 }
 
 styles = StyleSheet.create({

diff --git a/src/config/colors.js b/src/config/colors.js
@@ -13,5 +13,6 @@ export default {
   grey5: '#e1e8ee',
   dkGreyBg: '#232323',
   greyOutline: '#cbd2d9',
-  searchBg: '#303337'
+  searchBg: '#303337',
+  disabled: '#dadee0',
 }