mirror of
https://github.com/zhigang1992/react-native.git
synced 2026-04-24 04:16:00 +08:00
Nav ios hide hairline
Summary:
For the current project I am working on I needed to add a boolean option (`shadowHidden`) to remove the 1px hairline shadow from the NavigationIOS component:
`<NavigatorIOS shadowHidden={true} initialRoute={...} />`
By default, or with `shadowHidden={false}` it looks like this:

Setting the shadow hidden with `shadowHidden={true}` looks like this:

The code it uses to do the actual hiding is... a bit of a hack (*I* think), but it's the only way currently to do it, and is the way they do it in the iPhone calendar app: iterating through the subviews and removing the shadow image.
This removes the shadow *and* keeps the translucent blurry effect with a ScrollView (see this [SO discussion](http://stackoverflow.com/questions/18160173/how-to-remove-uinavigationbar-inner
Closes https://github.com/facebook/react-native/pull/1615
Github Author: Mr Speaker <mrspeaker@gmail.com>
This commit is contained in:
@@ -60,6 +60,7 @@ var RCTNavigatorItem = createReactNativeComponentClass({
|
||||
tintColor: true,
|
||||
translucent: true,
|
||||
navigationBarHidden: true,
|
||||
shadowHidden: true,
|
||||
titleTextColor: true,
|
||||
style: true,
|
||||
},
|
||||
@@ -281,6 +282,11 @@ var NavigatorIOS = React.createClass({
|
||||
*/
|
||||
navigationBarHidden: PropTypes.bool,
|
||||
|
||||
/**
|
||||
* A Boolean value that indicates whether to hide the 1px hairline shadow
|
||||
*/
|
||||
shadowHidden: PropTypes.bool,
|
||||
|
||||
/**
|
||||
* The default wrapper style for components in the navigator.
|
||||
* A common use case is to set the backgroundColor for every page
|
||||
@@ -640,6 +646,7 @@ var NavigatorIOS = React.createClass({
|
||||
rightButtonTitle={route.rightButtonTitle}
|
||||
onNavRightButtonTap={route.onRightButtonPress}
|
||||
navigationBarHidden={this.props.navigationBarHidden}
|
||||
shadowHidden={this.props.shadowHidden}
|
||||
tintColor={this.props.tintColor}
|
||||
barTintColor={this.props.barTintColor}
|
||||
translucent={this.props.translucent !== false}
|
||||
|
||||
Reference in New Issue
Block a user