Skip to content

Commit 5b17b32

Browse files
kdastanide
authored andcommitted
Disabled prop (#74)
* docs(README): add disabled prop usage example * update Readme
1 parent bafaf75 commit 5b17b32

File tree

1 file changed

+40
-0
lines changed

1 file changed

+40
-0
lines changed

README.md

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,46 @@ export default class ExampleComponent extends Component {
3232

3333
The React packager will include the Button component in your app's JS package and make it available for your app to use.
3434

35+
## Disabled prop usage
36+
37+
You can control a button's state by setting `disabled` prop value in this way:
38+
39+
```js
40+
import React, { Component } from 'react';
41+
import Button from 'react-native-button';
42+
43+
export default class ExampleComponent extends Component {
44+
constructor(props, context) {
45+
super(props, context);
46+
this.state = {
47+
isDisabled: false
48+
}
49+
}
50+
_handlePress() {
51+
this.setState({
52+
isDisabled: true
53+
});
54+
console.log('Now, button disabled');
55+
}
56+
render() {
57+
const { isDisabled } = this.state;
58+
return (
59+
<Button
60+
style={{ fontSize: 20, color: 'white' }}
61+
styleDisabled={{ color: 'white' }}
62+
disabled={isDisabled}
63+
containerStyle={{ padding: 10, height: 45, overflow: 'hidden', borderRadius: 4, backgroundColor: 'aqua' }}
64+
disabledContainerStyle={{ backgroundColor: 'pink' }}
65+
onPress={() => this._handlePress()}
66+
>
67+
Press Me!
68+
</Button>
69+
);
70+
}
71+
};
72+
73+
```
74+
3575
## Container Style
3676

3777
You can make a button with rounded corners like this:

0 commit comments

Comments
 (0)