@@ -34,7 +34,7 @@ const devices = await Camera.getAvailableCameraDevices()
|
||||
```
|
||||
|
||||
:::note
|
||||
See the [`CameraDevice` type](https://github.com/cuvent/react-native-vision-camera/blob/main/src/CameraDevice.ts) for more information about a Camera Device
|
||||
See the [`CameraDevice` type](https://github.com/mrousavy/react-native-vision-camera/blob/main/src/CameraDevice.ts) for more information about a Camera Device
|
||||
:::
|
||||
|
||||
A camera device (`CameraDevice`) contains a list of physical device types this camera device consists of.
|
||||
|
@@ -50,7 +50,7 @@ The `CameraError` type is a baseclass type for all other errors and provides the
|
||||
* `cause.cause?`: The cause that caused this cause. (Recursive) (Optional)
|
||||
|
||||
:::note
|
||||
See [the `CameraError.ts` file](https://github.com/cuvent/react-native-vision-camera/blob/main/src/CameraError.ts) for a list of all possible error codes
|
||||
See [the `CameraError.ts` file](https://github.com/mrousavy/react-native-vision-camera/blob/main/src/CameraError.ts) for a list of all possible error codes
|
||||
:::
|
||||
|
||||
### Runtime Errors
|
||||
|
@@ -39,7 +39,7 @@ function App() {
|
||||
```
|
||||
|
||||
:::note
|
||||
See the [CameraPreset.ts](https://github.com/cuvent/react-native-vision-camera/blob/main/src/CameraPreset.ts) type for more information about presets
|
||||
See the [CameraPreset.ts](https://github.com/mrousavy/react-native-vision-camera/blob/main/src/CameraPreset.ts) type for more information about presets
|
||||
:::
|
||||
|
||||
:::warning
|
||||
@@ -61,7 +61,7 @@ Each application has different needs, so the format filtering is up to you.
|
||||
To get all available formats, simply use the `CameraDevice`'s `.formats` property. See how to get a camera device in the [Camera Devices guide](devices).
|
||||
|
||||
:::note
|
||||
You can also manually get all camera devices and decide which device to use based on the available `formats`. In fact, this is how we do it in the [Cuvent](https://cuvent.com) app.
|
||||
You can also manually get all camera devices and decide which device to use based on the available `formats`.
|
||||
:::
|
||||
|
||||
This example shows how you would pick the format with the _highest frame rate_:
|
||||
|
@@ -63,19 +63,19 @@ export function detectObject(frame: Frame): string {
|
||||
}
|
||||
```
|
||||
|
||||
You can also manipulate the buffer and return it (or a copy of it) by using the [`Frame` class](https://github.com/cuvent/react-native-vision-camera/blob/main/ios/Frame%20Processor/Frame.h):
|
||||
You can also manipulate the buffer and return it (or a copy of it) by using the [`Frame` class](https://github.com/mrousavy/react-native-vision-camera/blob/main/ios/Frame%20Processor/Frame.h):
|
||||
|
||||
```objc
|
||||
#import <VisionCamera/Frame.h>
|
||||
|
||||
static inline id resize(Frame* frame, NSArray args) {
|
||||
CMSampleBufferRef resizedBuffer = // ...
|
||||
|
||||
|
||||
return [[Frame alloc] initWithBuffer:resizedBuffer orientation:frame.orientation];
|
||||
}
|
||||
```
|
||||
|
||||
Which returns a [`Frame`](https://github.com/cuvent/react-native-vision-camera/blob/main/src/Frame.ts) in JS:
|
||||
Which returns a [`Frame`](https://github.com/mrousavy/react-native-vision-camera/blob/main/src/Frame.ts) in JS:
|
||||
|
||||
```js
|
||||
const frameProcessor = useFrameProcessor((frame) => {
|
||||
@@ -172,7 +172,7 @@ Your Frame Processor Plugins have to be fast. VisionCamera automatically detects
|
||||
|
||||
#### 🚀 Create your first Frame Processor Plugin for [iOS](frame-processors-plugins-ios) or [Android](frame-processors-plugins-android)!
|
||||
|
||||
[1]: https://github.com/cuvent/react-native-vision-camera/blob/main/src/Frame.ts
|
||||
[2]: https://github.com/cuvent/react-native-vision-camera/blob/main/ios/Frame%20Processor/Frame.h
|
||||
[1]: https://github.com/mrousavy/react-native-vision-camera/blob/main/src/Frame.ts
|
||||
[2]: https://github.com/mrousavy/react-native-vision-camera/blob/main/ios/Frame%20Processor/Frame.h
|
||||
[3]: https://developer.android.com/reference/androidx/camera/core/ImageProxy
|
||||
[4]: https://github.com/facebook/react-native/blob/9a43eac7a32a6ba3164a048960101022a92fcd5a/React/Base/RCTBridgeModule.h#L20-L24
|
||||
|
@@ -67,7 +67,7 @@ If you want to distribute your Frame Processor Plugin, simply use npm.
|
||||
4. Implement the Frame Processor Plugin in the iOS, Android and JS/TS Codebase using the guides above
|
||||
5. Add installation instructions to let users know they have to add your frame processor in the `babel.config.js` configuration.
|
||||
6. Publish the plugin to npm. Users will only have to install the plugin using `npm i vision-camera-plugin-xxxxx` and add it to their `babel.config.js` file.
|
||||
7. [Add the plugin to the **official VisionCamera plugin list**](https://github.com/cuvent/react-native-vision-camera/edit/main/docs/docs/guides/FRAME_PROCESSOR_PLUGIN_LIST.mdx) for more visibility
|
||||
7. [Add the plugin to the **official VisionCamera plugin list**](https://github.com/mrousavy/react-native-vision-camera/edit/main/docs/docs/guides/FRAME_PROCESSOR_PLUGIN_LIST.mdx) for more visibility
|
||||
|
||||
<br />
|
||||
|
||||
|
@@ -48,7 +48,7 @@ VISION_EXPORT_FRAME_PROCESSOR(scanQRCodes)
|
||||
@end
|
||||
```
|
||||
|
||||
4. **Implement your Frame Processing.** See the [QR Code Plugin (Objective-C)](https://github.com/cuvent/react-native-vision-camera/blob/main/example/ios/Frame%20Processor%20Plugins/QR%20Code%20Plugin%20%28Objective%2DC%29) for reference.
|
||||
4. **Implement your Frame Processing.** See the [QR Code Plugin (Objective-C)](https://github.com/mrousavy/react-native-vision-camera/blob/main/example/ios/Frame%20Processor%20Plugins/QR%20Code%20Plugin%20%28Objective%2DC%29) for reference.
|
||||
|
||||
:::note
|
||||
The JS function name will be equal to the Objective-C function name you choose (with a `__` prefix). Make sure it is unique across other Frame Processor Plugins, and doesn't shadow a JS runtime variable.
|
||||
@@ -97,7 +97,7 @@ public class QRCodeFrameProcessorPlugin: NSObject, FrameProcessorPluginBase {
|
||||
}
|
||||
```
|
||||
|
||||
5. **Implement your frame processing.** See [QR Code Plugin (Swift)](https://github.com/cuvent/react-native-vision-camera/blob/main/example/ios/Frame%20Processor%20Plugins/QR%20Code%20Plugin%20%28Swift%29) for reference.
|
||||
5. **Implement your frame processing.** See [QR Code Plugin (Swift)](https://github.com/mrousavy/react-native-vision-camera/blob/main/example/ios/Frame%20Processor%20Plugins/QR%20Code%20Plugin%20%28Swift%29) for reference.
|
||||
|
||||
|
||||
</TabItem>
|
||||
|
@@ -41,7 +41,7 @@ You have to restart metro-bundler for changes in the `babel.config.js` file to t
|
||||
<br />
|
||||
<p align="center">
|
||||
<b>
|
||||
<a href="https://github.com/cuvent/react-native-vision-camera/edit/main/docs/docs/guides/FRAME_PROCESSOR_PLUGIN_LIST.mdx">Click here</a> to add your Frame Processor Plugin to this list!
|
||||
<a href="https://github.com/mrousavy/react-native-vision-camera/edit/main/docs/docs/guides/FRAME_PROCESSOR_PLUGIN_LIST.mdx">Click here</a> to add your Frame Processor Plugin to this list!
|
||||
</b>
|
||||
</p>
|
||||
<br />
|
||||
|
@@ -16,7 +16,7 @@ The Camera's `isActive` property can be used to _pause_ the session (`isActive={
|
||||
|
||||
For example, you want to **pause the camera** when the user **navigates to another page** or **minimizes the app** since otherwise the camera continues to run in the background without the user seeing it, causing **siginificant battery drain**. Also, on iOS a green dot indicates the user that the camera is still active, possibly causing the user to raise privacy concerns. (🔗 See ["About the orange and green indicators in your iPhone status bar"](https://support.apple.com/en-us/HT211876))
|
||||
|
||||
This example demonstrates how you could pause the camera stream once the app goes into background using a [custom `useIsAppForeground` hook](https://github.com/cuvent/react-native-vision-camera/blob/main/example/src/hooks/useIsForeground.ts):
|
||||
This example demonstrates how you could pause the camera stream once the app goes into background using a [custom `useIsAppForeground` hook](https://github.com/mrousavy/react-native-vision-camera/blob/main/example/src/hooks/useIsForeground.ts):
|
||||
|
||||
```tsx
|
||||
function App() {
|
||||
|
@@ -46,7 +46,7 @@ Before opening an issue, make sure you try the following:
|
||||
npm i # or "yarn"
|
||||
```
|
||||
2. Since the Android implementation uses the not-yet fully stable **CameraX** API, make sure you've browsed the [CameraX issue tracker](https://issuetracker.google.com/issues?q=componentid:618491%20status:open) to find out if your issue is a limitation by the **CameraX** library even I cannot get around.
|
||||
3. Make sure your minimum SDK version is **21 or higher**, and target SDK version is **30 or higher**. See [the example's `build.gradle`](https://github.com/cuvent/react-native-vision-camera/blob/main/example/android/build.gradle#L5-L9) for reference.
|
||||
3. Make sure your minimum SDK version is **21 or higher**, and target SDK version is **30 or higher**. See [the example's `build.gradle`](https://github.com/mrousavy/react-native-vision-camera/blob/main/example/android/build.gradle#L5-L9) for reference.
|
||||
1. Open your `build.gradle`
|
||||
2. Set `buildToolsVersion` to `30.0.0` or higher
|
||||
3. Set `compileSdkVersion` to `30` or higher
|
||||
@@ -65,4 +65,4 @@ Before opening an issue, make sure you try the following:
|
||||
|
||||
## Issues
|
||||
|
||||
If nothing has helped so far, try browsing the [GitHub issues](https://github.com/cuvent/react-native-vision-camera/issues?q=is%3Aissue). If your issue doesn't exist, [create a new one](https://github.com/cuvent/react-native-vision-camera/issues/new/choose). Make sure to fill out the template and include as many details as possible. Also try to reproduce the issue in the [example app](https://github.com/cuvent/react-native-vision-camera/blob/main/example).
|
||||
If nothing has helped so far, try browsing the [GitHub issues](https://github.com/mrousavy/react-native-vision-camera/issues?q=is%3Aissue). If your issue doesn't exist, [create a new one](https://github.com/mrousavy/react-native-vision-camera/issues/new/choose). Make sure to fill out the template and include as many details as possible. Also try to reproduce the issue in the [example app](https://github.com/mrousavy/react-native-vision-camera/blob/main/example).
|
||||
|
@@ -96,7 +96,7 @@ A Camera's `zoom` property is represented in a **logarithmic scale**. That means
|
||||
|
||||
### Pinch-to-zoom
|
||||
|
||||
The above example only demonstrates how to animate the `zoom` property. To actually implement pinch-to-zoom or pan-to-zoom, take a look at the [VisionCamera example app](https://github.com/cuvent/react-native-vision-camera/tree/main/example), the pinch-to-zoom gesture can be found [here](https://github.com/cuvent/react-native-vision-camera/blob/d8551792e97eaa6fa768f54059ffce054bf748d9/example/src/CameraPage.tsx#L162-L176), and the pan-to-zoom gesture can be found [here](https://github.com/cuvent/react-native-vision-camera/blob/d8551792e97eaa6fa768f54059ffce054bf748d9/example/src/views/CaptureButton.tsx#L185-L205). They implement a real world use-case, where the maximum zoom value is clamped to a realistic value, and the zoom responds very gracefully by using a logarithmic scale.
|
||||
The above example only demonstrates how to animate the `zoom` property. To actually implement pinch-to-zoom or pan-to-zoom, take a look at the [VisionCamera example app](https://github.com/mrousavy/react-native-vision-camera/tree/main/example), the pinch-to-zoom gesture can be found [here](https://github.com/mrousavy/react-native-vision-camera/blob/d8551792e97eaa6fa768f54059ffce054bf748d9/example/src/CameraPage.tsx#L162-L176), and the pan-to-zoom gesture can be found [here](https://github.com/mrousavy/react-native-vision-camera/blob/d8551792e97eaa6fa768f54059ffce054bf748d9/example/src/views/CaptureButton.tsx#L185-L205). They implement a real world use-case, where the maximum zoom value is clamped to a realistic value, and the zoom responds very gracefully by using a logarithmic scale.
|
||||
|
||||
<br />
|
||||
|
||||
|
@@ -1,12 +1,12 @@
|
||||
module.exports = {
|
||||
title: 'VisionCamera',
|
||||
tagline: '📸 The Camera library that sees the vision.',
|
||||
url: 'https://cuvent.github.io',
|
||||
url: 'https://mrousavy.github.io',
|
||||
baseUrl: '/react-native-vision-camera/',
|
||||
onBrokenLinks: 'throw',
|
||||
onBrokenMarkdownLinks: 'throw',
|
||||
favicon: './favicon.ico',
|
||||
organizationName: 'cuvent',
|
||||
organizationName: 'mrousavy',
|
||||
projectName: 'react-native-vision-camera',
|
||||
themeConfig: {
|
||||
algolia: {
|
||||
@@ -34,12 +34,12 @@ module.exports = {
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
href: 'https://github.com/cuvent/react-native-vision-camera/tree/main/example',
|
||||
href: 'https://github.com/mrousavy/react-native-vision-camera/tree/main/example',
|
||||
label: 'Example App',
|
||||
position: 'left'
|
||||
},
|
||||
{
|
||||
href: 'https://github.com/cuvent/react-native-vision-camera',
|
||||
href: 'https://github.com/mrousavy/react-native-vision-camera',
|
||||
label: 'GitHub',
|
||||
position: 'right',
|
||||
},
|
||||
@@ -61,7 +61,7 @@ module.exports = {
|
||||
},
|
||||
{
|
||||
label: 'Example App',
|
||||
href: 'https://github.com/cuvent/react-native-vision-camera/tree/main/example',
|
||||
href: 'https://github.com/mrousavy/react-native-vision-camera/tree/main/example',
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -70,16 +70,12 @@ module.exports = {
|
||||
items: [
|
||||
{
|
||||
label: 'GitHub discussions',
|
||||
href: 'https://github.com/cuvent/react-native-vision-camera/discussions',
|
||||
href: 'https://github.com/mrousavy/react-native-vision-camera/discussions',
|
||||
},
|
||||
{
|
||||
label: 'Twitter (@mrousavy)',
|
||||
href: 'https://twitter.com/mrousavy',
|
||||
},
|
||||
{
|
||||
label: 'Twitter (@CuventTech)',
|
||||
href: 'https://twitter.com/CuventTech',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
@@ -87,16 +83,16 @@ module.exports = {
|
||||
items: [
|
||||
{
|
||||
label: 'GitHub',
|
||||
href: 'https://github.com/cuvent/react-native-vision-camera',
|
||||
href: 'https://github.com/mrousavy/react-native-vision-camera',
|
||||
},
|
||||
{
|
||||
label: 'Cuvent',
|
||||
href: 'https://cuvent.com',
|
||||
label: 'Marc\'s Portfolio',
|
||||
href: 'https://mrousavy.github.io',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
copyright: `Copyright © ${new Date().getFullYear()} Cuvent`,
|
||||
copyright: `Copyright © ${new Date().getFullYear()} Marc Rousavy`,
|
||||
},
|
||||
},
|
||||
presets: [
|
||||
@@ -107,7 +103,7 @@ module.exports = {
|
||||
sidebarPath: require.resolve('./sidebars.js'),
|
||||
// Please change this to your repo.
|
||||
editUrl:
|
||||
'https://github.com/cuvent/react-native-vision-camera/edit/main/docs/',
|
||||
'https://github.com/mrousavy/react-native-vision-camera/edit/main/docs/',
|
||||
},
|
||||
theme: {
|
||||
customCss: require.resolve('./src/css/custom.css'),
|
||||
|
Reference in New Issue
Block a user