diff --git a/src/views/StackView/StackViewCard.js b/src/views/StackView/StackViewCard.js
index af54ab8..b9d3f1e 100644
--- a/src/views/StackView/StackViewCard.js
+++ b/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 .
*/
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 (
-
{children}
-
+
);
}
}
diff --git a/src/views/StackView/StackViewLayout.js b/src/views/StackView/StackViewLayout.js
index 4620fa1..07532b5 100644
--- a/src/views/StackView/StackViewLayout.js
+++ b/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 (
-
+
{scenes.map(s => this._renderCard(s))}
-
+
{floatingHeader}
);
diff --git a/src/views/StackView/screens.js b/src/views/StackView/screens.js
new file mode 100644
index 0000000..fce1d3f
--- /dev/null
+++ b/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 };