AEJoy —— 表达式之碰撞检测(一)【JS】

390 阅读2分钟

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。

效果图

碰撞检测表达式允许每一层检测它的可见区域是否与任何其他层的可见区域相接触

098.gif

想法

这应该很有趣。AE CS3 包含了一个新的 sampleImage() 函数,它不仅允许你采样一个图层的像素颜色数据,而且还允许你采样一个像素的 alpha 值。这为创建一种表达式提供了一个(以前不可能)的机会,该表达式可以检测一个图层的可见区域何时与另一个图层的可见区域相接触。这正是我们设计碰撞检测表达式所需要的能力。同时还希望它即使图层被缩放、旋转和/或设置父级也能正常工作。

设计

基本的想法是,我们将使用 sampleImage() 来寻找一个像素,其有一个非零的 alpha 值(对于带有该表达式的图层和合成中的任何其他层来说)。我们只需要找到一个这样的像素,以确定发生了碰撞。 最明显(暴力)的方法是使用 sampleImage() 来获取图层中每个像素的 alpha 值,并将其与其他(每个)图层中相同的世界空间位置进行比较。这种方法会非常缓慢,所以我们必须更聪明一些。

我们所需要做的就是将搜索限制在我们的图层与其他图层重叠的区域。如果我们不需要考虑一个层是否被旋转的话,我们可以只使用每个层的左上角和右下角来确定它们是否/在哪里重叠。但是因为我们希望能够容纳旋转的图层,我们需要添加一个额外的步骤,并计算每个图层的包围框(Bounding Box)。下图说明了我们所说的 “包围框” 的含义。

image.png

现在让我们看看两层相交时会发生什么。我们可以将搜索限制在下图中用黄色标出的相对较小的矩形区域内。

微信截图_20210929045020.png

(未完)