imageCutOut

来自于:开发者立即使用

openCropView hideCropView showCropView closeCropView clipImage saveImage

论坛示例

为帮助用户更好更快的使用模块,论坛维护了一个示例,示例中包含示例代码供您参考。

概述

imageCutOut模块封装了 iOS、Android 原生图片剪切的功能。用户可以改变剪切框大小对图片进行剪切(注意:安卓和iOS的剪切框有差异,但是剪切效果一样)。

固件要求

Android:4.0及以上 iOS:7.0及以上

模块接口

openCropView

打开剪切预览视图

openCropView({params}, callback(ret, err))

params

rect:

  • 类型:JSON 对象
  • 默认值:见内部字段
  • 描述:(可选项)浏览器窗口的位置和大小,设置margin后,在不同手机上面会保持与父页面的各方向边距一致,而中间区域会自动扩充。建议使用margin布局,可以完美适配带smartBar的手机。
  • 内部字段:
  1. {
  2. x:0, //左上角x坐标,默认0
  3. y:0, //左上角y坐标,默认0
  4. w:320, //宽度,默认'auto',页面从x位置开始自动充满父页面宽度
  5. h:480 //高度,默认'auto',页面从y位置开始自动充满父页面高度
  6. marginLeft:0, //相对父页面左外边距的距离,默认0
  7. marginTop:0, //相对父页面上外边距的距离,默认0
  8. marginBottom:0, //相对父页面下外边距的距离,默认0
  9. marginRight:0 //相对父页面右外边距的距离,默认0
  10. }

fixedOn:

  • 类型:字符串
  • 描述:(可选项)模块所属 Frame 的名字,若不传则模块归属于当前 Window

fixed:

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

filePath:

  • 类型:字符串
  • 描述:(必填项)设置需要剪切的本地图片路径(支持fs:// widget://)[备注:安卓不支持widget路径]。

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true, //布尔型;true||false
  3. }

err:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. msg : '' //错误信息内容
  3. }

示例代码

  1. var demo = api.require('imageCutOut');
  2. demo.openCropView({
  3. rect : {
  4. x : 0,
  5. y : 100,
  6. w : api.frameWidth,
  7. h : api.frameHeight*2/3
  8. },
  9. fixedOn : api.frameName,
  10. fixed : true,
  11. filePath : 'widget://image/timg-3.jpeg'
  12. },function(ret, err) {
  13. alert(JSON.stringify(ret));
  14. });

可用性

Android、iOS系统

可提供的1.0.0及更高版本

hideCropView

隐藏预览剪切视图

hideCropView(callback(ret, err))

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true //布尔型;true||false
  3. }

err:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. msg : '' //错误信息内容
  3. }

示例代码

  1. var demo = api.require('gridSlide');
  2. demo.hideCropView(function(ret, err) {
  3. alert(JSON.stringify(ret));
  4. });

可用性

Android、iOS系统

可提供的1.0.0及更高版本

showCropView

显示预览剪切视图

showCropView(callback(ret, err))

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true //布尔型;true||false
  3. }

err:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. msg : '' //错误信息内容
  3. }

示例代码

  1. var demo = api.require('gridSlide');
  2. demo.showCropView(function(ret, err) {
  3. alert(JSON.stringify(ret));
  4. });

可用性

Android、iOS系统

可提供的1.0.0及更高版本

closeCropView

关闭预览剪切视图

closeCropView(callback(ret, err))

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true //布尔型;true||false
  3. }

err:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. msg : '' //错误信息内容
  3. }

示例代码

  1. var demo = api.require('gridSlide');
  2. demo.closeCropView(function(ret, err) {
  3. alert(JSON.stringify(ret));
  4. });

可用性

Android、iOS系统

可提供的1.0.0及更高版本

clipImage

剪切图片

clipImage(callback(ret, err))

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true //布尔型;true||false
  3. }

err:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. msg : '' //错误信息内容
  3. }

示例代码

  1. var demo = api.require('gridSlide');
  2. demo.clipImage(function(ret, err) {
  3. alert(JSON.stringify(ret));
  4. });

可用性

Android、iOS系统

可提供的1.0.0及更高版本

saveImage

保存剪切的图片

saveImage(callback(ret, err))

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. status: true, //布尔型;true||false
  3. imagePath : ''
  4. }

err:

  • 类型:JSON 对象
  • 内部字段:
  1. {
  2. msg : '' //错误信息内容
  3. }

示例代码

  1. var demo = api.require('gridSlide');
  2. demo.saveImage(function(ret, err) {
  3. alert(JSON.stringify(ret));
  4. });

可用性

Android、iOS系统

可提供的1.0.0及更高版本