在我的应用程序中，我有一个框，我想使用GestureHandler更改其高度。我有点明白了，但现在我不知道如何从下到上更改高度。我将附上图片。
我目前的代码-

import { StyleSheet } from "react-native";
import { PanGestureHandler } from "react-native-gesture-handler";
import Animated, {
  useAnimatedGestureHandler,
  useAnimatedStyle,
  useSharedValue,
  withSpring,
} from "react-native-reanimated";
export default function App() {
  const translateY = useSharedValue(44);

  const gestureHandler = useAnimatedGestureHandler({
    onStart: (event, context) => {
      context.translateY = translateY.value;
    },
    onActive: (event, context) => {
      translateY.value = event.translationY + context.translateY;
      if (translateY.value > 200) {
        translateY.value = 200;
      }
    },
    onEnd: (_) => {
      if (translateY.value == 200) {
        translateY.value = withSpring(50);
      }
    },
  });

  const animatedStyle = useAnimatedStyle(() => {
    return {
      height: translateY.value,
    };
  });

  return (
    <PanGestureHandler onGestureEvent={gestureHandler}>
      <Animated.View style={[styles.box, animatedStyle]} />
    </PanGestureHandler>
  );
}

const styles = StyleSheet.create({
  box: {
    width: 65,
    backgroundColor: "black",
    alignSelf: "center",
    marginTop: 350,
  },
});

最终结果如下所示-x1c 0d1x
我想要的运动正好相反

我该怎么做呢？