让文字一笔一画的出来!

让文字一下就出来,这是最常见的也是最没技术的了,深一步来就是让文字一点点的渲染出来,就类似镂空渲染效果,一点点渲染出来,这个不懂的可以看下我上一篇文章《镂空渲染》,知识难点不多,很容易懂。。接下来,就是不好明白,却也是非常cool的,就是让文字自己通过笔画来一点一点的画出来,听上去是不是很有趣,那么让我们去实现吧。。

效果图:

首先,我们要明白,对应处理这种文字,就要用到CoreText库了,这个库就是专门用来处理图文的。我也不是太明白里面很多方法,以后遇到慢慢学。


探讨:

    通过查关于CoreText的资料,我这里简单的说下

让文字一笔一画的出来!_第1张图片

来重新绘制字体,可以

1、利用CTFrameDraw,利用本身CTFrame和传入的CGPath来绘制;

2、利用CTRun(每一个字形单元格),通过CGPath来绘制。



利用CTRun,来逐一绘制字形,得到路径path

让文字一笔一画的出来!_第2张图片
让文字一笔一画的出来!_第3张图片

接下来就是实现彩色颜色一闪一闪的效果。

原理:利用渐变图层CAGradientLayer,通过核心动画不断改变颜色值,就能达到彩色颜色一闪一闪的效果。

让文字一笔一画的出来!_第4张图片
让文字一笔一画的出来!_第5张图片

最后一步,就是将字形路径放在渐变图层上去

让文字一笔一画的出来!_第6张图片

这样就完成了....

源码地址github

总结:coretext库我对此了解也不够,还是要继续学习,其实,只要越牛逼的东西越难懂越难学,但学会了会用了何尝不是一种巨大提升,一种超越呢,加油!!!!

你可能感兴趣的:(让文字一笔一画的出来!)