diff --git a/docs/docs/guides/ERRORS.mdx b/docs/docs/guides/ERRORS.mdx index 5cd33cc..aea1d5a 100644 --- a/docs/docs/guides/ERRORS.mdx +++ b/docs/docs/guides/ERRORS.mdx @@ -71,7 +71,7 @@ function App() { ### Capture Errors -The `CameraCaptureError` represents any kind of error that occured only while capturing a photo or recording a video. +The `CameraCaptureError` represents any kind of error that occured only while taking a photo or recording a video. ```tsx function App() { diff --git a/docs/docs/guides/FORMATS.mdx b/docs/docs/guides/FORMATS.mdx index 9c1d430..ba11f94 100644 --- a/docs/docs/guides/FORMATS.mdx +++ b/docs/docs/guides/FORMATS.mdx @@ -21,7 +21,7 @@ There are formats specifically designed for high-resolution photo capture (but l If you don't want to specify a Camera Format, you don't have to. The Camera automatically chooses the best matching format for the current camera device. This is why the Camera's `format` property is _optional_. -**🚀 Continue with: [Taking Photos/Recording Videos](./capturing)** +**🚀 Continue with: [Taking Photos](./taking-photos)** ## Choosing custom formats @@ -37,7 +37,7 @@ To understand a bit more about camera formats, you first need to understand a fe To get all available formats, simply use the `CameraDevice`'s [`formats` property](/docs/api/interfaces/CameraDevice#formats). These are a [CameraFormat's](/docs/api/interfaces/CameraDeviceFormat) props: -- [`photoHeight`](/docs/api/interfaces/CameraDeviceFormat#photoHeight)/[`photoWidth`](/docs/api/interfaces/CameraDeviceFormat#photoWidth): The resolution that will be used for capturing photos. Choose a format with your desired resolution. +- [`photoHeight`](/docs/api/interfaces/CameraDeviceFormat#photoHeight)/[`photoWidth`](/docs/api/interfaces/CameraDeviceFormat#photoWidth): The resolution that will be used for taking photos. Choose a format with your desired resolution. - [`videoHeight`](/docs/api/interfaces/CameraDeviceFormat#videoHeight)/[`videoWidth`](/docs/api/interfaces/CameraDeviceFormat#videoWidth): The resolution that will be used for recording videos. Choose a format with your desired resolution. - [`minFps`](/docs/api/interfaces/CameraDeviceFormat#minFps)/[`maxFps`](/docs/api/interfaces/CameraDeviceFormat#maxFps): A range of possible values for the `fps` property. For example, if your format has `minFps: 1` and `maxFps: 60`, you can either use `fps={30}`, `fps={60}` or any other value in between for recording videos. - [`videoStabilizationModes`](/docs/api/interfaces/CameraDeviceFormat#videoStabilizationModes): All supported Video Stabilization Modes, digital and optical. If this specific format contains your desired [`VideoStabilizationMode`](/docs/api/#videostabilizationmode), you can pass it to your `` via the [`videoStabilizationMode` property](/docs/api/interfaces/CameraProps#videoStabilizationMode). @@ -180,4 +180,4 @@ Other props that depend on the `format`:
-#### 🚀 Next section: [Taking Photos/Recording Videos](./capturing) +#### 🚀 Next section: [Taking Photos](./taking-photos) diff --git a/docs/docs/guides/RECORDING_VIDEOS.mdx b/docs/docs/guides/RECORDING_VIDEOS.mdx new file mode 100644 index 0000000..1fc2237 --- /dev/null +++ b/docs/docs/guides/RECORDING_VIDEOS.mdx @@ -0,0 +1,166 @@ +--- +id: recording-videos +title: Recording Videos +sidebar_label: Recording Videos +--- + +import useBaseUrl from '@docusaurus/useBaseUrl' + +
+ + + + +
+ +## Camera Functions + +The Camera provides certain functions which are available through a [ref object](https://reactjs.org/docs/refs-and-the-dom.html): + +```tsx +function App() { + const camera = useRef(null) + // ... + + return ( + + ) +} +``` + +To use these functions, you need to wait until the [`onInitialized`](/docs/api/interfaces/CameraProps#oninitialized) event has been fired. + +## Recording Videos + +To start a video recording you first have to enable video capture: + +```tsx + +``` + +Then, simply use the Camera's [`startRecording(...)`](/docs/api/classes/Camera#startrecording) function: + +```ts +camera.current.startRecording({ + onRecordingFinished: (video) => console.log(video), + onRecordingError: (error) => console.error(error) +}) +``` + +You can customize capture options such as [video codec](/docs/api/interfaces/RecordVideoOptions#videoCodec), [video bit-rate](/docs/api/interfaces/RecordVideoOptions#videoBitRate), [file type](/docs/api/interfaces/RecordVideoOptions#fileType), [enable flash](/docs/api/interfaces/RecordVideoOptions#flash) and more using the [`RecordVideoOptions`](/docs/api/interfaces/RecordVideoOptions) parameter. + +For any error that occured _while recording the video_, the `onRecordingError` callback will be invoked with a [`CaptureError`](/docs/api/classes/CameraCaptureError) and the recording is therefore cancelled. + +To stop the video recording, you can call [`stopRecording(...)`](/docs/api/classes/Camera#stoprecording): + +```ts +await camera.current.stopRecording() +``` + +Once a recording has been stopped, the `onRecordingFinished` callback passed to the [`stopRecording(...)`](/docs/api/classes/Camera#stoprecording) function will be invoked with a [`VideoFile`](/docs/api/interfaces/VideoFile) which you can then use to display in a [`