Морфинг Path с помощью слайдера

Синтаксис

TAB		разбить длинную строчку кода на несколько для удобного ее прочтения («;» только в конце последней такой строчки):   s = effect("Angle Control")("Angle").value;        s + "\n" + "round: " +        Math.round(s) + "\n" +        "ceil: " + Math.ceil(s) +        "\n" + "floor: " + Math.floor(s);
== или ===		равенство
a >= b a <= b		в конструкции if/else: является ли a больше или равно является ли a меньше или равно b знак = ПОСЛЕ знаков  <и >
=		присвоение
+=		добавляем левому операнду значения правого C += A, эквивалентно C = C + A
*=		левый операнд умножаем на правый
-+		вычитаем из правого операнда левый операнд C -= A, эквивалентно C = C - A
!		не например, «не равно» пишем как «!=»
i++	++i	+1 (инкремент)
i--	--i	-1 (декремент)
&&		and например, в конструкции if/else возвращает true только если оба значения true
| |		возвращает true, если хотя бы одно значение true
$		$ means eval file to download external JS files from disk and return the result the evaluated code

 

 

Массивы, операции

К массиву можно прибавлять другой массив или значение-параметр (также вычитать, умножать, делить):

[a, b] + [e, d]; // == [a+e, b+d]

[a, b, c] + [e, d, f]; // == [a+e, b+d, c+f]

[value[0], value[1]] + [time, time]; // == [value[0]+time, value[1]+time];

Распределительное свойство умножения работает:

[time, time]; == [1,1]*time

 

▪ Круговой массив

При движении объекта по кругу с радиусом r, его координаты X и Y вычислим так:   X = r * Math.cos(alpha) Y = r * Math.sin(alpha)

 

 

▪ %

В Ае % - это операция остатка от деления

