videoRecorder

来自于:开发者立即使用

open setOrientation start stop close show hide setRect getZoom setZoom getFlashlight setFlashlight getCamera setCamera setFocusMode setFocusRegion setFocusBox hideFocusBox addEventListener startCallback takePhoto videoShot getDeviceOrientation

论坛示例

为帮助用户更好更快的使用模块,论坛维护了一个示例,示例中包含示例代码、知识点讲解、注意事项等,供您参考。

概述

videoRecorder 模块封装了原生录像机的相关功能,通过本模块的 open 接口可打开摄像头的 frame ,可通过相应参数配置其位置、大小、视频质量、保存路径等信息。开发者可通过 open 一个自定义界面的 frame 覆盖在本模块上来自定义录像界面。

模块功能概览:

0,自定义录像界面

1,开始录像

2,停止录像

3,设置、获取焦距

4,设置、获取闪光灯

5,设置、获取前置后置摄像头转换

6,重新设置镜头聚焦区

7,将录制的视频保存在指定位置

模块示意截图:

videoRecorder - 图1

模块接口

open

打开录像机

open({params}, callback(ret))

params

rect:

  • 类型:JSON 对象
  • 描述:(可选项)模块的位置及尺寸
  • 内部字段:
  1. {
  2. x: 0, //(可选项)数字类型;模块左上角的 x 坐标(相对于所属的 Window 或 Frame);默认值:0
  3. y: 0, //(可选项)数字类型;模块左上角的 y 坐标(相对于所属的 Window 或 Frame);默认值:0
  4. w: 80, //(可选项)数字类型;模块的宽度;若传'auto',页面从x位置开始自动充满所属的 Window 或 Frame 的宽度;默认:'auto'(Android平台下h要大于等于w,否则预览会拉伸)
  5. h: 50 //(可选项)数字类型;模块的高度;若传'auto',页面从y位置开始自动充满所属的 Window 或 Frame 的高度;默认:'auto'(Android平台下h要大于等于w,否则预览会拉伸)
  6. }

size:

  • 类型:JSON 对象
  • 描述:(可选项)录制的视频大小。暂仅支持iOS
  • 内部字段:
  1. {
  2. w: 320, //(可选项)数字类型;宽度;默认:rect中的w
  3. h: 480 //(可选项)数字类型;高度;默认:rect中的h
  4. }

fps:

  • 类型:数字
  • 描述:(可选项)帧率,暂仅支持iOS平台
  • 默认:30

quality:

  • 类型:字符串
  • 描述:(可选项)录像视频质量
  • 默认:medium
  • 取值范围:
    • high:超清视频
    • low:普通质量视频
    • 288p:352*288(CIF)
    • 480p:640*480
    • 720p:1280*720
    • 1080p:1920* 1080
    • 2160p:3840* 2160(不支持iPhone6 plus)
    • medium:高清视频
    • 240p:320*240(QVGA,暂仅支持 Android平台)
    • 144p:176*144(QCIF,暂仅支持 Android平台)

orientation:

  • 类型:字符串
  • 描述:(可选项)录制的视频的方向
  • 默认值:portrait
  • 取值范围:
    • portrait:竖屏,屏幕在 home 键的上面
    • right:右横屏,屏幕在 home 键的右边
    • left:左横屏,屏幕在 home 键的左边
    • upsideDown:反转竖屏,屏幕在 home 键的下面

saveToAlbum:

  • 类型:布尔
  • 描述:(可选项)录制的视频是否自动保存到系统相册(系统媒体库)
  • 默认值:false

save:

  • 类型:JSON对象
  • 描述:(可选项)录制的视频保存信息配置
  • 内部字段:
  1. {
  2. path: '', //(可选项)字符串类型;录制的视频保存的文件夹(文件若不存在则模块自动创建)路径,仅支持 fs:// 协议,若不传则保存在临时文件夹(模块会自动删除该文件)下
  3. name: '', //(可选项)字符串类型;录制的视频文件名,不需指定后缀名(模块自动添加),若不传则使用模块默认名:videoRecorder;若该目录下已存在同名文件则覆盖
  4. type: '' //(可选项)字符串类型;保存视频的格式,取值范围如下:
  5. //iOS 平台支持的类型
  6. //quickTime:后缀名为mov格式的视频文件
  7. //mpeg4(默认值):后缀名为mp4格式的视频文件
  8. //appleM4V:后缀名为m4v格式的视频文件
  9. //appleM4A:后缀名为m4a格式的视频文件
  10. //3gpp:后缀名为3gp格式的视频文件
  11. //3gp2:后缀名为3g2格式的视频文件
  12. //Android 平台支持的类型
  13. //mpeg4(默认值):后缀名为mp4格式的视频文件
  14. //3gpp:后缀名为3gp格式的视频文件
  15. }

