provide getSceneStyle extra context about the scene if its active,

to allow for setting margins/padding based on nav/tabs.

Example/Example.js

@@ -48,17 +48,20 @@ const reducerCreate = params=>{
 };
 
 // define this based on the styles/dimensions you use
-const getSceneStyle = function (/* NavigationSceneRendererProps */ props) {
-  return {
+const getSceneStyle = function (/* NavigationSceneRendererProps */ props, computedProps) {
+  const style = {
     flex: 1,
-    // marginTop: props.scene.navigationState.hideNavBar ? 0 : 64,
-    // marginBottom: props.scene.navigationState.hideTabBar ? 0 : 50,
     backgroundColor: '#fff',
     shadowColor: null,
     shadowOffset: null,
     shadowOpacity: null,
     shadowRadius: null,
   };
+  if (computedProps.isActive) {
+    style.marginTop = computedProps.hideNavBar ? 0 : 64;
+    style.marginBottom = computedProps.hideTabBar ? 0 : 50;
+  }
+  return style;
 };
 
 let currentSwitchPage = 'text1';
@@ -90,7 +93,7 @@ export default class Example extends React.Component {
     render() {
         return <Router createReducer={reducerCreate} getSceneStyle={getSceneStyle}>
             <Scene key="modal" component={Modal} >
-                <Scene key="root" hideNavBar={true}>
+                <Scene key="root" hideNavBar hideTabBar>
                     <Scene key="echo" clone component={EchoView} getTitle={(navState) => navState.key} />
                     <Scene key="switcher" component={Switch} selector={(props) => {
                         return 'text1';

docs/API_CONFIGURATION.md

@@ -43,19 +43,19 @@
 | Property | Type | Default | Description |
 |-----------|--------|---------|--------------------------------------------|
 | sceneStyle | [`View style`](https://facebook.github.io/react-native/docs/view.html#style) | { flex: 1 } | optional style override for the Scene's component |
-| getSceneStyle | `function` | optional | Optionally override the styles for NavigationCard's Animated.View rendering the scene. |
+| getSceneStyle | `function` | optional | Optionally override the styles for NavigationCard's Animated.View rendering the scene.  Receives first argument of `NavigationSceneRendererProps` and second argument of `{hideNavBar,hideTabBar,isActive}` (see Example app). |
 
 ### Tabs
 | Property | Type | Default | Description |
 |-----------|--------|---------|--------------------------------------------|
 | tabs| `bool` | false | Defines 'TabBar' scene container, so child scenes will be displayed as 'tabs'. If no `component` is defined, built-in `TabBar` is used as renderer. All child scenes are wrapped into own navbar.
 | tabBarStyle | [`View style`](https://facebook.github.io/react-native/docs/view.html#style) |  | optional style override for the Tabs component |
-| hideTabBar | `bool` | false | hides tab bar for this scene (if built-in TabBar component is used as parent renderer)|
+| hideTabBar | `bool` | false | hides tab bar for this scene and any following scenes until explicitly reversed (if built-in TabBar component is used as parent renderer)|
 
 ### Navigation Bar
 | Property | Type | Default | Description |
 |-----------|--------|---------|--------------------------------------------|
-| hideNavBar | `bool` | false | hides the navigation bar for this scene |
+| hideNavBar | `bool` | false | hides the navigation bar for this scene and any following scenes until explicitly reversed |
 | navigationBarStyle | [`View style`](https://facebook.github.io/react-native/docs/view.html#style) |  | optional style override for the navigation bar |
 | navBar | `React.Component` | | optional custom NavBar for the scene. Check built-in NavBar of the component for reference |
 | drawerImage | [`Image source`](https://facebook.github.io/react-native/docs/image.html#source) | `'./menu_burger.png'` | Simple way to override the drawerImage in the navBar |

src/DefaultRenderer.js

@@ -89,12 +89,21 @@ export default class DefaultRenderer extends Component {
     const { key, direction, getSceneStyle } = props.scene.navigationState;
     let { panHandlers, animationStyle } = props.scene.navigationState;
 
-    // Since we always need to pass a style for the direction, we can avoid #526
-    let style;
-    if (getSceneStyle) {
-      style = getSceneStyle(props);
+    const state = props.navigationState;
+    const child = state.children[state.index];
+    let selected = state.children[state.index];
+    while (selected.hasOwnProperty('children')) {
+      selected = selected.children[selected.index];
+    }
+    const isActive = child === selected;
+    const computedProps = { isActive };
+    if (isActive) {
+      computedProps.hideNavBar = deepestExplicitValueForKey(props.navigationState, 'hideNavBar');
+      computedProps.hideTabBar = deepestExplicitValueForKey(props.navigationState, 'hideTabBar');
     }
 
+    const style = getSceneStyle ? getSceneStyle(props, computedProps) : null;
+
     const isVertical = direction === 'vertical';
 
     if (typeof(animationStyle) === 'undefined') {
@@ -237,6 +246,8 @@ export default class DefaultRenderer extends Component {
       }
     }
 
+    // console.log(`NavigationAnimatedView for ${navigationState.key}`);
+
     return (
       <NavigationAnimatedView
         navigationState={navigationState}