3%2 = 1 (3 = 2+1) 4%2 = 0 (4=2*2, делится без остатка) 5%2 = 1 (5=2*2+1) 6%2 = 0 (6=2*3)
Генерить значения ~под счетчик   Math.round(index - 1)%2; // получать 0 и 1 при дублировании слоев (index-1)%2+1; // получать 1 и 2 при дублировании слоев   Math.floor(time%2)+1; // получать 1 и 2 каждую секунду Math.round(time%2)+1; //получать 1, 2 и 3 в течение каждых 2 секунд
* index-1; // 0,1,2,3,4,5,etc.	* i=Math.ceil((index-1)/2); // 0,1,1,2,2,3,3,4,4,5,5,etc
Генерить: 0,1,-1,2,-2,3,-3,4,-4,5,-5,etc. Варианты решений:  * if (index%2 ==0) { index/2 } if (index%2 ==1) { Math.floor(index/2)*-1}   * if ((index-1)%2 ==1) { inv=1 } else inv=-1 i=Math.ceil((index-1)/2*inv);   * Вариант записи с оператором «?»: (index-1)%2==1? inv=1: inv=-1 i=Math.ceil((index-1)/2*inv);   * Чуть подробнее запись: i=index-1; i2=Math.ceil(i/2); (i%2==1)? inv=1: inv=-1; i2*inv;	Варианта решения для групп Shape Layer:
* Получать 0 и 1 в течение заданного отрезка времени loop: loop=effect("Loop Time")("Slider"); t=(time%loop)/loop; Math.round(t); В частности: Math.round(time%2/2); // получать 0 и 1 каждую секунду
* Определить четность / нечетность  Пример. Дубли слоя (солдат) располагать в 2 ряда и перекрашивать J if (index%2 ==1){ // слой нечетный … } else { … } // слой четный Делим на 2 – смотрим на остаток, и, т.о., мы знаем, какое число четное, какое нечетное…
* Зациклить анимацию Пример. Дым из трубы при движении транспорта: - Path, Stroke, Dashes с экспрешеном на Offset: (-time% 4)*200; // каждые 4 сек. параметр меняется от 0 до -800 ~пингпонг (т.е. аналог loopOut();, но без ключей и удобно рассчитать цикл, исходя из длины композиции)
Псевдо (2d) вращение звезды - на Scale (изначально х=100): value - time% 1 *200; // каждую 1 сек. Scale по Х меняется от 0 до 100 ~пингпонг   Вариант в 2 раза медленнее (цикл = 2 сек.): value - time% 2 *100;

 

Обращения к параметрам:

Скриптов в «rd: scripts» много! rd_GimmePropPath – полезный скрипт для написания кода - генерит путь-обращение к выбранному параметру rd_CompSetter – менять настройки композиций и пре-композов  оптом (fps, sec, etc.)

 

Стремимся с универсальности применения экспрешенов – меньше конкретных имен!

▪ Чтобы УДОБНО-ГИБКО обращаться к слою, который будем заменять один на другой и с разными их названиями, но знаем, что в иерархии он будет на два слоя ниже текущего, назовем слой переменной sc (от «scene»):

▪ sc = thisComp.layer (thisLayer, -2); // -2 выше, +2 ниже текущего слоя

▪ thisComp.layer(index-1)… - обращение к вышестоящему слою

▪ rot = thisComp.layer(1).transform.rotation; // в скобках не название слоя типа ("Shape Layer 1"), а просто цифру, например, (1) – т.е. слой самый первый в иерархии

 

▪ target = effect (1)(1). transform.position; //привязка к положению (подумать как сделать для других параметров автоматически)

on-off = effect (2)(1); // эффект второй сверху в «иерархии» накинутых эффектов; а (1) означает номер параметра

thisComp.layer("Color Controller").effect(1)(5); // если fx Toner, то (5) означает Darktones:

 

▪ p = thisComp.layer(1).transform. xPosition; // при Separate Dimensions пишем xPosition

 

▪ this…

• thisComp – заготовка для обращения к текущей композиции

thisComp.width

thisComp.height

 

• this Layer

• thisComp.thisLayer. index; // index

• thisComp. name – имя композиции

• thisLayer. name – имя композиции

• thisComp. name. length – длина

• thisComp .frameDuration – длительность одного кадра, применительно именно к данной композиции

• thisLayer. source. duration – функция source обращается к источнику (у всех импортированных файлов есть источники, которые хранятся в окне Project)

 

▪ thisComp.Layer("Shape Layer 1").parent. transform.rotation– обращение к параметру (вращению) родителя!

▪ this Property – ГИБКАЯ-обобщенная и поэтому удобная заготовка-обращение к текущему параметру, где пишем экспрешен, например, к position

thisProperty.ValueAtTime(time); == position.ValueAtTime(time);

 

Внутри одного Shape Layer

▪ propertyGroup – к любому уровню в иерархии внутри одного Shape Layer можно обратиться с помощью propertyGroup

property Index – индекс-номер свойства внутри Shape Layer; расчет индекса - изнутри наружу, пример: Size – 1; Ellipse Path 1 – 2; Ellipse 1 – 3; Contents – 4.

Переменная для дублей групп внутри Shape Layer:

i = thisProperty. propertyGroup(3). propertyIndex;

numProperties – узнать количество свойств

k1=thisProperty.propertyGroup(1).propertyGroup(2).propertyIndex;

k2=content.numProperties;

 

numLayers – количество слоев (например, переменная L = thisComp.numLayers;)

 

textIndex – взять количество символов в тексте (в текущем текстовом слое)

numKeys – количество ключей

marker. numKeys – количество маркеров

 

▪ index

index – номер слоя - на Rotation для дублей: (index-1)*30; - для создания сеток (как Repeater) - на Opacity (как Blend в Ai) - на количество сторон для шейпов-многоугольников при дублировании слоев

thisIndex = index - 1; // корректируем индекс, если он нужен, начинающийся с 1, а первым верхним слоем является, например, AdjL

Относительный индекс - позволяет не быть привязанными к абсолютному индексу, а начинать отсчет от индекса слоя, «принятого за основной». * Чтобы скорректировать индекс данного слоя, накинем fx Slider Control, назовем его «Current Index», и экспрешен на слайдер: mainInd = thisComp.layer("controller").index; // взять индекс любого слоя – дописать.index offset = thisComp.layer("controller").effect("offset")("Slider"); // сместить фокус с одного слоя на другой mainInd - index + offset + value;

 

▪ обращения к ключам

** нумерация ключей и маркеров начинается с единицы (не с нуля)

Как получить значение ключа value [0], [1], [2]? - взять, например, общее обращение к параметру Position: thisComp.layer("Shape Layer 1").transform.position; … и дописать обращение… к первому ключу, его значению по X, например. thisComp.layer("Shape Layer 1").transform.position.key(1). value [0];

Обращение ко времени первого ключа: thisComp.layer("Shape Layer 1").transform.position.key(1). time; // в секундах   и чтобы в кадрах, дописываем строчку «перевода времени в кадры»: a = thisComp.layer("Shape Layer 1").transform.position.key(2). time; timeToFrames (a);

Получить количество ключей (цифру) на каком-то параметре, например - на Position СКОЛЬКО ключей? thisComp.layer("Shape Layer 1").transform.position.numKeys;

 

▪ обращения к маркерам

 

Как взять ВРЕМЯ у маркеров… у маркеров на линейке в какой-то композиции? thisComp.marker.key(1).time; // если хотим время первого маркера

comp("Comp 1").marker.key(2).time; // абсолютное обращение, «по-умному»

1, 2, т.д. – это порядковые номера маркеров (лейблы на маркерах не имеют значения)

у маркеров на баре слоя:

marker.key(1).time; // просто marker, если нужен маркер на данном слое

thisComp.layer("Shape Layer 1").marker.key(7).time; // в текущей thisComp

comp("Comp 1").layer("Shape Layer 1").marker.key(3).time; // в какой-то другой композиции - абсолютное обращение, «по-умному»

Получить количество маркеров на каком-то слое: Запишем этот экспрешен в Source Text – увидим цифру J thisComp.layer("Shape Layer 1"). marker.numKeys;   Получить количество маркеровна линейке в данной композиции: thisComp.marker.numkeys;

Получить порядковый номер маркера (цифру - index), ближайшего к текущему времени: thisComp.layer("Shape Layer 1").marker.nearestKey(time). index   ! Ровно посередине будем получать уже индекс второго маркера (Ае выдает номер по типу округления в большую сторону). ! Но если нужен номер-индекс по типу округления в меньшую сторону, то дописываем код… см. в практике.

tNew = time - marker.key(1).time); // сброс-коррекция времени, т.е. с того места, где находится маркер, ноль сек и начинается отсчет времени

