欢迎光临散文网 会员登陆 & 注册

[AE表达式]使用createPath创建与控制曲线_Part.1

2020-07-14 02:46 作者:小小の我  | 我要投稿


从C4D里导出AI曲线再复制到AE里比较麻烦,而且导进去之后去匹配位置真是个令人拉稀的过程,于是我整了个更麻烦的方法

当然它主要功能也不是为了适配三维曲线,首先建个合成,建个形状图层,在加个path

建个空的path

此时这个path是什么都没有的,一般来说直接建立的path可以通过从mask或者其他形状里复制path属性来粘贴形状,这里我们要直接用表达式生成形状,所以按alt点击打开表达式窗口,然后先在官方给个默认命令里找到这个createPath

点表达式右面的小三角直接调用官方给的命令

然后就出现了一个方块,为了方便看它直接加个stroke吧

为了方便观察添加个stroke

先到官方文档里看一下这个命令中的参数都是啥

https://helpx.adobe.com/cn/after-effects/using/expression-language-reference.html


points是需要生成的点的坐标的数组,inTangents和outTangents分别是入切线和出切线的数组,并且特意提到了切线数组里的二维坐标数量必须与points里的数量相同,除非使用空数组[],isClosed是代表这条线是开发的还是闭合的。

然后来看下我们刚才在AE里点击之后表达式栏中生成的默认命令,points中有四个坐标[0,0], [100,0], [100,100], [0,100],就是这个方块的四个点坐标,后面两个切线数组都是空的,代表没有切线或者说切线长度是0(切线就是贝塞尔曲线的手柄),并且是闭合曲线,构成了一个完全是直线组成的方块。

关于切线数组如何使用我们放在Part.2再说吧,先用空物体来做一个简单的可控制曲线。建立四个空物体,分别命名成loc 1-4,摆放在不同的位置

我们想根据这四个空物体生成一条线,因为点很少,只有四个,所以我们直接手动拉四条皮筋把空物体的坐标分别赋予四个变量就好

愉快的拉皮筋

(皮筋鄙视了你)

然后把四个变量放进一个组里,给到createPath里的points(你也可以直接把四个位置直接拉皮筋拉到points数组里的,只要不嫌长),我想要开放的曲线,所以把isClosed改成false了

cvs = [pointA, pointB, pointC, pointD];

createPath(points = cvs, inTangents = [], outTangents = [], isClosed = false)

路径出来了,但是好像位置不太对

然后你会发现这个路径的位置好像不太对啊,点没跟空物体重合啊。其实是因为这个表达式的坐标是局部坐标,也就是根据当前图层的图层空间来定义坐标位置的,想一下默认生成的那个方块其实按照世界坐标应该是在左上角的

左上角才是按照世界坐标这个方块的位置

这里有两个办法,一种是把点的坐标都偏移一个当前形状图层的position,或者直接把这个形状图层的position改成[0,0],他就与世界坐标重合了,我选择后者

把坐标改成[0,0]之后曲线点和空物体能完全重合了

到这里这个表达式就能派上点用场了,比如你可以竖着移动空物体来做折线图的动画,当然不嫌麻烦用beam或者plexus也是能做的,但是我们其实是为了生成曲线,以及做一些只有形状图层才有的效果,比如虚线之类的。

在stroke里添加dashes分段属性来做些丑陋的虚线

让它变成曲线也很简单,第一种办法直接添加Round Corners,调节半径大小就能改变曲线的圆滑度

形状图层的Round Corners变形器

第二种办法选中这个path,视图里右键变成RotoBezier,它就成为了一个可以自动圆滑的贝塞尔曲线,并且不需要手柄(我竟然用了几年AE都没发现mask还有这个功能,直到不小心按出来)

整容前
整容后

第三种办法就是手动控制手柄了,之前说了这个放到Part.2里讲

先用二维的点来做点练习吧,做个小蝌蚪找妈妈吧

这就很简单了对吧,只要写个X轴位移和Y轴时间偏移表达式然后复制图层就好了

接下来我们加速吧,该试着用这个来匹配三维中的曲线了

