Skip to content

Commit

Permalink
Fix DrawerLayoutAndroid not able to set opacity
Browse files Browse the repository at this point in the history
Summary:I'm just cleaning up my branch, but please refer to #6948.
Closes #7012

Differential Revision: D3189533

fb-gh-sync-id: 3953b1373ddcfd0fe29c0011c943855b55e1f181
fbshipit-source-id: 3953b1373ddcfd0fe29c0011c943855b55e1f181
  • Loading branch information
holyxiaoxin authored and Facebook Github Bot 5 committed Apr 17, 2016
1 parent 159f657 commit 7851572
Showing 1 changed file with 24 additions and 2 deletions.
26 changes: 24 additions & 2 deletions Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,18 @@ var DrawerLayoutAndroid = React.createClass({
'none', // default
'on-drag',
]),
/**
* Specifies the background color of the drawer. The default value is white.
* If you want to set the opacity of the drawer, use rgba. Example:
*
* ```
* return (
* <DrawerLayoutAndroid drawerBackgroundColor="rgba(0,0,0,0.5)">
* </DrawerLayoutAndroid>
* );
* ```
*/
drawerBackgroundColor: ColorPropType,
/**
* Specifies the side of the screen from which the drawer will slide in.
*/
Expand Down Expand Up @@ -141,6 +153,12 @@ var DrawerLayoutAndroid = React.createClass({

mixins: [NativeMethodsMixin],

getDefaultProps: function(): Object {
return {
drawerBackgroundColor: 'white',
};
},

getInitialState: function() {
return {statusBarBackgroundColor: undefined};
},
Expand All @@ -160,7 +178,12 @@ var DrawerLayoutAndroid = React.createClass({
render: function() {
var drawStatusBar = Platform.Version >= 21 && this.props.statusBarBackgroundColor;
var drawerViewWrapper =
<View style={[styles.drawerSubview, {width: this.props.drawerWidth}]} collapsable={false}>
<View
style={[
styles.drawerSubview,
{width: this.props.drawerWidth, backgroundColor: this.props.drawerBackgroundColor}
]}
collapsable={false}>
{this.props.renderNavigationView()}
{drawStatusBar && <View style={styles.drawerStatusBar} />}
</View>;
Expand Down Expand Up @@ -283,7 +306,6 @@ var styles = StyleSheet.create({
position: 'absolute',
top: 0,
bottom: 0,
backgroundColor: 'white',
},
statusBar: {
height: StatusBar.currentHeight,
Expand Down

0 comments on commit 7851572

Please sign in to comment.