constructor(props) {
super(props);
this._animatedValue = new Animated.Value(0);
this.base_exponent_backup = 0;
this.state = {
base_exponent: 0
}
this._animatedValue.addListener(({value}) => this.setState({base_exponent: value}));
}
componentWillMount() {
this._animatedValue = new Animated.Value(1);
this._animatedValue.addListener(({value}) => {
if (value == 2) {
this.setState({showPage: true});
}
});
this._opanimatedValue = this._animatedValue.interpolate({
inputRange: [1, 2],
outputRange: [1, 0],
});
}
componentWillMount() {
this.animatedValue = new Animated.Value(0);
this.value = 0;
this.animatedValue.addListener(({ value }) => {
this.value = value;
})
this.frontInterpolate = this.animatedValue.interpolate({
inputRange: [0, 180],
outputRange: ['0deg', '180deg'],
})
this.backInterpolate = this.animatedValue.interpolate({
inputRange: [0, 180],
outputRange: ['180deg', '360deg']
})
}
componentDidMount() {
this.progress.setValue(0);
this.progress.addListener((progress) => {
this.setState({
progress: parseInt(progress.value) + '%'
});
});
Animated.timing(this.progress, {
duration: 7000,
toValue: 100,
useNativeDriver: false
}).start(() => {
this.setState({
progress: 'Done!'
})
});
}
componentDidMount(){
// need to be refactor with timing function.
let animationHub = [];
const animation = new Animated.Value(0);
animation.addListener(({value}) => {
this.setState({
progress:value
})
})
Animated.timing(animation,{
toValue:1,
duration:1500,
easing:Easing.bounce
}).start();
}
componentDidMount() {
let animation = Animated.sequence([
Animated.timing(this.animatedValue, {
toValue: this.maxValue,
duration: 2000
}),
Animated.timing(this.animatedValue, {
toValue: 0,
duration: 2000,
delay: 2000
})
]);
this.listenerId = this.animatedValue.addListener((x) => {
if (x.value === 0) {
this.props.clear();
}
});
animation.start();
}
constructor(props, context) {
super(props, context);
// The initial layout isn't measured. Measured layout will be only available
// when the component is mounted.
const layout = {
height: new Animated.Value(0),
initHeight: 0,
initWidth: 0,
isMeasured: false,
width: new Animated.Value(0),
};
const position = new Animated.Value(this.props.navigation.state.index);
this._positionListener = position.addListener((/* { value } */) => {
// This should work until we detach position from a view! so we have to be
// careful to not ever detach it, thus the gymnastics in _getPosition in
// StackViewLayout
// This should log each frame when releasing the gesture or when pressing
// the back button! If not, something has gone wrong with the animated
// value subscription
// console.log(value);
});
this.state = {
layout,
position,
scenes: NavigationScenesReducer(
[],
this.props.navigation.state,
null,
this.props.descriptors
),
};
this._prevTransitionProps = null;
this._transitionProps = buildTransitionProps(props, this.state);
this._isMounted = false;
this._isTransitionRunning = false;
this._queuedTransition = null;
}
componentDidMount() {
this._animatedLeft.addListener(this._getOnSliding());
}
constructor(props) {
super(props);
const {containerHeight, headerHeight, marginFromTop} = props;
this.masterRef = React.createRef();
this.panRef = React.createRef();
this.scrollRef = React.createRef();
this.scrollViewRef = React.createRef();
this.headerRef = React.createRef();
this.backdropRef = React.createRef();
const initialUsedSpace = Math.abs(props.initialPosition);
let initialPosition;
if (initialUsedSpace <= 1) {
initialPosition = ((containerHeight - (headerHeight + BOTTOM_MARGIN)) * (1 - initialUsedSpace));
} else {
initialPosition = ((containerHeight - (headerHeight + BOTTOM_MARGIN)) - initialUsedSpace);
}
// These values correspond to when the panel is fully open, when it is initially opened, and when it is closed
this.snapPoints = [marginFromTop, initialPosition, containerHeight];
this.state = {
lastSnap: initialPosition,
};
this.lastScrollYValue = 0;
this.lastScrollY = new Animated.Value(0);
this.onRegisterLastScroll = Animated.event(
[{
nativeEvent: {
contentOffset: {
y: this.lastScrollY,
},
},
}],
{useNativeDriver: true},
);
this.lastScrollY.addListener(({value}) => {
this.lastScrollYValue = value;
});
this.dragY = new Animated.Value(0);
this.onGestureEvent = Animated.event(
[{
nativeEvent: {
translationY: this.dragY,
},
}],
{useNativeDriver: true},
);
this.reverseLastScrollY = Animated.multiply(
new Animated.Value(-1),
this.lastScrollY
);
this.translateYOffset = new Animated.Value(containerHeight);
this.translateY = Animated.add(
this.translateYOffset,
Animated.add(this.dragY, this.reverseLastScrollY)
).interpolate({
inputRange: [marginFromTop, containerHeight],
outputRange: [marginFromTop, containerHeight],
extrapolate: 'clamp',
});
}