waterImageMark

立即使用

addMark getImageObject clearCache

论坛示例

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

概述

waterImageMark是一个手机端图片添加水印插件,主要实现如下功能:

一、文字水印的自定义

1、文字的颜色(渐变、透明度)
2、文字大小
3、文字的背景色(透明度)
4、文字的定位
5、文字的间距
6、文字的样式
7、文字的旋转
8、文字的渐变(渐变的横向坐标,颜色)

二、图片logo水印自定义

1、图片的间距
2、图片的定位
3、图片的间距
4、图片的旋转
5、图片的透明度
6、图片的宽高设置(待实现)
7、图片的变形(待实现)

addMark

添加图片水印

addMark({params}, callback(ret))

params

imagePath:

  • 类型:字符串
  • 描述:必填值,需要添加水印的路径(真实路径)
  • 默认值:空
  • 内部字段:

markPath:

  • 类型:字符串
  • 描述:选填值,添加在图片上的logo水印
  • 默认值:空
  • 内部字段:

savePath:

  • 类型:字符串
  • 描述:选填值,水印图片保存的输出位置
  • 默认值:更目录/waterImageMark
  • 内部字段:

margin:

  • 类型:JSON对象
  • 描述:水印的微调x和y轴的间距(注意在水印位置为10时该属性无效)
  • 默认值:x轴为0、y轴为0
  • 内部字段:

compress:

  • 类型:Number类型
  • 描述:输出水印图片的压缩率
  • 默认值:100(不压缩)~0(越低压缩越厉害)
  • 内部字段:

position:

  • 类型:JSON对象
  • 描述:水印位置,当type取值为9时x、y必填,当为10时margin参数无效
  • 默认值:type默认值为0
type的取值范围:
0--->TOP_LEFT;
1--->TOP_CENTER;
2--->TOP_RIGHT;
3--->CENTER_LEFT;
4--->CENTER;
5--->CENTER_RIGHT;
6--->BOTTOM_LEFT;
7--->BOTTOM_CENTER;
8--->BOTTOM_RIGHT;
9--->CUSTOM;
10--->TILE;
11--->CENTER;

textAttr:

  • 类型:JSON对象
  • 描述:文字水印的参数
  • 默认值:
  • 内部字段:
alpha               ----> 0~255
rotation            ----> -360~360
font                ----> 同水印logo需真实路径
backgroundColorAlpha----> 同alpha
shader 渐变
    colorList 渐变色数组
    shaderX: 渐变X坐标,
    shaderY: 渐变Y坐标,

callback(ret)

{
    "status":true,  //布尔类型;是否成功添加水印,true|false
    "data":"/storage/emulated/0/dearxy1568712093075.jpg" //字符串类型;添加水印成功后的图片的路径; 仅当 status 为 true 时输出
}


示例代码
var param = {
        imagePath: "/storage/emulated/0/UZMap/A0000000000001/picture/p-d84d51d5.jpg",
        markPath: "/storage/emulated/0/UZMap/A0000000000001/picture/p-d84d51d5.jpg",
        margin: {
            x: 180,
            y: 180
        },
        position:{
            type: 1,
            x: 100,
            y: 100
        },
        markType: 0,
        textAttr: {
            text: "测试水印效果",
            size: 50,
            color: "#000000",
            alpha: 255,
            rotation: 45,
            font: "",
            backgroundColor: "#00ff00",
            backgroundColorAlpha: 255,
            shader: {
                colorList: ["#ff0000","#0000ff"],
                shaderX: 100,
                shaderY: 100,
            }
        },
};
uzmodulemarkdemo.addMark(param, function(ret, err){
        console.log(JSON.stringify(ret));
});
可用性

iOS、Android系统

可提供的1.0.0及更高版本

getImageObject

获取图片信息

getImageObject({params}, callback(ret))

params

imagePath:

  • 类型:字符串
  • 描述:必填值,需要获取图片信息的路径(真实路径)
  • 默认值:空
  • 内部字段:

callback(ret)

{
    "status":true, //布尔类型;是否成功添加水印,true|false
    "data":{      JSON类型,在status为true时有效        
        "width":748,
        "height":600
    }
}
示例代码
var param = {imagePath: "/storage/emulated/0/UZMap/A0000000000001/picture/p-d84d51d5.jpg"};
uzmodulemarkdemo.getImageObject(param, function(ret, err){
    console.log(JSON.stringify(ret));
})

clearCache

清除图片缓存数据

clearCache(callback(ret))

callback(ret)

{
    "status":true, //布尔类型;是否成功添加水印,true|false
}
示例代码
uzmodulemarkdemo.clearCache(function(ret, err){
    console.log(JSON.stringify(ret));
})