Экспрешены на Source Text (показывать номер, время, комменты): thisComp.layer("Shape Layer 1").marker.nearestKey(time).index thisComp.layer("Shape Layer 1").marker.nearestKey(time).time thisComp.layer("Shape Layer 1").marker.key(1).time thisComp.layer("Shape Layer 1").marker.nearestKey(time).comment thisComp.layer("Shape Layer 1").marker.key(1).comment thisComp.marker.key(1).comment

 

▪ points() у Path

points() - функция получения доступа к массиву точек, указанного Path. * после points в квадратных скобках - обращение к конкретной точке - нумерация в массивах начинается с 0

pathPoints = thisProperty.points(); // переменная-обращение к массиву точек

thisProperty.propertyGroup(4).content("Shape 1").content("Path 1").path.points()[2]; // переменная-обращение к конкретной точке

createPath () – функция, создающая новый Path, в скобки нужно передать: * три массива: - первый – массив точек - второй – входящие направляющие третий – исходящие Если направляющие не нужные, то [] * и одно логическое значение: - true – закрытый Path - false – открытый Пример (экспрешен на Path): createPath(pathPoints, [ ], [ ], false); СМ. ТАНЕЦ КРАБА

 

 

▪ ВРЕМЯ

Time

time – экспрешен, который передает параметру время композиции в секундах Часто для бесконечной анимации Rotation (вместо loopOut("continue");),
Постепенное уменьшение по X – на Scale: [value[0] - time, value[1]]; value - [time, 0]; // более короткая запись value - time; // то же самое – будет уменьшение только по Х, т.к. time генерирует ОДНО значение J ускорить уменьшение X: value-time*100;
- экспрешен time на параметры: Random Seed, Evolution у fx типа Noise: time*num; // *num – число-коэффициент ускорения time*(-100); // например, на Rotation (против часовой стрелки)
timeToFrames(time) – эта конструкция переводит время в кадры
framesToTime(time) – кадры во время
* oneFrame = thisComp.frameDuration – длительность одного кадра, применительно именно к какой-то композиции
* Чтобы получить частоту кадров, в Ае нет такой функции, но можно экспрешеном:  1/thisComp.frameDuration
startTime, inPoint, outPoint ! вначале пишем слой и точку, пример
* если inPoint бара начинается не от startPoint композиции, то, если хотим анимацию, зависимую не от time композиции, а от времени слоя, его inPoint, то: t = time - inPoint; // корректируем время начала анимации y = Math.sin(time*2*Math.PI*F)*Amp; // как пример анимации
Значение параметра timeRemap всегда дает время текущего слоя, даже если ремапим или сдвигаем бар: . Обращение: whatsTime = thisComp.layer(thisLayer, +2).timeRemap;
Math.floor(10 - time); // обратный секундомер

PosterizeTime()

posterizeTime() – работает аналогично fx Posterize Time * задать частоту кадров для отдельного параметра posterizeTime(15); // делает анимацию с fps 15

* можно комбинироватьс другими экспрешенами, например, с wiggle, loopOut, time, т.п., ! в таких случаях сначала д.б. posterizeTime(), ниже – др. экспрешены

 

 

PROPERTY à

.valueAtTime();

parameter.ValueAtTime(time);

функция, которая берет значение любого параметра (Position/Scale/Rotation/…, не важно, анимируется он/на экспрешенах / нет) в какой-то момент/период времени (нужное НАМ время указываем в скобках), используется и работает именно применительно к какому-то параметру (пишем вначале с точкой) и со временем в круглых скобках

Wiggle LOOP

freq = 1; amp = 10; loopTime = 4; t = time % loopTime; wiggle1 = wiggle(freq, amp, 1, 0.5, t); wiggle2 = wiggle(freq, amp, 1, 0.5, t - loopTime); ease(t, 0, loopTime, wiggle1, wiggle2);

