Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

Floating expression series

Simple floating layer

This is ideal if you want a bobbing layer that simulates an object bobbing up and down in space or water. It basically shows the weightlessness of an object. You can use this code for layer position and size.

rendering

expression

amp = 250;
freq = 1;
y = amp*Math.sin(time*freq*Math.PI*2);
value + [0,y,0]
Copy the code

Floating jumping layer

Similar to the expression above, where you can control the movement and frequency of your layers.

rendering

expression

ampY = 60;
ampZ = 150;
freqY = 0.5;
freqZ = 2;
y = ampY*Math.sin(time*freqY*Math.PI*2);
z = ampZ*Math.cos(time*freqZ*Math.PI*2);

value + [0,y,z]
Copy the code

Delay keyframe expression

This expression allows you to delay your keyframe animation by specifying at which frame the animation should start. It’s basically a pause before the animation starts.

rendering

expression

delayFrames = 40;
delay = framesToTime(delayFrames);
thisComp.layer("logo").transform.position.valueAtTime(time-delay)
Copy the code

Delay and Index expressions

Delay and index expressions allow you to have other sub-layers follow the main layer at different times.

rendering

expression

// Sets a delay amount in frames
var delay = 5;
 
// Multiplies delay based on this layer's index relative to it's parent
var multiplyDelay = delay * ( index - parent.index )
 
// Offsets layer's Position in time based on delay
parent.fromComp( toComp( anchorPoint, time - framesToTime( multiplyDelay ) ) );
Copy the code