railbird/react-native-vision-camera
8
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update FRAME_PROCESSORS.mdx

Browse Source
This commit is contained in:
Marc Rousavy 2021-08-10 14:10:07 +02:00 committed by GitHub
parent cc4d9c519b
commit b5452ac406
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 2 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
docs/docs/guides/FRAME_PROCESSORS.mdx
View File

@ -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. 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} ```tsx {6}
// represents position of the cat on the screen 🐈 // represents position of the cat on the screen 🐈