今天小菜给大家分享下实现残影、拖尾效果的几种实现思路，或者叫固定套路，保准大家认真看完后，以后再也不怕实现残影、拖尾效果了。

本文字数比较多，且部分内容需要阅读代码加以思考，预计阅读10-15分钟。（画外音：小菜好不容易总结的，客官读完有收获再走呀，😂）

啥是残影？小菜直接上图说明。 封面图 游戏人物挥剑动作

游戏人物冲刺动作 李小龙经典镜头

我们经常在影视剧、游戏中，看到残影的镜头。有武器特效方面的，也有人物动作方面的。看到这里想必大家应该了解到了什么是残影了吧。

小菜用白话描述下：

有一个运动的物体，在一段时间内，从这个位置运动到了那个位置，在我们看到的某个画面时间点上，却展示了物体在前一小段时间内的物体运动位置轨迹，这些轨迹往往以半透明的方式展现出来（还有其他表现形势，如上面的游戏中人物冲刺动作的残影），营造出视觉残留效果，起到不错的观赏效果。

拖尾又是啥？顾名思义，拖动尾巴，尾巴跟随的效果，拖尾常常可以和残影一起说，因为残影效果往往伴随着拖尾，就是物体运动着，在之前历史时间点的位置轨迹也会展现出来，不断的消失，不断的跟随。

但拖尾也可以单独拎出来说，不说残影效果，只说尾巴的跟随效果。我们今天的例子也会讲到。

拖尾效果1

https://www.bilibili.com/video/BV1gB4y1u7th/

拖尾效果2

https://www.bilibili.com/video/BV1oh411Y75a/

下面我们用 Processing 来实现残影、拖尾效果，分析下如何实现。小菜将套路总结成三个：

1）半透明叠加法

2）生命流逝法

3）中学生班级晨跑法

我们运行下看下效果

代码简单的不能再简单了，但却能实现了一种残影拖尾效果。是不是很神奇？

我们来分析下这个残影的实现原理：

1）黑色的画布背景

2）一个跟随鼠标运动的圆，填充色RGB为30,255,255

3）每一次 draw 绘制时，都会在画布上画一层和画布背景颜色的一样，但具有一定透明度的长方形（一般和画布大小一致）

如果去掉了第三步，效果是什么样？