iOS 搭建“美图(贴纸，涂鸦，文字，滤镜)”系列

开门见山，先看效果图：

StoryMaker.gif

小姐姐有没有很好看！是不是该点一波赞！（无耻，滚粗。。）
可能你已经认出来了，低调低调。。回归正题，咳咳。。
(￣ε(#￣)╰╮o(￣皿￣///)

主界面UI构成：

主界面.png

• 主体 ImageView ，初始化的时候加载初始图
• ToolsView，上方"Close"和"Next"按钮，下方四个功能按钮，从左到右分别是"贴纸 | 涂鸦 | 文字 | 滤镜"

贴纸 | 涂鸦 | 文字 | 滤镜.png

大致的流程，一开始，四个功能 View 初始化完毕，隐藏在屏幕的下发，hidden = YES，点击按钮，隐藏NO，做一个 UIView 的平移动画到屏幕正中心，结束编辑再次平移下去，隐藏YES。

1. 每次选中贴纸，会在主界面生成一个支持多种手势的ImageView（不然咋旋转放大），然后 addSubview 到主体
   ImageView
2. 涂鸦结束，渲染一张 ImageView ，然后 addSubview 到主体
   ImageView
3. 添加文字（图中是一只颜文字拼出来的狗狗）后，同样会在主界面生成一个支持多种手势的 Label，然后 addSubview 到主体
   ImageView
4. 滤镜，最开始是通过CPU来实现的，转换成像素然后滤镜计算得到。意味着有多少种滤镜要生成多少新图片，太耗内存，不推荐用，后续改良。

点击"Next"按钮用 ImageView 的 Layer 渲染出编辑后的新
Image，传递到后续，Demo中是保存到相册。

实现思路：

在这先说一下大致的实现思路，后续系列将详细介绍。

1. 贴纸的模糊是 UIVisualEffectView 的毛玻璃效果。
2. 贴纸和文字的放缩、选择、移动手势分别是
   UIPinchGestureRecognizer、UIRotationGestureRecognizer、UIPanGestureRecognizer，且通过delegate回调放缩和选择可以同时识别。
3. 涂鸦是通过下面三个方法，获取到手指位置，并实时通过UIBezierPath画出来的，而且偷偷地告诉你，美图秀秀的涂鸦实现也是类似的。当你打开涂鸦界面，先将你右姑娘的食指按下去，别动，然后放下你左姑娘的食指，你会发现，一条直线，缘，妙不可言。(￣︶￣)> <(￣︶￣)

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
- (void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
- (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event

论如何在涂鸦中划出直线.png

4. 虽然贴纸和文字都是 addSubview 到 ImageView 上，属于平级，但，你点击会优先选中后者加上去的。因为所有的贴纸View都保存在
   @property (nonatomic, strong) NSMutableArray <UIView *> *stickerViewArray;
   里，而且是逆序添加进去，所以当点击产生，顺序遍历
   stickerViewArray，假如点击在 View 中，则停止遍历。

不足点：

1. 贴纸和文字放大后，border 和删除都一同放大，其丑无比，若有童鞋知道解决方法，欢迎告知~
   一起放大的border.和删除png
2. 滤镜通过CPU来针对像素点处理，内存消耗太多，后续换其他方式。
3. 目前没有撤销操作，确实有点尴尬。正在构思中。。（～￣￣～）

WHStoryMaker接入说明：

1. 在你需要用到 WHStoryMaker 的时候引用 WHStoryMakerHeader.h 头文件，StoryMakeImageEditorViewController 就是你需要的VC。
2. StoryMakeImageEditorViewController 只提供一种初始化方法
   - (instancetype)initWithImage:(UIImage *)image;
   在初始化的时候传入 Image。
3. WHStoryMaker 依赖了 Masonry，写的时候习惯性就用了，受“毒害”太深，哈哈。。￣￣

Github链接:

https://github.com/Balzac646729740/WHStoryMaker.git

觉得不错就点个赞呗，不要吝惜它，点！(￣ε￣)