更新记录

1.0.2（2023-08-25）

优化水印文字添加，单行文字绘制超过图片宽度时换行

1.0.1（2023-08-15）

水印文字行间距优化

1.0.0（2023-08-08）

1.0.0

平台兼容性

图片添加水印，支持微信小程序、H5

• 支持微信小程序、H5

  本插件为给图片添加文字水印的插件，支持微信小程序、H5使用，插件只做了文字水印，并且水印显示在图片左下角，
  若需要其它扩展水印功能（如图片水印，水印旋转等）可下载插件自行修改即可。

• 组件属性说明

  序号	属性名称	属性说明
  1	fontColor	水印文字颜色，默认为黑色

• 组件函数说明

  序号	函数名称	函数说明
  1	addWaterMark(options)	通过组件实例调用该函数为图片添加水印

• addWaterMark(options)函数参数说明

  options参数示例：
  {
  filePath: '图片文件地址',
  texts: ['水印文字1','水印文字2']
  }
  

• 组件事件说明

  序号	事件名称	事件说明
  1	callback	添加完水印后组件的回调事件，返回图片地址或图片base64（h5中为base64）

• 使用示例

  <template>
      <view>
          <button @click="clickChooseImage()">选择照片</button>
          <!-- 增加水印 -->
          <jushi-watermark-vue ref="watermark" @callback="watermarkCallback" fontColor="red"></jushi-watermark-vue>
          <view class="uni-column">
              <view class="uni-row" v-for="(item, index) in imageArr" :key="index">
                  <image :src="item" class="image" mode="widthFix" @click="previewImage(index)"></image>
              </view>
          </view>
      </view>
  </template>
  
  <script>
      export default {
          data() {
              return {
                  imageArr: []
  
              }
          },
          methods: {
              clickChooseImage() {// 选择图片
                  uni.chooseImage({
                      count: 1, // 限制的图片数量
                      sizeType: ['compressed'], // original 原图，compressed 压缩图，默认二者都有 
                      sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，默认二者都有
                      success: (res) => {
                          this.addImages(res.tempFilePaths);
                      },
                      fail: (err) => {
                          console.log('chooseImage fail', err)
                      }
                  })
              },
              addImages(filePaths) {// 添加图片
                  if (filePaths.length == 0) return
                  var texts = ["人员：晒德·黢黑", "地址：xxx省xxx市xxx区xxx街道"]
                  texts.push("水印时间：" + this.getNowTime())
                  // 添加水印
                  this.$refs.watermark.addWaterMark({
                      filePath: filePaths[0],
                      texts: texts
                  })
              },
              watermarkCallback(filePath) {//水印添加回调，在H5平台下，filePath 为 base64
                  this.imageArr.push(filePath)
              },
              getNowTime() {
                  var date = new Date(),
                      year = date.getFullYear(),
                      month = date.getMonth() + 1,
                      day = date.getDate(),
                      hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
                      minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(),
                      second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
                  month >= 1 && month <= 9 ? (month = "0" + month) : "";
                  day >= 0 && day <= 9 ? (day = "0" + day) : "";
                  return (year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second);
              },
              previewImage(index) {
                  uni.previewImage({
                      urls: this.imageArr,
                      current: index
                  })
              }
          }
      }
  </script>
  
  <style>
      .image {
          width: 300rpx;
          height: 300rpx;
          margin: 10rpx;
      }
  </style>

• 备注

  欢迎来邮件咨询和讨论，邮箱：1052775690@qq.com

  其它插件

  安卓原生插件

• 文件在线预览

• 银联支付线上收银台（通用版） 封装

• 阿里云RTC音视频通话

• 权限请求

• 文字转语音

• MQTT连接

• 获取手机通讯录联系人

• 快捷工具悬浮窗

• 日历日程事件

• 获取本地音频文件信息

• 根据经纬度获取位置信息

• WebSocket连接

• 高德地图封装安卓原生地图扩展组件

• 使用ECharts封装的安卓原生扩展组件

• 给图片添加水印

• 自定义通知栏通知

  UTS插件

• 安卓权限请求UTS插件

• 安卓文字转语音UTS插件

• 安卓获取音频文件UTS插件

  前端插件

• ECharts封装全端通用组件

• 图片添加水印，支持微信小程序、H5

• 手写签名、电子签名组件