# 自定义视频渲染
#### 功能描述
实时音视频传输过程中，上层应用可以不用SDK默认的渲染功能，选择对视频帧数据进行自定义渲染。
 #### 接口调用流程
![](https://support.huaweicloud.com/bestpractice-rtc/zh-cn_image_0000001226293247.png)
#### 实现过程
1. **加入房间前开启视频自渲染**
   加入房间前调用接口setExternalVideoFrameOutputWithFormat 打开视频自渲染功能。
   ```
   //开启远端或者本地的视频自渲染
   HwRtcImageBufferFormat * fileFormat = [[HwRtcImageBufferFormat alloc] init];
    fileFormat.format = HWRtcVideoImageFormatYUV420P;
    fileFormat.bufferType = HWRtcVideoImageBufferByteArray; 
   [rtcEngine setExternalVideoFrameOutputWithFormat:fileFormat remoteEnable:YES localEnable:YES];
   ```
   
2. **加入房间**
   参考[接口调用流程]中加入房间的时序图步骤加入房间。
   
3. **渲染远端视频流**
   当远端用户加入房间后会触发onRemoteUserOnline回调，在该回调中使用startRemoteStreamView方法开启接收远端用户的视频流，如果不开启，无法渲染远端视频流。
   ```
   //远端用户加入房间后触发的回调
   - (void)onRemoteUserOnline:(NSString * _Nonnull)roomId
                userId:(NSString * _Nonnull)userId
              userName:(NSString * _Nonnull)userName
   {
   //创建视频画布对象
   HWRtcVideoCanvas *canvas = [[HWRtcVideoCanvas alloc] init];
   canvas.uid = @”remote userId”;
   canvas.view = [[HWRtcView alloc] initWitFrame:(0,0,100,100)];
    
   // 开启远端视频流接收
    // @param remote 参考 HWRtcVideoCanvas
    // @param streamType  视频分辨率
    / /@param disableAdjustRes: 禁用分辨率自适应，默认关闭。
   [rtcEngine startRemoteStreamView:canvas streamType:HWRtcStreamTypeHD disableAdjustRes:YES];
   }
   ```
   
4. **触发回调**
   加入房间后sdk会根据前面的参数设置调用onRenderExternalVideoFrame回调函数上报本地和远端视频帧数据给上层应用处理。
   ```
   //自渲染回调
   - (void)onRenderExternalVideoFrame:(NSString *_Nonnull)roomid
               meidaDirection:(HWRtcMediaDirection)meidaDirection
                   videoFrame:(HWRtcVideoFrame * _Nonnull)videoFrame
   {
   //获取videoFrame，进行数据处理
   }
   ```
   
 
#### API参考
[setExternalVideoFrameOutputWithFormat](https://support.huaweicloud.com/csdk-rtc/rtc_05_0063.html#section3)
[onRemoteUserOnline](https://support.huaweicloud.com/csdk-rtc/rtc_05_0065.html#section4)
[startRemoteStreamView](https://support.huaweicloud.com/csdk-rtc/rtc_05_0057.html#section14)
[onRenderExternalVideoFrame](https://support.huaweicloud.com/csdk-rtc/rtc_05_0065.html#section29)