牙叔教程 简单易懂
效果展示
修改列数
修改行数
修改旋转角度
修改颜色
环境
手机: Mi 11 Pro
Android版本: 11
Autojs版本: 9.0.10
图片添加水印步骤
- 选择一张图片
- 使用canvas在图片上画文字
- 调整水印到自己满意为止
- 保存添加水印的图片
你将学到以下知识点
- 更换img控件的图片
- seekbar设置和获取最大值, 当前值, 以及滑动监听
- 检测颜色是否符合十六进制
- 监听输入框
- 避免图片引用冲突导致报错
- 获取文字的宽高
- 旋转画板
- 绘制文字
如果上面的你都会了, 就没必要看下去了, 划走吧
代码讲解
1. ui界面
ui.layout( <vertical> <img id="img" h="300dp" w="*"></img> <text margin="9" id="title" textSize="22sp" textColor="#fbfbfe" bg="#00afff" w="*" gravity="center"></text> <vertical margin="33"> <horizontal> <text text="行: " textSize="30sp"></text> <text id="rowValue" text="0" textSize="30sp"></text> <seekbar id="rowSeekbar" margin="9" w="*"></seekbar> </horizontal> <horizontal> <text text="列: " textSize="30sp"></text> <text id="colValue" text="3" textSize="30sp"></text> <seekbar id="colSeekbar" margin="9" w="*"></seekbar> </horizontal> <horizontal> <text text="角度: " textSize="30sp"></text> <text id="angleValue" text="0" textSize="30sp"></text> <seekbar id="angleSeekbar" margin="9" w="*"></seekbar> </horizontal> <horizontal> <text text="颜色: " textSize="30sp"></text> <input id="colorValue" text="#ff0000" textSize="30sp" w="200dp"></input> </horizontal> <button id="save" text="保存并查看"></button> </vertical> </vertical> );
2. 初始化画界面
ui.rowSeekbar.setMax(8); ui.colSeekbar.setMax(3); ui.colSeekbar.setProgress(3); ui.angleSeekbar.setMax(360); ui.title.setText("牙叔教程\n添加水印"); let imgPath = "./lynx.jpg"; imgPath = files.path(imgPath); let imgO = images.read(imgPath); let bitmapO = imgO.getBitmap(); ui.img.setImageBitmap(bitmapO);
3. 点击按钮, 保存图片
ui.save.click(function () { if (!imgWithWatermark) { toastLog("图片未添加水印"); return false; } else { images.save(imgWithWatermark, "/sdcard/1.png"); app.viewFile("/sdcard/1.png"); } });
4. 更新图片
function updateImg() { let col = parseInt(ui.colSeekbar.getProgress()); let row = parseInt(ui.rowSeekbar.getProgress()); let angle = parseInt(ui.angleSeekbar.getProgress()); let currentImgWithWatermark = addWatermark(imgO, row, col, angle); lastImgWithWatermark = imgWithWatermark; imgWithWatermark = currentImgWithWatermark; ui.img.setImageBitmap(imgWithWatermark.getBitmap()); lastImgWithWatermark && lastImgWithWatermark.recycle(); }
5. 监听seekbar
ui.rowSeekbar.setOnSeekBarChangeListener({ onProgressChanged: function (seekBar, progress, fromUser) { if (fromUser) { ui.rowValue.setText(String(progress)); updateImg(); } }, });
6. 监听输入框
ui.colorValue.addTextChangedListener( new android.text.TextWatcher({ afterTextChanged: function (content) { log(content); updateImg(); }, }) );
7. 退出脚本时, 回收资源
events.on("exit", function () { bitmapO.recycle(); imgO.recycle(); imgWithWatermark && imgWithWatermark.recycle(); });
8. 判断颜色是否符合十六进制
颜色支持6位和8位的十六进制, 也就是说可以调节颜色的透明度
function getColor() { let colorStr = ui.colorValue.text(); if (/^#([0-9a-f]{6}|[0-9a-f]{8})$/.test(colorStr)) { let colorNum = $colors.parseColor(colorStr); return colorNum; } else { log("颜色格式错误, 正确颜色格式: #aabbcc"); return $colors.parseColor("#ff0000"); } }
总结
以上就是图片添加水印的大致步骤,
如果你想有自己风格的水印, 可以在看懂代码之后, 自行修改,
比如拉伸文字, 更换字体, 添加阴影浮雕之类的效果,
本教程实现的是基础的水印, 更多的水印风格,
在你学会以后, 就可以自己给图片添加水印啦,
你的风格, 自己做主.
名人名言
思路是最重要的, 其他的百度, bing, stackoverflow, github, 安卓文档, autojs文档, 最后才是群里问问
--- 牙叔教程
声明
部分内容来自网络
本教程仅用于学习, 禁止用于其他用途