freq = 1; amp = 10; oct = 1; // 1 по умолчанию aMult = 0.5; // 0.5 по умолчанию loopTime = 3; // время зацикливания в сек = длительность композиции t = time % loopTime; // считаем остаток от деления текущего времени на время зацикливания   wiggle1 = wiggle(freq, amp, oct, aMult, t); wiggle2 = wiggle(freq, amp, oct, aMult, t - loopTime); linear(t, 0, loopTime, wiggle1, wiggle2); // ease

Wiggle Loop на Scaleс сохранением пропорций слоя - внизу дописать: a = linear(t, 0, loopTime, wiggle1, wiggle2); [a[0], a[ 0 ]];

 

LOOP of Path

Обычные экспрешены зацикливания типа loopOut(); и pingpong не работают с параметром Path (изменения-морфинг: костер в уроке MDS)

Loop для свойства Path_MDS_Expressions_lesson 8 try { pingpong = effect("Ping Pong")(1); // fx Checkbox «Ping Pong» на слое if (numKeys > 1){        k1 = key(1).time;        kn = key(numKeys).time;        dur = kn - k1;        t0 = time - k1;        t = t0%dur;        n = Math.ceil(t0/dur);        if (pingpong == true && n%2 == 0) valueAtTime(kn - t);        else valueAtTime(t + k1); } else value; }catch(err){thisProperty.valueAtTime(time)}

try { timeStart = thisProperty.key(1).time; duration = thisProperty.key(thisProperty.numKeys).time - timeStart; pingPong = true;   quant = Math.floor((time - timeStart) / duration); if (quant < 0) quant = 0   if (quant%2 == 1 && pingPong == true) { t = 2*timeStart + (quant + 1)*duration - time; } else{ t = time - quant*duration; } } catch(err){ t = time; } thisProperty.valueAtTime(t);

Зациклитить ключи на любых параметрах: !! Если понадобится внести коррективы в Path -морфинг, то временно отключить экспрешен (перечеркнутый знак «=» напротив экспрешена) http://aexpressions.ru/expressions/loop/loopout-path-ping-pong/ !! Этот экспрешен зацикливает анимацию на протяжении всего времени. Но можно в строчке duration казать нужное нам время (секунды)   timeStart = thisProperty.key(1).time; // начало - первый ключ duration = thisProperty.key(thisProperty.numKeys).time - timeStart; // длительность (время) между первым и последним ключом, которые хотим зациклить   // как зациклить ЧАСТЬ Path-морфинга: // timeStart = thisProperty.key(4).time; // например, начать цикл с 4-го ключа // duration = thisProperty.key(thisProperty.numKeys).time - timeStart; // и до последнего ключа - по умолчанию. Но можно зациклить, например, по 6 ключ (но тогда даже и имеющиеся следующие ключи, 7, 8, 9-ый, т.д. не будут иметь значение и не будут проигрываться даже в первом цикле, но 1, 2 и 3-ий ключи проиграются в самом начале): // duration = thisProperty.key(6).time - timeStart   pingPong = false; // change to true - if you want to loop ~pingpong   quant = Math.floor((time - timeStart) / duration); // считаем номер цикла if (quant < 0) quant = 0 // если эту строчку УБРАТЬ, то цикл будет проигрываться с самого начала бара даже ДО первого ключа, т.к. этот loop работает в стиле loopOut. И везде будут проигрываться только от timeStart до duration:   if (quant%2 == 1 && pingPong == true) { t = 2*timeStart + (quant + 1)*duration - time; //если цикл нечетный и пингпонг включен, … } else{ t = time - quant*duration; } } catch(err){ t = time; } thisProperty.valueAtTime(t);

 

Random functions

random – генерить случайное значение каждый кадр random() – если в скобках ничего нет, то Ae подразумевает диапазон от 0 до 1 random(A) – от 0 до A random(A, B) – диапазон от A до B == random(minPos, maxPos) random([a1,b1],[a2C,b2]) – случайный массив (первое число в диапазоне от a1 до a2, второе – от b1 до b2)

~ синусоидный контур

Рисующийся слева направо синусоидный контур можно сделать с помощью AdjL с fx Write-on. Экспрешен на Brush Position: [time*150, value[1]+Math. sin (5*time)*100];
Сделать «дорожку из рандомных точек»: AdjL, fx Write- on. На Brush Position экспрешен с функциями рандома:
[time*150, value[1] + random(-100,100)];	random() – все числа в диапазоне выводятся в одинаковой пропорции (т.е. рандомность равномерная)
[time*150, value[1]+gaussRandom(-100,100)]   (размер точек зависит от Brush Size)	gaussRandom(A, B) – более хаотичная рандомность, т.к. 90% значений будут в интервале от А до В, остальные 10% - за его пределами; но больше всего значений будут из середины диапазона
amp=80; // размах амплитуды вверх-вниз k=3; // коэффициент «шума-точек»  [time*150, value[1]+noise(k*time)*amp];	noise(timeOrvalOrArray) - возвращает значение от -1 до 1
Рыбка вверх-вниз на Position:	spd=1; amp=40;  n=noise(time*spd)*amp;  value + [0, n];

 

seedRandom(val) - управление случайными числами, но зависит от индекса – функция, задающая “зерно” для функции random и gaussRandom   seedRandom(val, false) =  seedRandom(val)  – генерит случайное каждый кадр seedRandom(val, true) – true сгенерит случайное число только вначале

a = effect("Slider Control")("Slider"); seedRandom(a); [time*150, value[1] + random(-100,100)];

 

Vector MATH

▪ add, sub, mul, div

à Vector Math à …
● sub(vec1, vec2) вычитает (sub tract) одну точку из другой, чтобы найти длину вектора – расстояние между точками (могут получаться отриц. значения)
● length(a,b) – функция, которая вычисляет длину между позициями/координатами а и b. Эта длина всегда больше нуля. Ура.

 

Равнобедренный прямоугольный треугольник

// c = thisComp.width; a = thisComp.width*Math.sqrt(2)/2;

 

▪ CLAMP и др. ограничители

Функция clamp(value, limit1, limit2)

Пример на Slider: clamp(effect("Slider Control")("Slider"), 0, 100); clamp(value, 0, 100);

Примеры на Position: clamp(transform.position, [0,0], [1080, 1080]); // за границы композиции слой не сможет быть перемещен (если композиция 1080х1080) то же самое, но с контроллером на Null 1: var max = thisComp.layer("Null 1").effect("Slider Control").("Slider"); clamp(transform.position, [0,0], [max, 1080]); то же самое, но построчно: minVal = [0, 0];   maxVal = [200, 200];  clamp(thisComp.layer("Layer 1").position, minVal, maxVal);

Варианты ограничителей: ** исключить случайную сдвижку (ограничить), например, при работе в 3D по Z – экспрешен на Position: [value[0], value[1], 0]; // Z ограничен - всегда 0

*** Ограничить значение параметра, например, диаметр эллипса – экспрешен на его Size: a = linear(value[1], 100, 200, 100, 200); // от 100 до 200 [a, a];

Можно формально-визуально ограничить слайдер у fx Slider Control: пкм – Edit Value… указать значение. Но можно все равно будет выйти за этот диапазон… поэтому:

См. также округление:

 

 

▪ normalize(vec)

делает единичный вектор – направление	см. также урок 9, 6 мин.:

 

Interpolation à

▪ linear

* пропорциональность анимации – взаимосвязь изменения параметров

▪ linear( t, tMin, tMax, value1, value2 )

▪ linear( time, tMin, tMax, value1, value2 ) // привязка ко ВРЕМЕНИ

▪ ease (t, tMin, tMax, value1, value2 )

EaseIn

EaseOut

** Анимация БЕЗ ключей - экспрешен на xPosition:

ease(time, 0, 3, 200, 800);

* на Position, Scale, др. ДВУХ-координатные параметры пишем массивы:

linear(t, 0, 200, 30, 36) * [1, 1];

или

linear(t, 0, 200, [ 36, 36 ], [ 30, 30 ]);

 

COLOR Conversion à

RGB и HLS – это аддитивные цветовые модели, т.е. цвета подмешиваются друг к другу (add – прибавляются).

Цвет по RGB - это вектор: белый	Значения цветов во viewport изменяются от 0 до 255, но в экспрешенах (и видим в окне Info) значения цветов от 0 до 1. Это удобно, т.к. т.о. не зависим от битности в проекте [r, g, b, a]; [r, g, b, value[3];
HSL H – Hue S – Saturation L - Lightness	HSL – в компьютерах и распространена в CG   [h, s, l];
rgbToHsl(thisComp.layer("…..color) hslToRgb(…color)	Если хотим менять цвет именно по HSL, то ок, меняем функцией rgbToHsl(), прибавляя некий newColor (три цифры на fx 3D Point Control / три fx Slider Controls). Но т.к. Fill в итоге для Ae должен быть в RGB, то переводим результат обратно в RGB функцией hslToRgb (): h=effect("H")("Slider"); s=effect("S")("Slider"); l=effect("L")("Slider"); hslToRgb([h, s, l, 1]);
Hexadecimal to float array converter	http://jsfiddle.net/seblavoie/mezGe/43/embedded/result/

sampleImage (position, [1,1], true, time) – попиксельный доступ к изображению, в скобках:

- положение пикселя

- [1,1] - размер области вокруг этого пикселя, для получения среднего оттенка

- true – после примененных эффектов на картинке?

- time

! sampleImage берет координаты внутри самого изображения, а не композиции

 

 

Other Math à

radiansToDegrees() – для поворота (вращаем в градусах) degreesToRadians() - для Math.sin, cos, т.д. 1 радиан = 57 градусов

 

JavaScript Math

● Math.sin()

Синус - математическая функция, которая плавно изменяет свое значение от -1 до 1. * То, что в скобках, функция интерпретирует в радианах. Обычно в скобках пишут time.   * Чтобы синус свой полный цикл: проходил за 1 секунду: Math.sin(time*2*Math. PI)*amp;	* Т.к. синус изменяет свое значение от -1 до 1, то, если мы умножим его на любое число amp, такой экспрешен даст нам плавное изменение от -amp до amp за 2 секунды: Math.sin(time*Math.PI)*amp;
Примеры на Rotation: * замена wiggle - хаотичных колебания без ключей: Math.sin(time); // (time)==(time*1) – 1 раз в секунду, (time*3) – 3 раза в секунду..: «… в секунду» - это период, его можно изменять доп. умножая на 1/…: (time*3*1/5) – три раза в пять секунд   * Пример плавного изменения Rotation. Со знаком умножить * ЗА скобками можно добавить амплитуду вращения: r = Math.sin((time+0.5)*Math.PI)* 2; // циклы от -2 до 2 градусов Вариация: вначале от 0 до 15 и затем циклы от 15 до до -15 градусов r = Math.sin((time - inPoint)*3*Math.PI)* 15;
Пример на Position: * Separate Dimensions и экспрешен на ось Y: Math.sin(time*5)*50; // колебания вверх-вниз, но… в верхней части композиции, т.к. по умолчанию отсчет координат от верхнего угла, поэтому прибавляем смещение вниз: Math.sin(time*5)*50 + 540; // это в центре при высоте композиции 1080 px Math.sin(time*5)*50 + value[1]; Добавляем анимацию на Position по X (например, два ключа и pingpong).
Пример на PositionВИБРАЦИЯ вверх-вниз (без Separate Dimensions): x = value[0]; // т.к. колебания вверх-вниз. Для горизонтальных движений – например, x = time*100; Amp = 200; // любое значение по месту Freq = 5; // частота дребезжаний delta = Math.sin(time*2*Math.PI*Freq)*Amp; // дописываем смещение по месту: +thisComp.width/2 [x, delta];     Сокращенно: value + [0, Math.sin(time*5)*50]; // колебания вверх-вниз value + [Math.sin(time%2*Math.PI)*20, 0]; // колебания вправо-влево   Дребезжание по диагонали: delta = Math.sin(time*2*Math.PI*Freq)*Amp; [delta, delta];
Пример на Scale: s = Math.sin(time*Math.PI*2)*200; [s,s];   Шейп зеркалится вправо-влево относительно своей Anchor Point – ЭФФЕКТ ВРАЩЕНИЯ в 2D анимации	«Подзорная труба и пропеллер»:  : x=Math.sin(time*Math.PI*2)*100; [x,value[1]]; : x=Math.sin(time*Math.PI*4)*100; [value[0],x];
на Opacity – мигания   т.к. Opacity меняется от 0 до 100, то: - если функция будет отрицательной (при большой амплитуде, то слой будет вообще исчезать)	* чтобы не было исчезаний (т.е. 0% прозрачности), результат д.б. >0:   amp = 50; // f = 5; // Frequency k = Math.sin(time*Math.PI*f)*amp + 50; // итого не будет отриц. значений переменной – будет диапазон от 0 до 100

 

● Math.cos()

Как и синус, изменяется от -1 до 1. Но если синус при 0 сам равен 0, то косинус равен 1 – смещен по фазе на PI/2.
Math.cos(time*Math.PI)*amp;
* Сочетание sin и cos – это движение по кругу (также танец краба) – на Position: // amp, freq,spd - на слайдеры t = time%2; // при необходимости зациклить на 2 сек. x = Math. sin (time*freq*Math.PI)*amp; y = Math. cos (time*freq*Math.PI)*amp; value + [x, y];
** По спирали – на Position: // amp, freq,spd - на слайдеры t = time%3; // при необходимости зациклить на 3 сек. x = Math.sin(t*freq*Math.PI)*amp/Math.exp(t); y = (t*-spd +Math. cos (t*freq*Math.PI)*amp)/Math.exp(t); value + [x, y];
Вращение пропеллера вертолета * Просто линия Path: - экспрешен на Scale ее группы: [Math. cos (time*Math.PI*freq)*100,100]; // freq=6 - экспрешен на Rotation ее группы: Math. cos (time*Math.PI*freq)*amp; // amp=5 градусов

 

● ограничить sin / cos

* Math.min(num1, num2) – возвращает меньшее из двух num * Math.max(num1, num2) – возвращает большее из двух num	* весь цикл синуса:
* Убрать изменение в одной из половин цикла синуса: Math. min (Math.sin(time*2*Math.PI*freq), 0); // вернет все, что меньше 0 Math. max (Math.sin(time*2*Math.PI*freq), 0); // вернет все, что больше 0 * аналогично для косинуса

 

 

● Math.exp(num)

Экспонента - функция, которая при линейном изменении аргумента ускоряется все больше и больше. Применение: - для постепенно ускоряющегося роста – на экспоненту нужно умножать - для постепенного затухания (уменьшение-затухание wiggle, Math.sin, т.п.) – наоборот, делить. Например, уменьшение колебания пузырька из стороны в сторону: //freq, amp, spd - на слайдеры x = Math.sin((time - startTime)*Math.PI*freq)*amp/Math.exp(time); y = (time - startTime)%2*-spd; // 2 - т.к. длина композиции 2 сек.; -перед spd, чтобы движение было вверх value+[x, y];

 

● JS math

* Math.sqrt(value) – извлечение квадратно корня

* Math.pow(value, exponent) – возведение в степень

Через Text Layer

Задача. При дублировании слоя/шейпа, менять постепенно Color у дублей.   * На параметр Color пишем экспрешен, связывающий цвет с индексом слоя: [index*0.2, index*0.7, index*0.4, 1] // цифры меняют RGB и Alpha …но именно этот экспрешен меняет оттенки не плавно, а скачком: И, допустим, хотим переписать экспрешен на «более плавный», вот такой: [index*0.05, index*0.1, index*0.01, 1] // ! Если экспрешен записан на Color у fx Fill, то ок – его получится скопипастить на дубли через пкм - Copy Expression Only, Ctrl+V. !НО: Если экспрешен записан на Color у шейпа внутри свитка Contents – (возможно, в Group 1) – Ellipse – Fill – Color, то так скопипастить НЕ получится. И цифр здесь много - неудобно развешивать их на Slider Controls… (хотя… может, можно на 3D Point Control??) Итак, управляем экспрешеном ● с помощью/через Text Layer: - создаем Text Layer, называем «exprLayer» (expr – от expressions J) - в окне просмотра пишем экспрешен по колорированию как просто Text Layer; - экспрешен на параметр Color (ссылаемся на содержимое в Text Layer): try{ expr = String(thisComp.layer("exprLayer").text.sourceText); eval(expr); } catch(err){value} - теперь дубли будут зависеть от цифр, которые меняем (в окне просмотраJ)

try { eval(thisComp.layer("exprLayer").text.sourceText.value); } catch(err){value}

Апгрейд управления экспрешенами через Text Layer: - можно сделать ключи на Source Text, только они типа Hold:  - скачки: - можно на Text Layer накинуть fx Slider Controls, назвать «Paint». Экспрешен дополняем отсылкой на слайдер и делением: a = thisComp.layer("exprLayer").effect("Paint")("Slider"); [index*a/100, index*a/80, index*a/50, 1] Крутим слайдер J

 

Через.txt files / sublime

* написать экспрешен в Sublime, например: linear(time, 0, 4, 0, 400); - сохранить в формате: exprName. txt (linearSimple.txt) сохранить * экспрешен, например, на Position: myPath = "/D/faster/ref_expressions/linearSimple.txt"; val = $.evalFile(myPath); [val, val];

 

Через градиент

* 3 Solid Layers: черный (нижний), белый, серый (верхний) Цель – создать анимацию переходов хроматических цветов: - на белый накинуть fx Linear Wipe: 270 градусов, Feather 500; анимируем Transition Completion от 100 до 0% за 1 сек - fx linear Wipe копируем на серый Solid и немного сдвигаем его бар: * Прекомпозим три Solid, назовем «Control Layer». Видимость пре-композа не нужна.

Например, на Scale какого-то слоя пишем экспрешен: sourceLayer = thisComp.layer("Control Layer "); sampleSize = [1,1]; samplePoint = transform.position; colour= sourceLayer.sampleImage(samplePoint, sampleSize); x=colour[0]*100; [x,x]

 

 

Fx Checkbox Control

fx Checkbox Control - галочка вкл./выкл. (хранит «1 или 0») - Создаем AdjL, называем Controller - накидываем fx Checkbox Control, называем «On-Off» (или накидываем прямо на сам Shape Layer) Задача. Если галочка стоит, то д.б. дребезжание wiggle. - экспрешен на Position типа «если …, то …, а иначе»: a = thisComp.layer("Controller").effect("On-Off")("Checkbox"); // придумали переменную-ссылку на Checkbox Control if (a == 1); // == это знак равенства, одно «равно» - это присвоение в Ae { w = wiggle(2,100); } else value

X = time*300; Y = value[1] + Math.sin(5*time)*100;   if (effect("On-Off")("Checkbox") == 1) {        w = wiggle(12, 100); } else w = wiggle(0, 0);   value = [X, Y] + [0, w[1]];

на Opacity: if(effect("Dead")(1)==1){value = 0;} else{100;} и if(effect("Dead")(1)==1){value=100;} else(0);

Fx Angle Control

fx Angle Control - контроль/хранение поворота в градусах Контролируем - Rotation, Evolution, т.д. что в градусах и с секундомером.

 

Fx Slider Control

fx Slider Control - контроль/хранение одной цифры Контролируем – Opacity, Noise, Seed, т.д., что из одной цифры или одну из цифр двух-координатных параметров. * пкм – Edit Value… - можно задать диапазон

Применение - ограничить время действия этого экспрешна: * накидываем Slider Control, экспрешен с отсылкой амплитуды на слайдер: wiggle(effect("Slider Control")("Slider"), 4); - анимируем слайдер от 0 до нужной амплитуды * маркерами

 

 

Fx Point Control

fx Point Control - контроль/хранение точки с координатами x,y (как бы замена двух Slider Controls, каждый из которых хранит по одной цифре-координате) Просто лассо от Position (у любого количества слоев) тянем на этот контроллер.

Контролируем ДВУХ-координатные параметры: Position, Scale, Anchor Point, т.д., а также можно ОДНО-цифровые параметры, но лассо ссылаемся-указываем тогда на x ИЛИ y, путем указания на одну из координат: effect("Point Control")("Point")[0] // или [1]

fx 3 D Point Control - контроль/хранение точки с координатами x,y,z

 

Fx Layer Control

fx Layer Control – хранение слоя, на который ссылаемся в экспрешене

Задача. У круга Position Y сделать зависимой от: а) Position Y у квадрата б) быстро поменять эту зависимость на зависимость от Position Y у треугольника, звезды или ДР. слоя…

Решение: у круга экспрешен на Position: а) p = thisComp.layer("Квадрат").transform.position; [value[0], posnew[1]]; б) накидываем на круг fx Layer Control и меняем экспрешен на: L = effect("Layer Control")("Layer") p = L.transform.position; [value[0], posnew[1]]; ! В контроллере быстро выбираем любой слой: треугольник, звезду… J

 