camera:

  • 类型:字符串
  • 描述:(可选项)摄像头
  • 默认值:back
  • 取值范围:
    • front:前置摄像头
    • back:后置摄像头

fixedOn:

  • 类型:字符串类型
  • 描述:(可选项)模块添加到指定 frame 的名字(只指 frame,传 window 无效)
  • 默认:模块依附于当前 window

fixed:

  • 类型:布尔
  • 描述:(可选项)模块是否随所属 window 或 frame 滚动
  • 默认值:true(不随之滚动)

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. eventType: 'show', //字符串类型;扫码事件类型
  3. //取值范围:
  4. //show:打开录像机并显示在屏幕上
  5. //finished:录像结束
  6. //fail:无访问摄像头或麦克风权限
  7. filePath: '', //字符串类型;录像视频文件绝对路径,仅当 eventType 为 finished 时有值
  8. albumPath: '', //字符串类型;录像视频文件在系统相册的路径,仅当 eventType 为 finished,且 saveToAlbum 为 true 时有值
  9. duration: 1000, //数字类型;录像视频文件的时长,单位:毫秒,仅当eventType 为 finished 时有值。duration字段返回的总时长小于等于0时说明录制的视频是无效文件,前端根据自己需求进行处理。
  10. size: 1024, //数字类型;录像视频文件的大小,单位:字节,仅当 eventType 为 finished 时有值
  11. errMsg:" //错误信息提示。仅当 eventType 为 fail 时有值。
  12. thumbnailPath:'' //字符串类型;录制完成视频的缩略图路径
  13. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.open({
  3. rect: {
  4. x: 0,
  5. y: 0,
  6. w: api.frameWidth,
  7. h: api.frameWidth - 20
  8. },
  9. quality: "medium",
  10. saveToAlbum: false,
  11. save: {
  12. path: 'fs://videoRecorder',
  13. name: 'firstVideo'
  14. },
  15. fixedOn: api.frameName,
  16. fixed: false
  17. }, function(ret) {
  18. if (ret) {
  19. alert(JSON.stringify(ret));
  20. }
  21. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setOrientation

设置摄像头方向,请在调用 start 接口之前调用

注意:

视频录制过程中涉及到两个方向: 1,录制的视频的方向; 2,open打开的视频预览区域的方向;其中1(录制的视频的方向)一般设置成当前设备的方向,开始录制(start)后便不能再改变。2(open打开的视频预览区域的方向)必须跟当前window方向(通过api.setScreenOrientation设置的方向)一致。

setOrientation({params}, callback(ret))

params

target:

  • 类型:字符串
  • 描述:(可选项)设置方向的对象
  • 默认值:reecordedVideo
  • 取值范围:
    • preview:设置open接口打开的预览区域的方向(须与当前Windows方向一致)
    • reecordedVideo:设置录制的视频的方向(建议与当前设备方向一致)

orientation:

  • 类型:字符串
  • 描述:(可选项)录制的视频的方向
  • 默认值:portrait
  • 取值范围:
    • portrait:竖屏,屏幕在 home 键的上面
    • right:右横屏,屏幕在 home 键的右边
    • left:左横屏,屏幕在 home 键的左边
    • upsideDown:反转竖屏,屏幕在 home 键的下面

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.setOrientation({
  3. orientation: 'right'
  4. target:''
  5. });

可用性

iOS系统,Android系统

可提供的1.0.5及更高版本

start

开始录像

start({params})

params

timer:

  • 类型:数字
  • 描述:(可选项)视频录制倒计时计时器,单位为秒(s),亦可通过 stop 接口停止录像
  • 默认值:无限大

save:

  • 类型:JSON对象
  • 描述:(可选项)录制的视频保存信息配置,若本参数不传,则以open 接口内的 save参数为准
  • 内部字段:
  1. {
  2. path: '', //(可选项)字符串类型;录制的视频保存的文件夹(文件若不存在则模块自动创建)路径,仅支持 fs:// 协议,若不传则保存在临时文件夹(模块会自动删除该文件)下
  3. name: '', //(可选项)字符串类型;录制的视频文件名,不需指定后缀名(模块自动添加),若不传则使用模块默认名:videoRecorder;若该目录下已存在同名文件则覆盖
  4. type: '' //(可选项)字符串类型;保存视频的格式,取值范围如下:
  5. //iOS 平台支持的类型
  6. //quickTime:后缀名为mov格式的视频文件
  7. //mpeg4(默认值):后缀名为mp4格式的视频文件
  8. //appleM4V:后缀名为m4v格式的视频文件
  9. //appleM4A:后缀名为m4a格式的视频文件
  10. //3gpp:后缀名为3gp格式的视频文件
  11. //3gp2:后缀名为3g2格式的视频文件
  12. //Android 平台支持的类型
  13. //mpeg4(默认值):后缀名为mp4格式的视频文件
  14. //3gpp:后缀名为3gp格式的视频文件
  15. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.start({
  3. timer: 10
  4. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

stop

停止录像

stop({params})

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.stop();

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

close

关闭录像机

close()

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.close();

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

show

显示已隐藏的录像机

show()

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.show();

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

hide

隐藏录像机,并没有从内存里清除

hide()

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.hide();

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setRect

重设拍摄区域的大小和位置

setRect({params})

params

rect:

  • 类型:JSON 对象
  • 描述:(可选项)重设模块的位置及尺寸
  • 内部字段:
  1. {
  2. x: 0, //(可选项)数字类型;模块左上角的 x 坐标(相对于所属的 Window 或 Frame);默认值:原值
  3. y: 0, //(可选项)数字类型;模块左上角的 y 坐标(相对于所属的 Window 或 Frame);默认值:原值
  4. w: 80, //(可选项)数字类型;模块的宽度;默认:原值
  5. h: 50 //(可选项)数字类型;模块的高度;默认:原值
  6. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.setRect({
  3. rect: {
  4. x: 10,
  5. y: 64,
  6. w: 300,
  7. h: 300
  8. }
  9. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

getZoom

获取录像机当前缩放数值

getZoom(callback(ret))

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true, //布尔型;是否获取成功
  3. zoom: //数字类型;当前录像机的焦距
  4. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.getZoom(function(ret) {
  3. if (ret.status) {
  4. alert(JSON.stringify(ret));
  5. }
  6. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setZoom

设置视图大小,若为 2 则表示远视图被放大一倍

setZoom({params})

params

zoom:

  • 类型:数字类型
  • 描述:(可选项)设置的焦距大小(视图被放大的倍数),取值范围:大于 1.0
  • 默认:1.0

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.setZoom({
  3. zoom: 0
  4. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

getFlashlight

获取当前闪关灯状态

getFlashlight(callback(ret))

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true, //布尔型;是否获取成功
  3. flashlight: 'off' //字符串类型;当前录像机的闪光灯状态,取值范围如下:
  4. //on:打开
  5. //off:关闭
  6. //auto:自动
  7. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.getFlashlight(function(ret) {
  3. if (ret.status) {
  4. alert(JSON.stringify(ret));
  5. }
  6. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setFlashlight

设置闪关灯,在 iOS 平台上,前置摄像头打开时不支持操作闪光灯

setFlashlight({params})

params

flashlight:

  • 类型:字符串
  • 描述:(可选项)闪光灯类型
  • 默认值:off
  • 取值范围:
    • on:打开闪光灯
    • off:关闭闪关灯
    • auto:根据当前设备所处环境的光线强度自动打开关闭闪光灯

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.setFlashlight({
  3. flashlight: 'on'
  4. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

getCamera

获取当前占用的摄像头

getCamera(callback(ret))

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true, //布尔型;是否获取成功
  3. camera: 'front' //字符串类型;当前录像机的占用的摄像头,取值范围如下:
  4. //front:前置摄像头
  5. //back:后置摄像头
  6. //unspecified:未启用
  7. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.getCamera(function(ret) {
  3. if (ret.status) {
  4. alert(JSON.stringify(ret));
  5. }
  6. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setCamera

设置前置/后置摄像头

setCamera({params})

params

camera:

  • 类型:字符串
  • 描述:(可选项)摄像头
  • 默认值:back
  • 取值范围:
    • front:前置摄像头
    • back:后置摄像头

animation:

  • 类型:布尔
  • 描述:(可选项)切换摄像头时是否带动画效果,本参数暂仅支持iOS平台
  • 默认值:false

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.setCamera({
  3. camera: 'back'
  4. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setFocusMode

设置当前录像机对焦模式,配合 setFocusRegion 接口使用

setFocusMode({params})

params

focusMode:

  • 类型:字符串
  • 描述:(可选项)对焦模式
  • 默认值:continue
  • 取值范围:
    • auto:自动对焦
    • continue:连续自动对焦
    • locked:锁定对焦

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.setFocusMode({
  3. focusMode: 'auto'
  4. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setFocusRegion

设置当前录像机对焦区域,需要跟 setFocusMode 接口同时使用。

若 setFocusBox 接口内 autoHide 参数为非 0 数字,则显示的聚焦提示框会在 autoHide 毫秒后自动隐藏。

若 setFocusBox 接口内 animation 参数为 true,则显示/隐藏聚焦提示框时会有动画。

setFocusRegion({params})

params

region:

  • 类型:JSON对象
  • 描述:(可选项)焦点坐标(在录像区域内的坐标,原点在该区域左上角,往右为x轴,下为y轴)
  • 注意:从1.1.3开始,android中w和h参数作废
  • 默认值:原焦点坐标
  • 内部字段:
  1. {
  2. x: 20, //数字类型;聚焦区域中点 x 坐标
  3. y: 20, //数字类型;聚焦区域中点 y 坐标
  4. w: 60, //数字类型;聚焦区域的宽,在 iOS 平台上忽略此参数(系统自动设置)
  5. h: 60 //数字类型;聚焦区域的高,在 iOS 平台上忽略此参数(系统自动设置)
  6. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.setFocusRegion({
  3. region: {
  4. x: 20,
  5. y: 20,
  6. w: 60,
  7. h: 60
  8. }
  9. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

setFocusBox

设置当前录像机对焦提示框样式

注意:只需在需要修改对焦框样式的时候设置一次即可,不必在click事件里每次都设置

setFocusBox({params})

params

box:

  • 类型:字符串
  • 描述:(可选项)对焦提示框样式配置,该提示框是一个空心的正方形框。当调用setFocusRegion接口时,如果 animation 参数为 true,该提示框的显示与隐藏会有动画。
  • 动画过程:
    • 1,在焦点位置显示一个大提示框(提示框大小见内部字段 maxSize)
    • 2,将此提示框缩小(提示框大小见内部字段 minSize),此缩小动画持续时长为 300 毫秒
    • 3,持续一段时间(时长见 autoHide 字段)后隐藏该提示框
    • 4,显示渐变淡出该提示框的动画(动画持续时长 100 毫秒),隐藏提示框
  • 默认值:见内部字段
  • 内部字段:
  1. {
  2. width: 2.0, //(可选项)数字类型;提示框边框粗细,icon参数有值时本参数无效;默认:2.0
  3. color: '#ADFF2F',//(可选项)字符串类型;提示框边框颜色,icon参数有值时本参数无效,支持rgb、rgba、#;默认:#ADFF2F
  4. maxSize: 80.0, //(可选项)数字类型;提示框放大时的边长;默认:80.0
  5. minSize: 60.0 //(可选项)数字类型;提示框缩小时的边长;默认:60.0
  6. }

icon:

  • 类型:字符串
  • 描述:(可选项)自定义的提示框图标路径,要求本地路径(支持fs://、widget://协议),图标大小为:80*80
  • 默认:若不传该参数则显示 box 默认提示框,若传该参数使用该参数指向的图标。焦点改变时,该提示框的动画效果同 box 定义的一致

autoHide:

  • 类型:数字
  • 描述:(可选项)设置对焦提示框自动隐藏时间,当为 -1 时,不自动隐藏,需调用 hideFocusBox 接口手动隐藏
  • 默认值:0

animation:

  • 类型:布尔类型
  • 描述:(可选项)设置对焦提示框显示和隐藏时是否使用动画
  • 默认值:true

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.setFocusBox({
  3. box: {
  4. width: 1,
  5. color: '#ff0',
  6. maxSize: 100,
  7. minSize: 60
  8. }
  9. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

hideFocusBox

隐藏对焦提示框

hideFocusBox({params})

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.hideFocusBox();

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

addEventListener

事件监听

addEventListener({params}, callback(ret))

params

name:

  • 类型:字符串
  • 描述:监听的事件类型
  • 取值范围:

    1. - click:单击摄像区域事件
    2. - doubleClick:双击摄像区域事件

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. x: 100, //数字类型;触发点的 x 坐标
  3. y: 100 //数字类型;触发点的 y 坐标
  4. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.addEventListener({
  3. name: 'click'
  4. }, function(ret) {
  5. if (ret) {
  6. alert(JSON.stringify(ret));
  7. }
  8. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

startCallback

开始录像后的监听,此接口只适用于android;

startCallback(callback(ret))

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true, //布尔类型;录像是否在进行
  3. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.startCallback(function(ret) {
  3. if (ret) {
  4. alert(JSON.stringify(ret));
  5. }
  6. });

可用性

Android系统

可提供的1.0.5及更高版本

takePhoto

拍照

takePhoto({params}, callback(ret))

params

album:

  • 类型:布尔
  • 描述:(可选项)照片是否保存到相册,需要申请相关权限
  • 默认值:false

path:

  • 类型:字符串
  • 描述:(可选项)拍照保存地址,需要写明后缀名jpg,如:fs://abc.jpg

quality:

  • 类型:数值
  • 描述:(可选项)照片质量,取值 0-1.0
  • 默认值:1.0

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true, //布尔类型;是否拍照并保存成功(保存到相册或保存到指定路径都视为保存成功)
  3. path: '', //字符串类型;拍摄照片存在本地的绝对路径
  4. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.takePhoto({
  3. album: false,
  4. path: 'fs://videoRecorder'
  5. }, function(ret) {
  6. if (ret.status) {
  7. alert(JSON.stringify(ret));
  8. }
  9. });

可用性

iOS系统,Android系统

可提供的1.0.0及更高版本

videoShot

对录制视频截图,本接口暂仅支持iOS端

videoShot({params}, callback(ret))

params

album:

  • 类型:布尔
  • 描述:(可选项)照片是否保存到相册,需要申请相关权限
  • 默认值:false

path:

  • 类型:字符串
  • 描述:(可选项)拍照保存地址,需要写明后缀名jpg,如:fs://abc.jpg

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true, //布尔类型;是否截图并保存成功(保存到相册或保存到指定路径都视为保存成功)
  3. path: '', //字符串类型;拍摄截图存在本地的绝对路径
  4. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.videoShot({
  3. album: false,
  4. path: 'fs://videoRecorder'
  5. }, function(ret) {
  6. if (ret.status) {
  7. alert(JSON.stringify(ret));
  8. }
  9. });

可用性

iOS系统

可提供的1.0.0及更高版本

getDeviceOrientation

获取当前设备方向

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. orientation: 'unknown' //字符串类型;当前设备方向,取值范围如下:
  3. //unknown:未知
  4. //portrait:竖直,home键在下面
  5. //portraitUpsideDown:竖直,home键在上面
  6. //left:水平,home键在右边
  7. //right:水平,home键在左边
  8. //faceUp:平放,屏幕朝上,iOS端暂不支持
  9. //faceDown:平放,屏幕朝下,iOS端暂不支持
  10. }

示例代码

  1. var videoRecorder = api.require('videoRecorder');
  2. videoRecorder.getDeviceOrientation(function(ret) {
  3. alert(JSON.stringify(ret));
  4. });

可用性

iOS系统,Android系统

可提供的1.0.6及更高版本

论坛示例

为帮助用户更好更快的使用模块,论坛维护了一个示例,示例中包含示例代码、知识点讲解、注意事项等,供您参考。