Member-only story

9 React Native Capabilities You’re Probably Not Using Enough

7 min readOct 27, 2026

Not a Medium Member? “Read For Free”

1. Easing.bounce

When you animate something, easing decides how it speeds up and slows down. Easing.bounce makes it land and bounce a few times, like a ball hitting the floor.

In the demo, tap Drop and a ball falls and bounces at the bottom.

Code:

export function EasingBounceDemo() {
  const theme = useTheme();
  const drop = useRef(new Animated.Value(0)).current;

  const play = () => {
    drop.setValue(0);
    Animated.timing(drop, {
      toValue: 1,
      duration: 1200,
      easing: Easing.bounce,
      useNativeDriver: true,
    }).start();
  };

  const translateY = drop.interpolate({
    inputRange: [0, 1],
    outputRange: [0, 200],
  });

  return (
    <View style={styles.stack}>
      <View style={[styles.dropStage, { borderColor: theme.border }]}>
        <Animated.View
          style={[
            styles.ball,
            { backgroundColor: palette[0], transform: [{ translateY }] },
          ]}
        />
      </View>
      <DemoButton title="Drop" onPress={play} />
    </View>…