在C4D里随便生成个东西,或者自己画一个,我就创建个花瓣了,为了说明无论曲线在哪都能在AE中可以很方便的匹配它的位置,我把它移动到了不是原点的位置,然后克隆空物体,克隆方式选择对象,物体里选择克隆到花瓣,克隆数量要根据自己曲线的复杂程度,曲线越复杂需要的定位点越多,这里建议使用step的方式克隆,这样它会忽略曲线的段数,克隆出来的物体在曲线上是等距的(中文好像叫步幅,把曲线的插值方式改成统一也是可以的)

记得给克隆添加外部合成标签,勾选子集,命名要弄好,之后要根据命名来批量生成点,渲染设置的分辨率要设置成跟你AE合成的分辨率一致,否则不能匹配坐标

分辨率一定要一致!

分辨率一定要一致!

分辨率一定要一致!

AE的原点坐标是根据合成分辨率变化的,这点很操蛋,所以我AE中是1920*1080的分辨率,在C4D的渲染设置中一定要设置成1920*1080

接下来导出AEC就好了,导入AE之后生成了所有克隆的空物体,我这里编号到40,算上0编号一共是41个空物体(其实再多几倍也行)

还有一点要注意的是由于AE的path都依附于图层,所以没有办法生成三维的path,导出到AE中的线基本也是为了在地面或者墙面这些平面上做些形状层的效果而已,所以C4D中的曲线尽量做成在一个平面的,不然在AE中生成出来的线会在一个维度被“压扁”

然后建立形状图层,记得坐标要改成[0,0],添加path,打开表达式窗口,我们需要用for循环批量把所有空物体的坐标存入数组中,这里需要会一些JS的基本语法,如果你真的一点不会...就去看一下吧,我也是边看边写的,比如下面的网址就可以学,真滴是很基础的语法就可以(我觉得想尝试用表达式做东西的人应该不会拒绝简单学习下编程语言吧)

https://www.runoob.com/js/js-loop-for.html


首先我们要把物体的Y轴坐标抛弃,把XZ坐标转化成XY坐标(如果你的曲线是XZ平面就抛弃Z轴),定义个函数,用来转化坐标

function getcvpos(ptnum)

{

    loc = "spline loc " + ptnum;

    x = thisComp.layer(loc).transform.position[0];

    y = thisComp.layer(loc).transform.position[2];

    return [x,y];

}

loc = "spline loc " + ptnum 这段是单独为自己空物体的名字设定的,由于所有空物体都是spline loc+编号的名字,ptnum就代表之后循环中的编号(其实不用按照图层名字的方式,用index也可以做)

然后定义一个空数组,在for循环中把每个点都通过上面我们写的getcvpos函数转化坐标之后放到这个数组中

pointspos = new Array();


    for (i=0; i<41; i++) {

    cv = getcvpos(i);

    pointspos.push(cv);

}

接下来只要createPath,把我们的点集合数据放到points参数里就OK,我粘贴一下完整表达式

function getcvpos(ptnum)

{

    loc = "spline loc " + ptnum;

    x = thisComp.layer(loc).transform.position[0];

    y = thisComp.layer(loc).transform.position[2];

    return [x,y];

}


pointspos = new Array();


for (i=0; i<41; i++) {

    cv = getcvpos(i);

    pointspos.push(cv);

}


createPath(points = pointspos, inTangents = [], outTangents = [], is_closed = true)

然后我们就可以看到路径已经在二维中生成了

匹配三维位置也非常简单,打开三维层,然后旋转相应的旋转轴90度,就完全匹配上三维中的路径了,如果你本身就是在XY平面的路径,可能都不需要旋转

现在它还是直的,三维里克隆的空物体越多生成的曲线越接近原始形状,接下来你需要做圆滑还是任何形状图层的变形器动画都随你了,你三维中物体有动画的话再AE里也有动画

我TM在做啥

如果想把它变成可编辑的曲线可以点击转化表达式,然后把关键帧和表达式都删了就变成正常的路径了

虽然看起来没啥用但是能用上的时候自然就用上了...

.

.

.

哦,还有个切线,有点懒得写了

要是点背儿的话就找机会更吧

[AE表达式]使用createPath创建与控制曲线_Part.1的评论 (共 条)

分享到微博请遵守国家法律