Merge pull request #5 from react-navigation/useScreens

Use ScreenContainer and Screen components in stack - currently they fallback to RN's View

src/views/StackView/StackViewCard.js

@@ -1,21 +1,36 @@
 import React from 'react';
-import { Animated, StyleSheet } from 'react-native';
+import { StyleSheet } from 'react-native';
+import { Screen } from './screens';
 import createPointerEventsContainer from './createPointerEventsContainer';
 
+const EPS = 1e-5;
+
 /**
  * Component that renders the scene as card for the <StackView />.
  */
 class Card extends React.Component {
   render() {
-    const { children, pointerEvents, style } = this.props;
+    const {
+      children,
+      pointerEvents,
+      style,
+      position,
+      scene: { index },
+    } = this.props;
+    const active = position.interpolate({
+      inputRange: [index, index + 1 - EPS, index + 1],
+      outputRange: [1, 1, 0],
+      extrapolate: 'clamp',
+    });
     return (
-      <Animated.View
+      <Screen
         pointerEvents={pointerEvents}
         ref={this.props.onComponentRef}
         style={[styles.main, style]}
+        active={active}
       >
         {children}
-      </Animated.View>
+      </Screen>
     );
   }
 }

src/views/StackView/StackViewLayout.js

@@ -21,6 +21,7 @@ import {
 
 import Card from './StackViewCard';
 import Header from '../Header/Header';
+import { ScreenContainer } from './screens';
 
 import TransitionConfigs from './StackViewTransitionConfigs';
 import { supportsImprovedSpringAnimation } from '../../utils/ReactNativeFeatures';
@@ -469,9 +470,9 @@ class StackViewLayout extends React.Component {
 
     return (
       <View {...handlers} style={containerStyle}>
-        <View style={styles.scenes}>
+        <ScreenContainer style={styles.scenes}>
           {scenes.map(s => this._renderCard(s))}
-        </View>
+        </ScreenContainer>
         {floatingHeader}
       </View>
     );

src/views/StackView/screens.js

@@ -0,0 +1,6 @@
+import { Animated, View } from 'react-native';
+
+const ScreenContainer = View;
+const Screen = Animated.View;
+
+export { ScreenContainer, Screen };