http://aexpressions.ru/ae_scripts/pop-menu/

 

Fx Beam, connecting layers

Эффект «связки объектов ВЕРЕВКОЙ» (похоже на как сторонний плагин Connect Layers или mini-Plexus!) * Solid_1, fxBeam * 3 Null Objects, расположить их в разных местах вручную * У Beam: экспрешены на параметры - Starting Point: layer = thisComp.layer("Null 1") layer.toComp([0,0,0]) - End Point: layer = thisComp.layer("Null 2") layer.toComp([0,0,0]) Концы линии-веревки автоматически сориентируются по направлению к Null 1 и Null 2. - Увеличив в Beam параметр Length до 100% - концы встанут точно в соответствующие Null Objects * Второй и третий Solid Layers c аналогичными экспрешенами. * в «vertexes треугольника из линий» расположить любые шейпы/слои и привязать их к Null Objects * Заанимировать шейпы. Например, рандомно.

On your first Beam effect layer add the expression control "Layer Control" and rename it to 'Start Point'. Duplicate it and rename this one 'End Point'. Then you need to type in the expression window for starting point - effect("Start Point")("Layer").toComp([0,0,0]); -and for the ending point put in - effect("End Point")("Layer").toComp([0,0,0]); -. Now you can just select the layers you want to connect together from the drop down boxes. So 3 beam layers would make a triangle if you connect Dot 1 to Dot 2, Dot 2 to Dot 3 and Dot 3 to Dot 1.

 

 

