From b5452ac4064fad1eb151d7ecc2a5b63e5f1be40c Mon Sep 17 00:00:00 2001 From: Marc Rousavy Date: Tue, 10 Aug 2021 14:10:07 +0200 Subject: [PATCH] Update FRAME_PROCESSORS.mdx --- docs/docs/guides/FRAME_PROCESSORS.mdx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/docs/docs/guides/FRAME_PROCESSORS.mdx b/docs/docs/guides/FRAME_PROCESSORS.mdx index e58314e..fb76bde 100644 --- a/docs/docs/guides/FRAME_PROCESSORS.mdx +++ b/docs/docs/guides/FRAME_PROCESSORS.mdx @@ -69,7 +69,8 @@ const frameProcessor = useFrameProcessor((frame) => { ``` You can also easily read from, and assign to [**Shared Values**](https://docs.swmansion.com/react-native-reanimated/docs/shared-values) to create smooth, 60 FPS animations. -In this example, we detect a cat in the frame. If a cat was found, we set the `catBounds` Shared Value to the coordinates of the cat relative to the screen, which we can then use in a `useAnimatedStyle` hook to display a red rectangle surrounding the cat. This smoothly updates in realtime on the UI Thread, and can also be smoothly animated with `withSpring` or `withTiming`. + +In this example, we detect a cat in the frame - if a cat was found, we assign the `catBounds` Shared Value to the coordinates of the cat (relative to the screen) which we can then use in a `useAnimatedStyle` hook to position the red rectangle surrounding the cat. This updates in realtime on the UI Thread, and can also be smoothly animated with `withSpring` or `withTiming`. ```tsx {6} // represents position of the cat on the screen 🐈