# CameraRecorderDemo

**Repository Path**: liujiawm/camera-recorder-demo

## Basic Information

- **Project Name**: CameraRecorderDemo
- **Description**: 【鸿蒙 Harmony Next 示例 代码】使用系统相机实现拍照与录像功能,使用自定义相机实现视频录制。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-06-18
- **Last Updated**: 2025-06-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README



# 视频录制

## 简介

使用系统相机实现拍照与录像功能,使用自定义相机实现视频录制

## 效果预览

|startAbility方式系统相机拍照与录像功能     |cameraPicker方式系统相机拍照与录像功能             |AVRecorder方式自定义相机进行录像                                             | 
|-----------------------------------------|:-------------------------------------------------:|------------------------------------------------|
| <img src='screenshots/sta.gif' width="200"> |  <img src='screenshots/picker.gif' width="200">   | <img src='screenshots/avcode.gif' width="200"> |


## 约束与限制
1. 本示例仅支持标准系统上运行，支持设备：华为手机。
2. DevEco Studio版本：DevEco Studio 5.0.1 Release及以上。
3. HarmonyOS SDK版本：HarmonyOS 5.0.1 Release SDK及以上。

## 使用说明

点击按钮，实现startAbility方式的系统相机拍照与录像功能、实现cameraPicker方式的系统相机拍照与录像功能、实现AVRecorder方式的自定义相机进行录像

## 实现思路
1. 相机实现录像的方案介绍
使用cameraPicker方式拉起系统相机,使用AVRecorder方式拉起系统相机进行视频录制,使用AVCodec进行视频录制
本文主要介绍cameraPicker和AVRecorder，重点介绍AVRecorder
2. 使用cameraPicker方式拉起系统相机：
使用cameraPicker方式可以快速地拉起系统相机应用程序，并且可以选择拍摄照片或录制视频。通过调用相应的API，您可以指定拍摄模式、设置相机参数、获取拍摄结果等。这种方式适用于简单的拍照或录像需求，并且可以在应用程序中对拍摄结果进行处理。

3. 使用AVRecorder方式拉起系统相机
使用AVRecorder方式可以创建一个自定义的相机界面，使您可以更加灵活地控制相机的行为。您可以自定义界面布局、添加各种控制按钮、实时预览相机画面等。通过这种方式，您可以实现更复杂的相机功能，如手动调整焦距、曝光、白平衡等参数，同时还可以实时处理相机画面数据。


### 方案描述
![img.png](img.png)

整体描述：
1. 通过cameraInput,获取相机采集数据，创建相机输入
2. 创建previewOutput，获取预览输出流，通过xcomponent的surfaceid连接，送显xcomponent
3. 通过AVrecorder的surfaceid创建录像输出流VideoOutput输出到文件中

#### 1. 通过CameraManager获取相机管理对象
##### 1.1 创建CameraManager对象:
```typescript
let cameraManager: camera.CameraManager = camera.getCameraManager(context);
```
##### 1.2 通过getSupportedCameras 获取相机列表
```typescript
let cameraArray: Array<camera.CameraDevice> = cameraManager.getSupportedCameras();
```
##### 1.3 通过getSupportedSceneModes获取支持的模式类型
```typescript
let sceneModes: Array<camera.SceneMode> = cameraManager.getSupportedSceneModes(cameraArray[0]);
```
#### 2 步骤二：通过 cameraManager.createCameraInput获取相机输入
创建相机输入
```typescript
let cameraInput: camera.CameraInput = cameraManager.createCameraInput(cameraArray[0]);
```
#### 3   步骤三：通过cameraManager.createPreviewOutput获取预览输出流
```typescript
let previewOutput: camera.PreviewOutput = cameraManager.createPreviewOutput(previewProfilesArray[0], surfaceId);
```
#### 4   步骤四：获取录像输出流
##### 4.1    步骤一：创建avRcorder的surface
```typescript
let avRecorder: media.AVRecorder = await media.createAVRecorder();
let videoSurfaceId = await avRecorder.getInputSurface();
```
##### 4.2    步骤二: 配置AVRecorderProfile信息
```typescript
let aVRecorderProfile: media.AVRecorderProfile = {
fileFormat : media.ContainerFormatType.CFT_MPEG_4, // 视频文件封装格式，只支持MP4
videoBitrate : 100000, // 视频比特率
videoCodec : media.CodecMimeType.VIDEO_AVC, // 视频文件编码格式，支持avc格式
videoFrameWidth : 640,  // 视频分辨率的宽
videoFrameHeight : 480, // 视频分辨率的高
videoFrameRate : 30 // 视频帧率
};
```
##### 4.3    步骤三：创建视频录制的参数
```typescript
let aVRecorderConfig: media.AVRecorderConfig = {
videoSourceType: media.VideoSourceType.VIDEO_SOURCE_TYPE_SURFACE_YUV,
profile: aVRecorderProfile,
url: "fd://" + file.fd,//获取文件的fd,且创建的文件要有读写权限
rotation: 90 // 90°为默认竖屏显示角度，如果由于设备原因或应用期望以其他方式显示等原因，请根据实际情况调整该参数
};
```
注：预览流与录像输出流的分辨率的宽(videoFrameWidth)高(videoFrameHeight)比要保持一致