Стрелки часов

* AdjL («Arrows_Control»), накидываем два fx Angle Controls, называем «Seconds» и «Minutes»: * контроллер «Minutes» парентим к контроллеру «Seconds» с делением на 60: effect("Seconds")("Angle")/60;   * на контроллер «Seconds» варианты: 1) экспрешен: time*100; 2) экспрешен: timeToFrames(time); // за 1 сек поворот на 25 кадров (градусов) 3) два ключа (0 (1) 3) и экспрешен: loopOut("continue");   * Rotation шейпов-стрелок парентим к соответствующим Angle контроллерам

** Стрелку часов можно также сделать с помощью loopOut("offset");

 

*Экспрешен loopOut("offset"); можно использовать для быстрых корректив скорости – просто двигаем один из ключей, например, на Position.

 

Вывод инфо в Text Layer

▪ Text Layer ~ console.log

Text Layer, параметр Source Text просто парентим к Slider, чтобы показывать в окне Preview его значения

thisComp.layer("Shape Layer 1").transform.rotation; // вывести значение rotation   thisComp.layer("clocks").transform.position.value; // вывести значения position: thisComp.layer("Shape Layer 1").content("Fill 1").color.value; // цвет 4 цифры   thisComp.layer("Shape Layer 1").effect("Colors 1")("Midtones").name; // имя

thisLayer.name[thisLayer.name.length - 1]; // последний знак в имени слоя (буква или цифра:) thisLayer.name[thisLayer.name.length - 2]; // предпоследний…

thisComp.layer("Shape Layer 1").sourceRectAtTime().width; // габариты слоя

Text Layer, в пара