docs: New Frame Processor Plugins docs (#2434)
This commit is contained in:
parent
bc6f954bf1
commit
4041ee8cbd
@ -41,7 +41,7 @@ cd ios && pod install
|
|||||||
* [Guides](https://react-native-vision-camera.com/docs/guides)
|
* [Guides](https://react-native-vision-camera.com/docs/guides)
|
||||||
* [API](https://react-native-vision-camera.com/docs/api)
|
* [API](https://react-native-vision-camera.com/docs/api)
|
||||||
* [Example](./package/example/)
|
* [Example](./package/example/)
|
||||||
* [Frame Processor Plugins](https://react-native-vision-camera.com/docs/guides/frame-processor-plugin-list)
|
* [Frame Processor Plugins](https://react-native-vision-camera.com/docs/guides/frame-processor-plugins)
|
||||||
|
|
||||||
### ShadowLens
|
### ShadowLens
|
||||||
|
|
||||||
|
@ -214,24 +214,30 @@ See: ["Creating Frame Processor Plugins"](/docs/guides/frame-processors-plugins-
|
|||||||
|
|
||||||
### Using Community Plugins
|
### Using Community Plugins
|
||||||
|
|
||||||
Community Frame Processor Plugins are distributed through npm. To install the [vision-camera-image-labeler](https://github.com/mrousavy/vision-camera-image-labeler) plugin, run:
|
Community Frame Processor Plugins are distributed through npm. To install the [vision-camera-resize-plugin](https://github.com/mrousavy/vision-camera-resize-plugin) plugin, run:
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
npm i vision-camera-image-labeler
|
yarn add vision-camera-resize-plugin
|
||||||
cd ios && pod install
|
cd ios && pod install
|
||||||
```
|
```
|
||||||
|
|
||||||
That's it! 🎉 Now you can use it:
|
That's it! 🎉 Now you can use it:
|
||||||
|
|
||||||
```ts
|
```ts
|
||||||
|
const { resize } = useResizePlugin()
|
||||||
|
|
||||||
const frameProcessor = useFrameProcessor((frame) => {
|
const frameProcessor = useFrameProcessor((frame) => {
|
||||||
'worklet'
|
'worklet'
|
||||||
const labels = labelImage(frame)
|
const smallerFrame = resize(frame, {
|
||||||
|
size: {
|
||||||
// ...
|
// ...
|
||||||
}, [])
|
},
|
||||||
|
})
|
||||||
|
// ...
|
||||||
|
}, [resize])
|
||||||
```
|
```
|
||||||
|
|
||||||
Check out [Frame Processor community plugins](/docs/guides/frame-processor-plugin-list) to discover available community plugins.
|
Check out [Frame Processor community plugins](/docs/guides/frame-processor-plugins) to discover available community plugins.
|
||||||
|
|
||||||
## Selecting a Format for a Frame Processor
|
## Selecting a Format for a Frame Processor
|
||||||
|
|
||||||
|
@ -104,4 +104,4 @@ Then include it in your C++ code:
|
|||||||
|
|
||||||
<br />
|
<br />
|
||||||
|
|
||||||
#### 🚀 Next section: [Browse Community Plugins](frame-processor-plugin-list)
|
#### 🚀 Next section: [Browse Community Plugins](frame-processor-plugins)
|
||||||
|
@ -56,4 +56,4 @@ If you want to distribute your Frame Processor Plugin, simply use npm.
|
|||||||
|
|
||||||
<br />
|
<br />
|
||||||
|
|
||||||
#### 🚀 Next section: [Browse Community Plugins](frame-processor-plugin-list)
|
#### 🚀 Next section: [Browse Community Plugins](frame-processor-plugins)
|
||||||
|
@ -1,17 +1,21 @@
|
|||||||
---
|
---
|
||||||
id: frame-processor-plugin-list
|
id: frame-processor-plugins
|
||||||
title: Community Plugins
|
title: Frame Processor Plugins
|
||||||
sidebar_label: Community Plugins
|
sidebar_label: Frame Processor Plugins
|
||||||
---
|
---
|
||||||
|
|
||||||
These are VisionCamera Frame Processor Plugins created by the community.
|
Frame Processor Plugins are native plugins that can process data in a Frame and return values to a JS Frame Processor.
|
||||||
|
|
||||||
|
These plugins are written in native languages such as Java/Kotlin, Objective-C/Swift, or even C++ to make use of GPU-acceleration, low-level APIs, and overall faster performance.
|
||||||
|
|
||||||
|
Similar to react-native libraries, Frame Processor Plugins are distributed through npm and come with a native module boilerplate so they can be autolinked.
|
||||||
|
|
||||||
## Installing a Plugin
|
## Installing a Plugin
|
||||||
|
|
||||||
1. Install using npm:
|
1. Install using npm:
|
||||||
|
|
||||||
```
|
```
|
||||||
npm i vision-camera-xxxxx
|
yarn add vision-camera-xxxxx
|
||||||
cd ios && pod install
|
cd ios && pod install
|
||||||
```
|
```
|
||||||
|
|
||||||
@ -20,8 +24,8 @@ cd ios && pod install
|
|||||||
## Plugin List
|
## Plugin List
|
||||||
|
|
||||||
* [mrousavy/**react-native-fast-tflite**](https://github.com/mrousavy/react-native-fast-tflite): A plugin to run any Tensorflow Lite model inside React Native, written in C++ with GPU acceleration.
|
* [mrousavy/**react-native-fast-tflite**](https://github.com/mrousavy/react-native-fast-tflite): A plugin to run any Tensorflow Lite model inside React Native, written in C++ with GPU acceleration.
|
||||||
|
* [mrousavy/**vision-camera-resize-plugin**](https://github.com/mrousavy/vision-camera-resize-plugin): A plugin for fast frame resizing, cropping and YUV/RGB pixel-format conversion using SIMD and CPU-Vector acceleration.
|
||||||
* [mrousavy/**vision-camera-image-labeler**](https://github.com/mrousavy/vision-camera-image-labeler): A plugin to label images using MLKit Vision Image Labeler.
|
* [mrousavy/**vision-camera-image-labeler**](https://github.com/mrousavy/vision-camera-image-labeler): A plugin to label images using MLKit Vision Image Labeler.
|
||||||
* [mrousavy/**vision-camera-resize-plugin**](https://github.com/mrousavy/vision-camera-resize-plugin): A plugin for fast frame resizing to optimize execution speed of expensive AI algorithms.
|
|
||||||
* [rodgomesc/**vision-camera-face-detector**](https://github.com/rodgomesc/vision-camera-face-detector): A plugin to detect faces using MLKit Vision Face Detector.
|
* [rodgomesc/**vision-camera-face-detector**](https://github.com/rodgomesc/vision-camera-face-detector): A plugin to detect faces using MLKit Vision Face Detector.
|
||||||
* [rodgomesc/**vision-camera-qrcode-scanner**](https://github.com/rodgomesc/vision-camera-qrcode-scanner): A plugin to read barcodes using MLKit Vision QrCode Scanning
|
* [rodgomesc/**vision-camera-qrcode-scanner**](https://github.com/rodgomesc/vision-camera-qrcode-scanner): A plugin to read barcodes using MLKit Vision QrCode Scanning
|
||||||
* [mgcrea/**vision-camera-barcode-scanner**](https://github.com/mgcrea/vision-camera-barcode-scanner): A high performance barcode scanner for React Native using VisionCamera
|
* [mgcrea/**vision-camera-barcode-scanner**](https://github.com/mgcrea/vision-camera-barcode-scanner): A high performance barcode scanner for React Native using VisionCamera
|
@ -13,9 +13,9 @@ module.exports = {
|
|||||||
label: 'Realtime Frame Processing',
|
label: 'Realtime Frame Processing',
|
||||||
items: [
|
items: [
|
||||||
'guides/frame-processors',
|
'guides/frame-processors',
|
||||||
|
'guides/frame-processor-plugins',
|
||||||
'guides/pixel-formats',
|
'guides/pixel-formats',
|
||||||
'guides/frame-processors-tips',
|
'guides/frame-processors-tips',
|
||||||
'guides/frame-processor-plugin-list',
|
|
||||||
'guides/skia-frame-processors',
|
'guides/skia-frame-processors',
|
||||||
{
|
{
|
||||||
type: 'category',
|
type: 'category',
|
||||||
|
Loading…
Reference in New Issue
Block a user