Skip to content

Commit

Permalink
add easing
Browse files Browse the repository at this point in the history
  • Loading branch information
allroundexperts committed Mar 27, 2024
1 parent 2c79caa commit 352b7d3
Showing 1 changed file with 4 additions and 4 deletions.
8 changes: 4 additions & 4 deletions src/hooks/useAnimatedHighlightStyle.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React from 'react';
import {InteractionManager} from 'react-native';
import {interpolate, interpolateColor, useAnimatedStyle, useSharedValue, withDelay, withSequence, withTiming} from 'react-native-reanimated';
import {Easing, interpolate, interpolateColor, useAnimatedStyle, useSharedValue, withDelay, withSequence, withTiming} from 'react-native-reanimated';
import CONST from '@src/CONST';
import useTheme from './useTheme';

Expand Down Expand Up @@ -30,12 +30,12 @@ export default function useAnimatedHighlightStyle({shouldHighlight, highlightDur
return;
}
InteractionManager.runAfterInteractions(() => {
nonRepeatableProgress.value = withTiming(1, {duration: highlightDuration});
nonRepeatableProgress.value = withTiming(1, {duration: highlightDuration, easing: Easing.inOut(Easing.ease)});
repeatableProgress.value = withSequence(
withDelay(delay, withTiming(0)),
withTiming(1, {duration: highlightDuration}),
withTiming(1, {duration: highlightDuration, easing: Easing.inOut(Easing.ease)}),
withDelay(delay, withTiming(1)),
withTiming(0, {duration: highlightDuration}),
withTiming(0, {duration: highlightDuration, easing: Easing.inOut(Easing.ease)}),
);
});
}, [shouldHighlight, highlightDuration, delay, repeatableProgress, nonRepeatableProgress]);
Expand Down

0 comments on commit 352b7d3

Please sign in to comment.