先上一张效果图



android文字翻转动画 文字旋转动画_文字旋转


gif图不动..

插一个动图链接

https://s1.ax1x.com/2020/03/25/8OONWj.gif

实现思路:

  1. 使用photoshop做出多张外围 文字位于不同位置的图片,合成gif图。
  2. 使用photoshop做好背景,中心文字,这个比较简单
  3. 重要的是制作外围环绕效果,利用椭圆工具,文字工具制作外围文字
  4. 多次旋转外围文字并保存为新的图层,最终输出多张图片。

具体操作步骤:

1.打开photoshop,打开背景图片,我用的是下图


android文字翻转动画 文字旋转动画_android文字翻转动画_02


2.Ctrl+j复制一层


android文字翻转动画 文字旋转动画_背景图片_03


3.选中图层1,选择文字工具,在画布中间写上中间文字。


android文字翻转动画 文字旋转动画_背景图片_04


如下图:


android文字翻转动画 文字旋转动画_文字旋转_05


4. 画圆形,选择椭圆工具,先在开心两个字的中心处鼠标点击拖拽(先不要放),再按住shift,然后再按住alt(注意shift和alt有先后顺序)画⚪。


android文字翻转动画 文字旋转动画_文字旋转_06


5.选择横排文本工具,在⚪最上面点击输入文本


android文字翻转动画 文字旋转动画_背景图片_07


6.选中happy everyday 图层,(ctrl+j)复制,复制三次。


android文字翻转动画 文字旋转动画_android文字翻转动画_08


7.旋转副本,使每四分之一⚪有一个happy everyday。


android文字翻转动画 文字旋转动画_背景图片_09


双击确认后应该是这样。


android文字翻转动画 文字旋转动画_文字旋转_10


然后选中副本2对它进行旋转操作,接着对副本3进行旋转操作。

最终结果:


android文字翻转动画 文字旋转动画_背景图片_11


8.将外层的文字ctrl+alt+shift+e盖印成一个图层,然后复制9份(选中盖印好的图层用ctrl+j)


android文字翻转动画 文字旋转动画_android文字翻转动画_12


盖印完成后的结果


android文字翻转动画 文字旋转动画_源文件_13


接下来,选中这个新形成的图层,按八次ctrl+j,复制八份,这样就有9份相同的图层了。


android文字翻转动画 文字旋转动画_文字旋转_14


9.打开背景和”开心”文字图层


android文字翻转动画 文字旋转动画_源文件_15


10.将图层2和其余8个图层2的副本分别旋转0, 10,20,30……80°,

旋转操作,先选中某一个图层,按ctrl+t,然后在上方出现旋转角度的选项,输入角度就ok,下面以图层2的副本为例,它要旋转10°。


android文字翻转动画 文字旋转动画_文字旋转_16


旋转后


android文字翻转动画 文字旋转动画_文字旋转_17


同理,接下来分别对副本2,3,4,5等图层旋转20,30,40°等相应的度数。

最终结果:


android文字翻转动画 文字旋转动画_源文件_18


哈哈哈,有点乱。

11. 接下来我们导出图片

先整理一下图层,

关闭所有图层,打开下图中的两个。


android文字翻转动画 文字旋转动画_背景图片_19


然后对图层2以及它的8个副本重命名,分别改称1,2,3,4,5,6,7,8,9.


android文字翻转动画 文字旋转动画_图层_20


,接着,就是有规律的操作了,

打开图层1,保存图片,命名为1;

关闭图层1,打开图层2,命名为2;

关闭图层2,打开图层3,命名为3;

以此类推,最后得到9张图片。