##### 4.4   步骤四：创建avrecorder和录像输出流videoOutput
```typescript
// 创建avRecorder
let avRecorder: media.AVRecorder = await media.createAVRecorder();
// avRecorder准备
avRecorder.prepare(aVRecorderConfig);
// 创建VideoOutput对象
let videoOutput: camera.VideoOutput | undefined = undefined;
// createVideoOutput传入的videoProfile对象的宽高需要和aVRecorderProfile保持一致。
let videoProfile: undefined | camera.VideoProfile = videoProfilesArray.find((profile: camera.VideoProfile) => {
return profile.size.width === aVRecorderProfile.videoFrameWidth && profile.size.height === aVRecorderProfile.videoFrameHeight;
});
videoOutput = cameraManager.createVideoOutput(videoProfile, videoSurfaceId);
```
#### 5   步骤五：会话配置
```typescript
//创建会话
let videoSession: camera.CaptureSession | undefined = undefined;
videoSession.beginConfig();
// 向会话中添加相机输入流
videoSession.addInput(cameraInput);
// 向会话中添加预览输出流
videoSession.addOutput(previewOutput);
// 向会话中添加录像输出流
videoSession.addOutput(videoOutput);
// 提交会话配置
videoSession.commitConfig();
// 启动会话
videoSession.start();
```
#### 6   步骤六：开始、停止录像
```typescript
// 启动录像输出流
videoOutput.start()
// 开始录像
avRecorder.start();
// 停止录像
avRecorder.stop();
```
#### 7 步骤七：释放资源
```typescript
// 停止当前会话
videoSession.stop();
// 释放相机输入流
cameraInput.close();
// 释放预览输出流
previewOutput.release();
// 释放录像输出流
videoOutput.release();
// 释放会话
videoSession.release();
// 会话置空
videoSession = undefined;
```
## 工程目录
```
entry/src/main/ets/
|---entryability
|   |---EntryAbility.ets
|---utils
|   |---DateTimeUtils.ets           // 获取当前时间
|   |---FileUtils.ets               // 查看文件相关
|   |---Logger.ets                  // 日志打印
|---pages
|   |---Index.ets                   // 入口页面
|   |---CameraMain.ets              // 自定义相机
|   |---Recorder.ets                // 录制视频

```

## ChangeLog

| 修改内容 |     时间     | 
|------|:----------:|
| 提交   | 2025.02.18 |

## 一份简单的问卷反馈

亲爱的Harmony Next开发者，您好！<br>
为了协助您高效开发，提高鸿蒙场景化示例的质量，希望您在浏览或使用后抽空填写一份简单的问卷，我们将会收集您的宝贵意见进行优化:heart:

[:arrow_right: **点击此处填写问卷** ](https://wj.qq.com/s2/19042938/95ab/)

<div style="text-align: left;">