From 7851572b405d22dd885c291de21d5b1a30d7c92c Mon Sep 17 00:00:00 2001
From: Jia Rong Lim <jr.loves.maths@gmail.com>
Date: Sat, 16 Apr 2016 22:44:25 -0700
Subject: [PATCH] Fix DrawerLayoutAndroid not able to set opacity

Summary:I'm just cleaning up my branch, but please refer to https://github.com/facebook/react-native/pull/6948.
Closes https://github.com/facebook/react-native/pull/7012

Differential Revision: D3189533

fb-gh-sync-id: 3953b1373ddcfd0fe29c0011c943855b55e1f181
fbshipit-source-id: 3953b1373ddcfd0fe29c0011c943855b55e1f181
---
 .../DrawerLayoutAndroid.android.js            | 26 +++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js b/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js
index 85a5ebb633c879..687c270be25f82 100644
--- a/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js
+++ b/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js
@@ -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.
      */
@@ -141,6 +153,12 @@ var DrawerLayoutAndroid = React.createClass({
 
   mixins: [NativeMethodsMixin],
 
+  getDefaultProps: function(): Object {
+    return {
+      drawerBackgroundColor: 'white',
+    };
+  },
+
   getInitialState: function() {
     return {statusBarBackgroundColor: undefined};
   },
@@ -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>;
@@ -283,7 +306,6 @@ var styles = StyleSheet.create({
     position: 'absolute',
     top: 0,
     bottom: 0,
-    backgroundColor: 'white',
   },
   statusBar: {
     height: StatusBar.currentHeight,