美文网首页解密 iOS 类库iOS Developer
iOS 酷炫的一个画发散线条的小工具

iOS 酷炫的一个画发散线条的小工具

作者: 阿瑟李 | 来源:发表于2017-01-03 17:57 被阅读71次

    前几天在网上看见一个开源库, 觉得效果看起来很酷, 直接上图

    Paste_Image.png
    Paste_Image.png

    首先, 这个库是很简单的, 但是我们其实是要学习这里边的思路, 先想想,如果是你,该如何实现这种效果呢, 你会设置哪些参数呢?
    想没想好也没关系,我们先看他是怎么实现的呢?让我们来看看源码吧.
    库提供了画线和圆圈两个接口, 由于参数类似, 我们其实通过一个就可以了解了.

    func drawDistortedLine(
    with definitionPoints: Int, 
    width: CGFloat, '
    numberOfLines: Int, 
    xRandomness: CGFloat, 
    yRandomness: CGFloat, 
    xInfluenceInXAxis: CGFloat, 
    yInfluenceInXAxis: CGFloat
    ) -> UIImage 
    
    • definitionPoints 我们可以理解为这条线会发生多少次突变, 数目越大变化越明显
    • numberOfLines 这个很好理解, 就是线的条数
    • Randomness 这个值就是随机变化的浮动范围, 如果你想上下浮动各25, 那么你可以设置它为 50
    • InfluenceInXAxis 这个最后这个值代表随机浮动的影响力, 默认为1, 如果设置为 0.1, 那么最后的浮动范围 就是 = 随机值 * 0.1

    看了这几个参数, 那么我就可以把整个画图的流程给大家说一遍了

    1. 首先得到参数
    2. 根据参数得到一条线的一些随机点
      2.1. 首先根据 definitionPoints 把 先平分
      2.2. 每一个节点计算随机浮动
      2.3. 再把 浮动值*Influence
      2.4. 移动节点并保存到数组
    3. 重复步骤 2, 得到所有线的点集
    4. 计算所有点所存在的范围
    5. 根据点画出所有的线, 然后导出图片(划线的时候使用贝塞尔曲线)

    结语

    类库,很简单,但是让你去写却不一定能很轻松.
    我不知道为什么, 在看他的参数的时候莫名其妙的就想到了 autoLayout, 细想想, 的确有些地方有些神似, 其实也就是通过多维条件来控制一个数值, 在 layout 中就是距离, 在这里就是随机偏移.
    这个库算是给大家没事开开脑洞罢了. 有兴趣去看看源码~

    相关文章

      网友评论

        本文标题:iOS 酷炫的一个画发散线条的小工具

        本文链接:https://www.haomeiwen.com/subject/sadnvttx.html