[iOS] 图像处理 - 一种高效裁剪图片圆角的算法

   <h3>场景</h3>    <p>经常看到各种高效裁剪圆角的文章，正好之前做过一点数字图像处理，就打算用空域处理的办法，写个裁剪圆角的算法，一定要尽可能的快的，不然界面容易卡顿。</p>    <p>裁圆角很简单，对于图像上的一个点(x, y)，判断其在不在圆角矩形内，在的话 alpha 是原值，不在的话 alpha 设为 0 即可。如下图</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/e8dbe1c8979b8e3260ca81da6ad09ef9.png"></p>    <p>我遍历所有像素，判断每个像素在不在4个圆的圆内就行了，4个角，每个角有一个四分之一的圆。</p>    <p>一个 <strong>优化</strong> 就是，我不需要遍历全部的像素就能裁出圆角，只需要考虑类似左下角三角形的区域就行了，左下，左上，右上，右下，一共4个三角形区域（另外3个图中没画出），for循环的时候，就循环这个4个三角形区域就行了。</p>    <p>所以对于一幅 w * h 的图像，设圆角大小为 n，n<= min(w, h) / 2，其复杂度为 O(n) = 2(n^2)，最坏的情况计算量也不会超过 wh / 2</p>    <p>对于一个像素点(x, y)，判断其在不在圆内的公式</p>    <pre>  <code class="language-objectivec">如果  (x-cx)^2 + (y-cy)^2 <= r^2  就表示点 (x, y) 在圆内，反之不在。</code></pre>    <p>理论说完了，下面看实际的测试数据。</p>    <p>测试结果与分析</p>    <p>根据上面的分析，我写了一个裁剪圆角的程序，叫为 <strong>my裁剪</strong> 。</p>    <p>还用了苹果 CoreGraphics 库的 CGContext 裁剪圆角，叫为 <strong>CGContext 裁剪</strong> 。</p>    <p>还用了 UIKit 的 UIBezierPath 裁剪圆角，叫为 <strong>贝塞尔裁剪</strong> 。</p>    <p>下面来对比三种方法，哪种最快，分别是</p>    <p>1.my裁剪</p>    <p>2.CGContext裁剪</p>    <p>3.贝塞尔裁剪</p>    <p>实验数据：</p>    <p>一张 png 格式 512 * 512 的 lena 女神的标准实验图像。</p>    <p>圆角大小分别取 10，50，100，250，这4个值。</p>    <p>每次实验裁剪 10000 张图片数据，获得总耗时。</p>    <p>因为图片是 512 * 512 的，最大的圆角为 512 / 2 = 256，所以超过 256 的会被强制设在 256，所以实验中用了个近似 256 的 250 做为最大的测试数据。</p>    <p>实验前关闭所有比较耗CPU的软件。实验中不操作电脑，避免影响实验结果准确性，最好真机测试，关掉后台所有APP。最后得到了以下实验数据，并绘制成表格。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/7588261fc9bae7925ad68bb4a77a7fa2.png"></p>    <p>表格.jpeg</p>    <p>根据上图可以看出 my 裁剪运行时间看起来像指数上升的，是不是会更慢？</p>    <p>答：不是的，看 x 轴的坐标间距，10 到 50 到 100，然后直接跳到 250 了，不是均等分的！要是画均等分的话，图会非常非常长。</p>    <p>如果要 x, y 轴刻度均等分的话，画出来的图大概是这样的，如下图：</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/acd66e0e6a0d1ceaff603b785a781c93.png"></p>    <p>表格2.jpeg</p>    <p>my 裁剪时间随着圆角大小线性上升，到达 256 的时候，是最大值了。</p>    <p>实验过程中的具体数据。</p>    <ul>     <li> <p>圆角为 10 的情况</p> </li>    </ul>    <p style="text-align:center"><img src="https://simg.open-open.com/show/adb66f8531a43c8726c5c3b9630e85dc.png"></p>    <ul>     <li> <p>圆角为 50 的情况</p> </li>    </ul>    <p style="text-align:center"><img src="https://simg.open-open.com/show/d2cc551662e1696022c7694092659ca2.png"></p>    <ul>     <li> <p>圆角为 100 的情况</p> </li>    </ul>    <p style="text-align:center"><img src="https://simg.open-open.com/show/0fa7f42cc32b2e75b16f81c7fa2b7ed1.png"></p>    <ul>     <li> <p>圆角为 250 的情况</p> </li>    </ul>    <p style="text-align:center"><img src="https://simg.open-open.com/show/c657fa7db48179f8dc1d6139efdd9095.png"></p>    <h3>结论与分析</h3>    <p>从上面数据可以看出：</p>    <p>时间上：不管圆角大小 n 是多少，CGContext 和 UIBezierPath，耗时都在 14.6 秒左右。而 my裁剪在圆角小的时候，性能较好，耗时在 3 秒左右，随着圆角增到250，耗时也去到了 12 秒，但最坏不会超过 w * h / 2，在 n<min(w, h) / 2 时，具有较高的性能，比CGContext, UIBezierPath要快。</p>    <p>空间上：内存使用上，没精确测量，大致看了一下，裁剪1万张 512 * 512的图片，3种算法的内存使用都在 10MB 左右，还可以接受，但 UIBezierPath 裁剪时居然会写磁盘。</p>    <p>另外，在图像编码/解码中，用了 CGDataProviderRef，CGImageRef，这两个对象，它们的速度应该是很快的了，如果自己写的话，预测可以更快。</p>    <p>使用方法都在代码的 ViewController.m 文件里，就这么一个文件，很好找，没有其他了。请在 iphone6，6 plus 的屏幕下运行。本实验重点在于3个算法，无关紧要的东西没做太多处理。</p>    <p> </p>