txCameraRecord
论坛示例
为帮助用户更好更快的使用插件，论坛维护了一个示例，示例中包含示例代码供您参考。
概述
短视频 UGSV 简介
短视频 ( User Generated Short Video，UGSV )，基于腾讯云强大的上传、存储、转码、分发的云点播能力，提供集成了采集、剪辑、拼接、特效、分享、播放等功能的客户端 SDK，并整合腾讯的 IM、社交、用户画像数据以及最顶尖的 AI 人脸识别和图像检测技术，帮助用户聚焦业务本身，快速轻松实现基于移动端的短视频应用。
txCameraRecord 插件概述
本插件封装了腾讯短视频SDK中的录制、编辑、美颜、特效等功能。
##注意： 插件从1.1.0版本开始需要和 UIListView 插件一起使用来处理音乐列表加载逻辑，使用的是开源UIListView插件版本，UIListView插件开源地址：https://github.com/apicloudcom/UIListView
固件要求
Android：4.1及以上 iOS：8.0及以上
插件接口
setLicence
设置授权
setLicence({params}, callback(ret, err))
params
ugcLicenceUrl：
- 类型：字符串
- 描述：（必填项）从腾讯云平台获取的LicenseUrl。参考腾讯官方申请说明
ugcKey：
- 类型：字符串
- 描述：（必填项）从腾讯云平台获取的Key。参考腾讯官方申请说明
callback(ret, err)
ret：
- 类型：JSON对象
- 内部字段：
{
status: true, //布尔型；true||false
}
err：
- 类型：JSON对象
- 内部字段：
{
msg: "",
}
示例代码
var demo = api.require('txCameraRecord');
demo.setLicence({
ugcLicenceUrl : 'http://license.vod2.myqcloud.com/license/v1/TXUgcSDK.licence',
ugcKey : '0a8ee791929052b2dce775c308e'
},function(ret, err){
alert(JSON.stringify(ret) +" "+ JSON.stringify(err));
});
可用性
iOS、Android系统
可提供的1.0.0及更高版本
getLicenceInfo
获取授权信息
setLicence(callback(ret))
callback(ret)
ret：
- 类型：JSON对象
- 内部字段：
{
status: true, //布尔型；true
licence : '', //sdk返回的授权信息字符串
}
示例代码
var demo = api.require('txCameraRecord');
demo.getLicenceInfo(function(ret, err){
api.alert({msg: JSON.stringify(ret)});
});
可用性
iOS、Android系统
可提供的1.0.0及更高版本
startVideoRecordActivity
短视频录制
startVideoRecordActivity({params}, callback(ret))
params
aspectRatio：
- 类型：数字型
- 描述：（可选项）录制视频比例 （0 > 1:1 1 > 4:3 2 > 16:9）。
- 默认值：0
recordResolution：
- 类型：数字型
- 描述：（可选项）录制分辨率 （0 > 360_640 1 > 540_960 2 > 720_1280）。
- 默认值：0
biteRate：
- 类型：数字型
- 描述：（可选项）码率 （范围：600-4800）。
- 默认值：2400
fps：
- 类型：数字型
- 描述：（可选项）帧率 （范围：15-30）。
- 默认值：20
gop：
- 类型：数字型
- 描述：（可选项）关键帧间隔 （范围：1-10）。
- 默认值：3
logo：
- 类型：字符串
- 描述：（可选项）视频尾部水印logo（支持fs:// widget://路径）。
minDuration：
- 类型：数字型
- 描述：（可选项）视频最短时长(秒)。
- 默认值：5
maxDuration：
- 类型：数字型
- 描述：（可选项）视频最长时间（秒）。
- 默认值：60
isFront：
- 类型：布尔型
- 描述：（可选项）是否前置摄像头 （true 前置 fasle 后置）
- 默认值：true
isBeauty：
- 类型：布尔型
- 描述：（可选项）是否显示美颜按钮 （true 显示 false 隐藏）
- 默认值：true
isMusic：
- 类型：布尔型
- 描述：（可选项）是否显示音乐按钮 （true 显示 false 隐藏）
- 默认值：false
isCustomMusic：
- 类型：布尔型
- 描述：（可选项）是否自定义音乐 （true 显示插件自带音乐列表 false 点击音乐按钮返回事件并关闭录制界面**[使用该模式缺点:编辑视频时无法选择音乐]**）
- 默认值：false
musicPath：
- 类型：字符串
- 描述：（可选项）录制时播放音乐，（支持fs:// widget://路径，安卓不支持widget路径）【备注：安卓设置音乐时会覆盖麦克风的语音】
isUploadPic：
- 类型：布尔型
- 描述：（可选项）下载按钮对应图片是否显示上传图片样式 （true 显示上传按钮样式 false 显示下载按钮样式）
- 默认值：false
data：
- 类型：数组
- 描述：音乐列表的数据源，
- 内部字段：
[{
imgPath: '', //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，若不传则标题和子标题靠最左侧显示
title: '', //（可选项）字符串类型；标题，若不传或为空则 subTitle 上下位置居中显示
subTitle: '', //（可选项）字符串类型；子标题，若不传或为空则 title 上下位置居中显示
remark: '', //（可选项）字符串类型；右边备注文字
icon: '', //（可选项）字符串类型；右侧备注的图标路径（本地路径，支持fs://、widget://）
forbidden: false, //（可选项）布尔类型；是否屏蔽本条数据的点击事件和侧滑露出按钮功能，屏蔽后的样式可通过 styles->forbidden参数配置
filePath: '' //（必填项）字符串类型；在线音乐URL地址,（可支持fs://）
}]
styles:
- 类型：JSON 对象
- 描述：（可选项）插件各部分的样式
- 内部字段：
{
borderColor: '#696969', //（可选项）字符串类型；列表分割线的颜色，支持 rgb、rgba、#；默认：'#696969'
item: { //（可选项）JSON对象；列表项的样式
bgColor: '#AFEEEE', //（可选项）字符串类型；列表项的背景色，支持 rgb、rgba、#；默认：'#AFEEEE'
activeBgColor: '#F5F5F5', //（可选项）字符串类型；列表项按下时的背景色，支持 rgb、rgba、#；默认：'#F5F5F5'
height: 55, //（可选项）数字类型；列表项的高度；默认：55
imgWidth: 40, //（可选项）数字类型；列表项配图的宽度；默认：列表项的高度减去10px
imgHeight: 40, //（可选项）数字类型；列表项配图的高度；默认：列表项的高度减去10px
imgCorner: 4, //（可选项）数字类型；列表项配图的圆角大小；默认：0
placeholderImg: '', //（可选项）字符串类型；列表项配图的占位图路径（本地路径，fs://、widget://），默认：YonBuilder移动开发 图标
titleSize: 12, //（可选项）数字类型；列表项标题文字大小；默认：12
titleColor: '#000', //（可选项）字符串类型；列表项标题文字颜色，支持 rgb，rgba，#；默认：'#000000'
subTitleSize: 12, //（可选项）数字类型；列表项子标题文字大小；默认：12
subTitleColor: '#000', //（可选项）字符串类型：列表项子标题文字颜色，支持 rgb、rgba、#；默认：'#000000'
remarkColor: '#000', //（可选项）字符串类型；备注的文字颜色，支持 rgb、rgba、#；默认：'#000000'
remarkSize: 16, //（可选项）数字类型；备注的文字大小；默认：16
remarkIconWidth: 30 //（可选项）数字类型；当备注是图片时，图片的宽度，图片为正方形；默认：30
}，
forbidden: { //（可选项）JSON对象；屏蔽点击事件的列表项的样式配置
bgColor: '#B0C4DE', //（可选项）字符串类型；列表项背景色，支持rgb、#、rgba；默认：#C0C0C0
titleColor: '800000', //（可选项）字符串类型；列表项标题色，支持rgb、#、rgba；默认：#808080
subTitleColor: '#696969', //（可选项）字符串类型；列表项子标题色，支持rgb、#、rgba；默认：#808080
remarkColor: '#FFDEAD', //（可选项）字符串类型；列表项备注色，支持rgb、#、rgba；默认：#808080
sideslip: false //（可选项）布尔类型；是否只屏蔽侧滑；默认：false（侧滑和点击事件都屏蔽）
}
}
refreshHeader:
- 类型：JSON 对象
- 描述：（可选项）下拉刷新样式
- 内部字段：
{
loadingImg： '', //(可选项) 字符串 下拉刷新时显示的小箭头图标的本地路径，要求本地路径（fs://、widget://）
bgColor： '', //（可选项） 字符串 下拉刷新区域的背景色，支持 rgb、rgba、# 默认值：'#f5f5f5'
textColor：'',//（可选项）字符串 提示文字颜色，支持 rgb、rgba、# 默认值：'#8e8e8e'
textDown：'',//（可选项）字符串 下拉提示文字 默认值：下拉可以刷新...
textUp：'',//（可选项）字符串 松开提示文字 默认值：松开开始刷新...
loadingText: '',//（可选项）字符串 提示文字 默认值：正在加载...
lastUpdateText: '',//（可选项）字符串 提示文字 默认值：上次更新时间:
showTime：'',//（可选项）布尔值 是否显示刷新时间 默认值：true
}
refreshFooter:
- 类型：JSON 对象
- 描述：（可选项）上拉加载更多样式
- 内部字段：
{
loadingImg：'',//（可选项）字符串 上拉加载时显示的小箭头图标的本地路径，要求本地路径（fs://、widget://）
bgColor：'',//（可选项）字符串 上拉加载区域的背景色，支持 rgb、rgba、# 默认值：'#f5f5f5'
textColor：'',//（可选项）字符串 提示文字颜色，支持 rgb、rgba、# 默认值：'#8e8e8e'
textUp：'',//（可选项）字符串 上拉提示文字 默认值：'上拉加载更多...'
textDown：'',//（可选项）字符串 松开提示文字 默认值：'松开开始加载...'
loadingText: '',//（可选项）字符串 提示文字 默认值：正在加载...
lastUpdateText: '',//（可选项）字符串 提示文字 默认值：上次更新时间:
showTime：'',//（可选项）布尔值 是否显示刷新时间 默认值：true
}
callback(ret)
ret：
- 类型：JSON 对象
- 内部字段：
{
status: true, //布尔型；true
evenType : 'musicBtn', //isCustomMusic 为false时点击音乐按钮事件返回
data : {
filePath : '' ,
imagePath : '',
duration : 0,
}
}
示例代码
var demo = api.require('txCameraRecord');
demo.startVideoRecordActivity({
aspectRatio : 2,
recordResolution : 1,
biteRate : 3000,
fps : 25,
gop : 5,
logo : 'widget://image/tcloud_logo.png',
minDuration : 5,
maxDuration : 10,
isFront : true,
isBeauty : true,
musicPath : 'widget://res/Athena.mp3',
//一下是音乐列表设置
isMusic: true, //是否显示音乐按钮 true 显示 false 隐藏 默认 false
isCustomMusic: true, //是否自定义音乐 true 显示 false 隐藏 默认 false
data: [{
imgPath: 'http://img1.3lian.com/gif/more/11/201206/a5194ba8c27b17def4a7c5495aba5e32.jpg',
title: 'bandari(在线测试)',
subTitle: 'bandari',
//remark: '新备注',
//icon: '',
filePath: 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/be59ba6f9527382d655abc50f720871e.mp3',
}],
rightBtns: [{
bgColor: '#388e8e',
activeBgColor: '',
width: 70,
title: '选取',
titleSize: 12,
titleColor: '#fff',
icon: '',
iconWidth: 20
}],
styles: {
borderColor: '#696969',
item: {
bgColor: '#FFFFFF',
activeBgColor: '#F5F5F5',
height: 80.0,
imgWidth: 60,
imgHeight: 60,
imgCorner: 4,
placeholderImg: 'widget://image/musiclist_img_item_music_bg.png',
}
},
refreshHeader: {
loadingImg: 'widget://res/UIListView_arrow.png',
bgColor: '#F5F5F5',
textColor: '#8E8E8E',
textDown: '下拉可以刷新...',
textUp: '松开开始刷新...',
showTime: true
},
refreshFooter: {
loadingImg: 'widget://res/UIListView_arrow.png',
bgColor: '#F5F5F5',
textColor: '#8E8E8E',
textUp: '上拉加载更多...',
textDown: '松开开始加载...',
showTime: true
}
}, function(ret, err) {
api.alert({msg: JSON.stringify(ret)});
});
可用性
iOS系统，Android系统
可提供的1.0.0及更高版本
musicListEventListener
音乐列表事件监听
musicListEventListener(callback(ret))
callback(ret)
ret：
- 类型：JSON对象
- 内部字段：
{
status: true, //布尔型；true
eventType: 'show', //字符串类型；交互事件类型
//取值范围如下：
//show（插件加载成功）
//refreshHead（下拉刷新事件）
//refreshFooter（上啦加载事件）
//clickImg（点击列表项的配图）
//clickRemark（点击列表项右侧备注）
//clickContent（点击列表项的内容，除了配图和备注以外的区域,处罚这个事件时会自动播放音乐,同时下载本音乐到本地，以供录制视频使用）
index: 0, //数字类型；列表项的索引
}
示例代码
var demo = api.require('txCameraRecord');
demo.musicListEventListener(function(ret, err){
if (ret.eventType == 'show') {
} else if (ret.eventType == 'refreshHead') {
reloadData();
} else if (ret.eventType == 'refreshFooter') {
appendData();
}
});
可用性
iOS、Android系统
可提供的1.0.0及更高版本
reloadData
刷新音乐列表数据
reloadData({params}, callback(ret))
params
data：
- 类型：数组
- 描述：（可选项）音乐列表的数据源，若不传或传空，仅收起下拉刷新组件
- 内部字段：
[{
imgPath: '', //（可选项）字符串类型；列表项的配图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，若不传则标题和子标题靠最左侧显示
title: '', //（可选项）字符串类型；标题，若不传或为空则 subTitle 上下位置居中显示
subTitle: '', //（可选项）字符串类型；子标题，若不传或为空则 title 上下位置居中显示
remark: '', //（可选项）字符串类型；右边备注文字
icon: '', //（可选项）字符串类型；右侧备注的图标路径（本地路径，支持fs://、widget://）
forbidden: false, //（可选项）布尔类型；是否屏蔽本条数据的点击事件，屏蔽后的样式可通过 open->styles->forbidden参数配置
filePath: '' //（必填项）字符串类型；在线音乐URL地址,（可支持fs://）
}]
callback(ret)
ret：
- 类型：JSON 对象
- 内部字段：
{
status: true //布尔型；true||false
}
示例代码
var demo = api.require('txCameraRecord');
demo.reloadData({
data: [{
imgPath: 'http://img1.3lian.com/gif/more/11/201206/a5194ba8c27b17def4a7c5495aba5e32.jpg',
title: '新标题',
subTitle: '新子标题',
remark: '新备注',
icon: '',
filePath: 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/be59ba6f9527382d655abc50f720871e.mp3',
}]
}, function(ret) {
if (ret) {
api.alert({msg: JSON.stringify(ret)});
} else {
api.alert({msg: JSON.stringify(err)});
}
});
可用性
iOS系统，Android系统
可提供的1.0.0及更高版本
appendData
向音乐列表末端追加数据
appendData({params}, callback(ret))
params
data：
- 类型：数组对象
- 描述：音乐列表的数据源，若不传或传空，仅收起上拉加载组件
- 内部字段：
[{
imgPath: '', //（可选项）字符串类型；列表项的附图路径，支持http://、https://、widget://、fs://等协议，网络图片会被缓存到本地，若不传则标题和子标题靠最左侧显示
title: '', //（可选项）字符串类型；标题，若不传或为空则 subTitle 上下位置居中显示
subTitle: '', //（可选项）字符串类型；子标题，若不传或为空则 title 上下位置居中显示
remark: '', //（可选项）字符串类型；右边备注文字
icon: '', //（可选项）字符串类型；右侧备注的图标路径（本地路径，支持fs://、widget://）
forbidden: false, //（可选项）布尔类型；是否屏蔽本条数据的点击事件，屏蔽后的样式可通过 open->styles->forbidden参数配置
filePath: '' //（必填项）字符串类型；在线音乐URL地址,（可支持fs://）
}]
callback(ret)
ret：
- 类型：JSON 对象
- 内部字段：
{
status: true //布尔型；true||false
}
示例代码
var demo = api.require('txCameraRecord');
demo.appendData({
data: [{
imgPath: 'http://d.hiphotos.baidu.com/image/pic/item/4d086e061d950a7b29a788c209d162d9f2d3c922.jpg',
title: '新增标题',
subTitle: '新增子标题',
remark: '新增备注',
filePath: 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/be59ba6f9527382d655abc50f720871e.mp3',
}]
}, function(ret, err) {
if (ret) {
api.alert({msg: JSON.stringify(ret)});
} else {
api.alert({msg: JSON.stringify(err)});
}
});
可用性
iOS系统，Android系统
可提供的1.0.0及更高版本