mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-04-23 03:50:11 +08:00
Add support for elevation in DrawerLayoutAndroid
Summary:It didn't work for a few reason. First, the drawer view NEEDS to have a background color or no shadow will ever render. Second, we need to use the `setDrawerElevation` method instead of `setElevation` for DrawerLayout. Finally we need to actually pass the style value (maybe we could just pass elevation but I don't really think it can cause any issues) down to the native component as it is not the case at the moment. I also added a default style to elevation of 16 which is the standard for material design according to https://www.google.com/design/spec/patterns/navigation-drawer.html#navigation-drawer-specs. I could also default it to 0 so it keeps the same appearance as before but I think it looks better this way. Closes #6022 **Test plan** Tested using the DrawerLayout in the UIExplorer app. Before, elevation 0 <img width="420" alt="screen shot 2016-02-23 at 1 55 42 am" src="https://cloud.githubusercontent.com/assets/2677334/13244000/008afdb2-d9d1-11e5-95b8-9c345ea0ea8d.png"> After, elevation Closes https://github.com/facebook/react-native/pull/6100 Reviewed By: bestander Differential Revision: D3012242 Pulled By: lexs fb-gh-sync-id: 4967d7ec920f0229d823032ba95c8a3cace329c6 shipit-source-id: 4967d7ec920f0229d823032ba95c8a3cace329c6
This commit is contained in:
committed by
Facebook Github Bot 9
parent
36893ecfa0
commit
61483aa15d
@@ -156,7 +156,7 @@ var DrawerLayoutAndroid = React.createClass({
|
||||
drawerWidth={this.props.drawerWidth}
|
||||
drawerPosition={this.props.drawerPosition}
|
||||
drawerLockMode={this.props.drawerLockMode}
|
||||
style={styles.base}
|
||||
style={[styles.base, this.props.style]}
|
||||
onDrawerSlide={this._onDrawerSlide}
|
||||
onDrawerOpen={this._onDrawerOpen}
|
||||
onDrawerClose={this._onDrawerClose}
|
||||
@@ -218,6 +218,7 @@ var DrawerLayoutAndroid = React.createClass({
|
||||
var styles = StyleSheet.create({
|
||||
base: {
|
||||
flex: 1,
|
||||
elevation: 16,
|
||||
},
|
||||
mainSubview: {
|
||||
position: 'absolute',
|
||||
@@ -230,6 +231,7 @@ var styles = StyleSheet.create({
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
backgroundColor: 'white',
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user