Clipic.js插件可以为移动端 (仅支持移动端) 提供头像上传并裁剪成指定尺寸，用原生js开发的，轻量级，包含html跟css，不到8kb。点此链接体验： https://teojs.github.io/clipic/
https://github.com/teojs/clipic
参数说明
width:Number (默认：500) – 裁剪宽度
height:Number (默认：500) – 裁剪高度
ratio:Number (可选) – 裁剪的比例，当传入ratio时width/height将无效
src:String (必传) – 需要裁剪的图片，可以是图片链接，或者 base64
type:String (默认：jpeg) – 裁剪后图片的类型，仅支持 jpeg/png 两种
quality:Number (默认：0.9) – 压缩质量
buttonText:Array (默认：[‘取消’, ‘重置’, ‘完成’]) – 底部三个按钮文本
http://bbs.itying.com/topic/5cb17892c6a71b10bcef96b0
在之前的笔记中，讲了如何实现圆形头像，这里接着上一次的笔记，讲一下怎么修改头像（通过图库和拍照方式）。重点：
流程： 一般在APP中，修改头像是最基本的功能之一了。一般是两种方式的修改：从相册选择图片或者拍照。那么这里就来讲一下如何具体实现这个功能。
Step1：点击头像 ->手势（UITapGestureRecognizer）
首先，点击头像。因为头像是直接放在ImageView中的，默认情况下当我们点击头像的时候，头像是不会有任何反应的。因此，我们需要给头像的ImageView添加一个点击事件，方法如下：
Step2：弹出选择提示->提示框（UIAlertController）
通过添加UITapGestureRecognizer（手势），系统就知道了我点击了头像，接着，就可以添加具体的方法来进行操作了。在上一步，我为这个手势的action，selector（选择）了一个方法来执行，即alterHeadPortrait：（注意有冒号的），也就是当我们点击了头像之后，会执行alterHeadPortrait：这个方法：
通过UIAlertController（提示框）这个类，我们创建好了一个提示框，如下：
现在，当我们点击取消（或者点击按钮以外的区域）提示框就会被自动取消掉，并将提示框收起来。
Step3：从相册选择或者拍照选择头像->UIImagePickerController
好了，绕了这么久，终于开始进入主题了，即选择图片或者拍照了。那么现在该肿么办呢？好像毫无头绪的样子。。。
这里就需要通过UIImagePickerController，通过它，我们就可以让我们的APP轻松的实现访问相册或者拍照：
操作UIImagePickerController，需要实现两个协议：
进行相册图片选择或者相机拍照的实现代码如下：
运行效果如图：
Step4：替换头像->大功告成！
现在，我们已经能够打开相册，或者拍照（拍照功能模拟机无法拍照，会报错，只有用真机测试）。
可是问题来了，现在选择了新图片，确定之后，头像还是原来的头像，并没有更新。这是因为我们这里还没有对图片选择完全之后的代理方法进行实现：
大功告成：
lui的ouf头像我详细解释一下，这个插件的layout（布局）是由loui, Siku这个人编写的
他们制作出的插件包名字就叫LUI
插件里面使用的头像插件就是这个oUF_Lui
而这个头像插件是loui, Siku基于ouf这个开放代码的头像框架写出来的，因为是给lui使用的，所以起名叫ouf_lui
ouf是由haste这个家伙写的
