AlloyCrop

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/