React Native Animated Interpolation Ornegi

search.jsx

const SearchView = ({navigation}) => {
  const heroAnim = useRef(new Animated.Value(1)).current
  const [isSearchFocus, setSearchFocus] = useState(false)
  
  useEffect(() => {
    if(isSearchFocus) {
      Animated.timing(heroAnim, {
        toValue: 1,
        duration: 230,
        useNativeDriver: false,
      }).start()
    } else {
      Animated.timing(heroAnim, {
        toValue: 0,
        duration: 230,
        useNativeDriver: false,
      }).start()
    }
  }, [heroAnim, isSearchFocus]);
  
  return (
    {/*...*/}
    <Box
      as={Animated.View}
      height={heroAnim.interpolate({
        inputRange: [0,1],
        outputRange: [0,230]
      })}
      {/*...*/}
    >
      <Box
        as={Animated.View}
        //Burada gerek yok ama göstermek için kullanmak istedim.
        opacity={heroAnim.interpolate({
          inputRange: [0,1],
          outputRange: [0,1]
        })}
      >
        <Bg>{/*...*/}</Bg>
      </Box>
    </Box>
    {/*...*/}  
  )
}