drawingBoard
来自于:官方立即使用
open save close hide show revoke restore clear resetBrush
概述
drawingBoard 模块是一个手写签名模块。开发者可自定义个固定宽高(w、h)的 “frame”,该 “frame” 即是可手写签名的背景透明的画板,可将此画板固定在指定的 frame 或 window 上,从而自定义出符合自己需求的各种 UI 效果的签名功能。
open
打开签名画板
open({params})
params
rect:
- 类型:JSON 对象
- 描述:(可选项)签名画板的位置及尺寸
- 默认值:见内部字段
- 内部字段:
{
x: 0, //(可选项)数字类型;签名画板左上角的 X 坐标(相对于所属的 Window 或 Frame);默认:0
y: 0, //(可选项)数字类型;签名画板左上角的 Y 坐标(相对于所属的 Window 或 Frame);默认:0
w: 320, //(可选项)数字类型;签名画板的宽度;默认:所属的 Window 或 Frame 的宽度
h: 300 //(可选项)数字类型;签名画板的高度;默认:w-20
}
styles:
- 类型:JSON 对象
- 描述:画板画笔样式配置
- 默认值:见内部字段
- 内部字段:
{
brush: { //(可选项)JSON对象;画笔配置
color:'#ff0000', //(可选项)字符串类型;画笔颜色,支持#、rgb、rgba;默认:#000
width:6 //(可选项)数字类型;画笔粗细;默认:6.0;
},
bgColor: '' //(可选项)字符串类型;画板背景色,支持#、rgb、rgba、img;默认:#fff
}
fixedOn:
- 类型:字符串类型
- 描述:(可选项)签名画板添加到指定 frame 的名字(只指 frame,传 window 无效)
- 默认:模块依附于当前 window
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.open({
rect: {
x: 0,
y: 0,
w: 320,
h: 300
},
styles: {
brush: {
color: '#ff0000',
width: 6
},
bgColor: '#ff0'
},
fixedOn: api.frameName
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
save
保存签名画板截图,截图大小(宽高:w、h)同 open 时传入的 rect 大小(宽高:w、h)
save({params}, callback(ret, err))
params
savePath:
- 类型:字符串类型
- 描述:保存图片路径,要求本地路径(fs://),iOS 平台不支持 widget 路径
copyToAlbum:
- 类型:布尔类型
- 描述:(可选项)是否将结果同时保存到系统相册
- 默认:false
overlay:
- 类型:布尔类型
- 描述:(可选项)保存图片时,是否将背景一起保存
- 默认:false
callback(ret, err)
ret:
- 类型:JSON 对象
- 内部字段:
{
absolutePath: //字符串类型;图片保存到指定路径后的绝对路径,若保存失败则为该参数为 undefined
albumPath: //字符串类型;图片保存到相册后的绝对路径,若保存失败则该参数为 undefined
}
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.save({
savePath: 'fs://drawingBoard/result.png',
copyToAlbum: false
}, function(ret) {
alert(JSON.stringify(ret));
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
close
关闭签名画板
close()
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.close();
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
hide
隐藏签名画板
hide()
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.hide();
补充说明
隐藏已显示的签名画板,并没有从内存里清除
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
show
显示已隐藏的签名画板
show()
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.show();
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
revoke
撤销最新画出的笔画线条
revoke()
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.revoke();
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
restore
恢复刚撤销的笔画线条
restore()
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.restore();
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
clear
清空画板上的所有笔画线条
clear()
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.clear();
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本
resetBrush
重设画笔样式
resetBrush({params})
params
color:
- 类型:字符串
- 描述:(可选项)画笔颜色,支持#、rgb、rgba
- 默认值:原值
width:
- 类型:数字
- 描述:画笔粗细
- 默认值:原值
示例代码
var drawingBoard = api.require('drawingBoard');
drawingBoard.resetBrush({
color: '#696969',
width: 10
});
可用性
iOS系统,Android系统
可提供的1.0.0及更高版本