How to use the react-native-redash.clamp function in react-native-redash

To help you get started, we’ve selected a few react-native-redash examples, based on popular ways it is used in public projects.

github wcandillon / can-it-be-done-in-react-native / season3 / src / Things / Search.tsx View on Github external
export default memo(({ translateY }: SearchProps) => {
  const chevronTranslateY = translateY;
  const searchTranslateY = clamp(chevronTranslateY, 0, THRESHOLD);
  const backgroundColor = interpolateColor(translateY, {
    inputRange: [CONTAINER_HEIGHT, THRESHOLD],
    outputRange: [grey, primary]
  }) as Animated.Node<number>;
  const opacity = interpolate(translateY, {
    inputRange: [CONTAINER_HEIGHT, THRESHOLD],
    outputRange: [1, 0],
    extrapolate: Extrapolate.CLAMP
  });
  const oppositeOpacity = sub(1, opacity);
  return (
    <View style={styles.container}>
      <Animated.View
        style={[
          styles.search,
          {
github wcandillon / can-it-be-done-in-react-native / season2 / spotify-player / components / AnimatedHelpers / Gestures.ts View on Github external
export const withClamp = (
  value: Animated.Node<number>,
  state: Animated.Value<State>,
  min: Animated.Adaptable<number>,
  max: Animated.Adaptable<number>
) => cond(eq(state, State.ACTIVE), clamp(value, min, max), value);