AlloyCrop 介绍
AlloyCrop 这个项目作为AlloyFinger 的典型案例,发布之后被BAT等其他公司广泛使用。但是发布之后,有两个问题一直没有抽出时间去解决:
裁剪图像的分辨率太小,是否可配?
pinch双指放大的时候,放大的中心不是双指中心,是否可以优化?
现在很高兴地告诉大家,AlloyCrop 已经完全搞定了上面两个问题,本文将解释新版本的变化和AlloyCrop背后的原理。
API
new AlloyCrop({
image_src: "img src",
className: 'crop-box',
circle: true,// optional parameters,the default value is false
width: 200,// crop width
height: 100,// crop height
output: 2,// output resolution --> 400*200
ok: function (base64,canvas) { },
cancel: function () { },
ok_text: "yes",the default value is ok
cancel_text: "no" // optional parameters,the default value is cancel
});
参数
是否必填
意义
image_src
必须
需要裁剪图片的src地址
className
不必须
裁剪 DOM 容器的 class
circle
不必须,默认是false
代表选取的是否是圆形还是矩形,默认是矩形,注意:圆形选取裁剪出来的也是正方形图片
width
必须
选区的宽
height
必须
选区的高
output
必须
输出的倍率。比如如果output为2,选区的宽300,选区的高100,输出的图像的分辨率为 (2×300,2×100)
ok
必须
点击ok按钮的回调
cancel
必须
点击cancel按钮的回调
ok_text
不必须,默认是ok
ok按钮的文本
cancel_text
不必须,默认是cancel
cancel按钮的文本
与之前版本最主要的变化就是新增了 output 支持自定义倍率分辨率的图像输出。
网站地址:https://alloyteam.github.io/AlloyCrop/
GitHub:https://github.com/AlloyTeam/AlloyCrop
网站描述:做最好且最小的移动裁剪组件
AlloyCrop
官方网站:https://alloyteam.github.io/AlloyCrop/
小编说
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。