Skip to content

Instantly share code, notes, and snippets.

@nishp1
Forked from vdel26/animations.js
Created March 20, 2016 01:55
Show Gist options
  • Save nishp1/cdc4da58446ecd9df5a1 to your computer and use it in GitHub Desktop.
Save nishp1/cdc4da58446ecd9df5a1 to your computer and use it in GitHub Desktop.
Custom Scene transition
import { Navigator } from 'react-native';
import PixelRatio from 'PixelRatio';
import Dimensions from 'Dimensions';
import buildStyleInterpolator from 'buildStyleInterpolator';
// use FloatFromRight as starting template
const BaseConfig = Navigator.SceneConfigs.FloatFromRight;
// create custom navigator transition
const PushFromRightFast = Object.assign({}, BaseConfig, {
springFriction: 25,
springTension: 215,
});
const FlatFadeToTheLeft = {
transformTranslate: {
from: {x: 0, y: 0, z: 0},
to: {x: -Math.round(Dimensions.get('window').width * 1.5), y: 0, z: 0},
min: 0,
max: 1,
type: 'linear',
extrapolate: true,
round: PixelRatio.get(),
},
opacity: {
from: 1,
to: 0,
min: 0,
max: 1,
type: 'linear',
extrapolate: false,
round: 100,
},
translateX: {
from: 0,
to: -Math.round(Dimensions.get('window').width * 0.5),
min: 0,
max: 1,
type: 'linear',
extrapolate: true,
round: PixelRatio.get(),
},
};
PushFromRightFast.animationInterpolators.out = buildStyleInterpolator(FlatFadeToTheLeft);
export default PushFromRightFast;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment