Use ScreenContainer and Screen components in stack - currently they fallback to RN's View
This commit is contained in:
parent
094ebbe4a9
commit
9bfc92baa5
|
@ -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>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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>
|
||||
);
|
||||
|
|
|
@ -0,0 +1,6 @@
|
|||
import { Animated, View } from 'react-native';
|
||||
|
||||
const ScreenContainer = View;
|
||||
const Screen = Animated.View;
|
||||
|
||||
export { ScreenContainer, Screen };
|
Loading…
Reference in New Issue