Adobe extendscript toolkit что это

Adobe extendscript toolkit что это

Изучаем Adobe Extendscript Toolkit CC

Adobe Extendscript Toolkit CC — Среда разработки (IDE), используемая для написания, тестирования и выполнения скриптов ExtendScript. Поставляется в комплекте с Creative cloud.

Мы рассмотрим эту программу как очень полезный инструмент для изучения DOM структуры Adobe документов, возможных параметров и свойств объектов входящих в документ.

Для начинающего разработчика расширений для программ Adobe это очень полезный и нужный инструмент.

Установка Extendscript Toolkit CC:

Запустить Creative cloud, открыть из меню «Установки», раздел Creative Cloud, раздел Apps? Отметить галочкой – «Показывать более ранние приложения»

После этого в списке доступных программ появится Extendscript Toolkit CC :

Прямые ссылки на Extendscript Toolkit CC

После установки открываем программу, выбираем приложение, с которым будем работать, в нашем примере это Adobe Photoshop CC 2019:

Photoshop должен быть запущен и в нем нужно создать или открыть любой поддерживаемый файл.

В среде Extendscript Toolkit можно запускать скрипты, отслеживать ошибки, делать отладку, вывод значений переменных и т.п., но мы рассмотрим режим Data Browser, найти его можно в меню – Window – Data Browser:

Откроется окно с многочисленными свойствами данных, режимов, модулей программы, функций Photoshop.

Типы данных, которые мы сможем изучать:

Для нас в первую очередь интересует ветка app=[Application Adobe Photoshop] – открываем объект приложение Photoshop:

С этой ветки можно изучать свойства программы Photoshop.

Выберем переменную activeDocument = [Document Изучение Toolkit.psd] – в Photoshop открыт и активен документ с таким именем — Изучение Toolkit.psd. Чтобы воспользоваться в скрипте такой информацией, к примеру присвоить переменной это значение нужно написать скрипт:

var s=app. activeDocument

При выполнении будет выведено значение объекта Document Изучение Toolkit.psd

Выберем переменную build

выведет полную информацию о версии сборки программы Photoshop

Выберем метод openDialog()

Набираем скрипт app.openDialog() – запускаем на выполнение и откроется диалоговое окно выбора файла выбрав любой файл и нажав открыть в программе Photoshop ничего не откроется, этот метод нужен для работы с файлами – например напишем скрипт:

var f= app.openDialog()

Теперь после выбора файла мы получили переменную f содержащую ссылку к файлу или файлам, т.к. методом openDialog() можно выбрать несколько файлов.

app.open(new File( f ))

этим скриптом загружаем выбранный в диалоге файл в Photoshop? Если были выбраны несколько файлов, то их переменные будут указываться следующим образом f[0], f[1], f[2] …

Метод doAction() – запуск операций (Action):

app.doAction("Имя операции","Имя набора операций") этот скрипт запустит экшн, записанный вами.

И так далее изучайте возможные методы, доступные переменные для считывания.

Как понять что писать в аргументах метода – читать документацию по Extendscript — https://www.adobe.com/devnet/photoshop/scripting.html

Также есть справка по основным функциям в самой программе Extendscript Toolkit CC – меню help – Object Model Viewer:

В строке под Browser выбираем Adobe Photoshop XX Object Library, в строке поиска вводим интересующую нас функцию, например doAction (следите за регистром это важно) –

Получаем справку по данной функции, видим, что она имеет 2 аргумента имя операции и имя набора операций, обе переменных строковые, значит их значения надо писать в кавычках.

Вернемся к Data Browser, откроем объект app, в нем откроем объект activeDocument

В прошлый раз в скрипте мы писали

var s=app. activeDocument

И результат был объект, теперь если зайти в объект activeDocument, то можно найти переменную name. Теперь можно получить имя файла:

var s=app. activeDocument.name

Можно изучить текущий слой

Результат имя текущего слоя:

Погружаемся дальше открываем объект app.activeDocument.activeLayer

Видим множество методов, которые можно применять к слою, например размытие по Гауссу

app.activeDocument.activeLayer.applyGaus sianBlur(10) – размытие по Гауссу текущего слоя с радиусом 10px.

Объект bounds содержит координаты верхнего левого и нижнего правого угла выбранного слоя с учетом примененных к слою стилей

var b= app.activeDocument.activeLayer.bounds

alert("координата Х верхего левого угла"+b[0] )

alert("координата Y верхего левого угла"+b[1] )

alert("координата Х нижнего правого угла"+b[2] )

alert("координата Y нижнего правого угла"+b[3] )

При присвоении переменной b значение объекта bounds, переменная получает 4 числа в виде массива.

Объект boundsNoEffect содержит координаты верхнего левого и нижнего правого угла выбранного слоя без учета примененных к слою стилей.

Переменная grouped – булевая переменная, определяющая входит ли слой в группу.

Принцип изучения понятен, выбираем объект и смотрим какие переменные или методы мы можем использовать.

Читайте также:  Asus h110m r обновление биос

Удачи в познании возможностей Adobe Extendscript.

Урок №1 – первый скрипт для Adobe Illustrator

Установка Extendscript Toolkit

Для написания скриптов можно использовать любой текстовый редактор – даже блокнот. Я лично использую оригинальный Extendscript Toolkit (далее ESTK). Он имеет необходимый мне функционал и встроенный отладчик скриптов – что очень упрощает разработку. Хотя многие профессиональные программисты очень его не любят. По их словам он ну очень кривой и неудобный

Если Вы планируете разрабатывать скрипты в ESTK – то нужно убедиться, что он установлен. Под Windows обычно его можно найти в меню “Пуск” и в директории “C:Program Files (x86)Adobe” .

Если инструментарий ESTK не установлен – то проще всего его установить через Adobe Creative Cloud. Но на одном из компьютеров была проблема с такой установкой (в списке приложений просто не было ESTK). Если Вы столкнетесь с такой проблемой – ссылку на загрузку можно найти на официальном сайте тут:
https://helpx.adobe.com/ru/creative-cloud/kb/creative-cloud-apps-download.html

Для полного счастья нужно убедиться, что есть возможность подключиться Adobe Illustrator. Он должен появиться выпадающем списке, как на картинке.

Документация

Документация по особенностям работы JavaScript под Illustrator находится тут:
https://www.adobe.com/devnet/illustrator/scripting.html

Вам понадобятся в основном следующая информация:

  1. Adobe Illustrator CC 2017 Scripting Guide – основы работы со скриптами в Иллюстраторе. Если английский знаете хорошо – читать обязательно
  2. Adobe Illustrator CC 2017 Reference: JavaScript – список почти всех объектов и методов , которые есть в Illustrator с описанием и большим количеством примеров
  3. Object Model Viewer, расположенный в меню Help ESTK. Во многом содержимое пересекается с Reference, но некоторые моменты отличаются. Что-то есть только здесь, что-то только в Reference
  4. JavaScript Tools Guide – тоже расположен в меню Help ESTK. Описывает среду разработки. Много интересных нюансов. Среди прочего также рассказывает как правильно работать с файловой системой, создавать пользовательские окна с кнопками и подключать внешние DLL.
  5. Форум разработчиков скриптов на сайте Adobe:
    https://forums.adobe.com/community/illustrator/illustrator_scripting
  6. Примеры скриптов в ESTK, показывают как работать с пользовательским интерфейсом. На моем компьютере они расположены тут:
    C:Program Files (x86)AdobeAdobe ExtendScript Toolkit CCSDKSamplesjavascript
  7. Примеры скриптов в Illustrator, показывают как работать с некоторыми типами объектов.
    C:Program FilesAdobeAdobe Illustrator CC 2018ScriptingSample ScriptsJavaScript

Если на ваш взгляд, есть что-то еще полезное – пишите, будем вместе дополнять список )

Первый скрипт Hello World

Если дальнейший материал вызывает трудности – рекомендую ознакомиться с этим учебником: https://learn.javascript.ru/

В нем доступным языком описаны основы программирования на JavaScript. Обычно этот язык используется для написания программ на сайтах, которые запускаются внутри браузера пользователя (Chrome, Firefox и т.д.). Вас в первую очередь интересуют разделы “Введение” и “Основы JavaScript”.

Следующий пример взят из официального Scripting Guide – он хорош для начала.

По традициям программирования создадим скрипт, который пишет Hello World на экране.

Запустить скрипт можно напрямую из ESTK (например, кнопкой F5 или через меню Debug) или сохранить скрипт под отдельным именем и запустить уже напрямую, открыв в Illustrator (например, через CTRL+F12 или меню File->Scripts->Other scripts).

Давайте теперь напишем скрипт, который поменяет цвет и размер у имеющейся надписи.

Как происходит написание скриптов:

  1. Необходимо разбить задачу на подзадачи. Детализировать настолько мелко, чтобы каждый шаг можно было описать одной строчкой
  2. Написать саму программу.
  1. Найти текущий документ
  2. Найти надпись в нем
  3. Изменить параметры надписи

Чтобы понимать как это сделать – давайте начнем с иерархии объектов в Иллюстраторе.

На самом верхнем уровне у нас находится Application . Обратиться к нему можно через объект по имени app

Все открытые документы хранятся в массиве app.documents

К активному документу можно обратиться через через app.activeDocument

Внутри документа есть слои. Находятся они в массиве Document.layers

Внутри слоев могут быть объекты разных видов – слои, группы, пути, меши и т.д. Объекты группируются по типам в массивы с соответствующими названиями. Текстовые объекты находятся в массиве textFrames

Информацию об остальных типах объектов – ждите в последующих уроках. Самостоятельно изучить их можно, почитав Reference и Scripting Guide.

Каждый объект (путь, текст и т.д.) находится в массиве соответствующего типа , а также в массиве pageItems.

Читайте также:  Cata вытяжной вентилятор отзывы

Нумерация элементов в массивах начинается с 0.

Чтобы разобраться как поменять цвет символов – давайте обратимся к Reference (раздел TextFrameItem). Если просмотреть все свойства и объекты – то с первого взгляда непонятно, где искать цвет текста. В таких случаях можно либо спросить у кого-то, либо найти готовый пример на форуме Adobe, либо просмотреть подробно все свойства в Reference , относящиеся к объекту TextFrameItem. Если зайти в тип объекта TextRange, то там можно увидеть свойство characterAttributes, внутри которого есть свойство fillColor. И если дальше пощелкать по ссылкам, можно увидеть как создавать RGBColor. В результате код у нас станет следующим:

Запустите скрипт и посмотрите, что получится в результате.

А теперь маленькое домашнее задание: напишите скрипт, которые будет создавать три надписи с различным текстом, в разных местах, разного цвета и с разным размером шрифта.

Нам понадобится

  • Adobe Photoshop CS5 (можно CS4)
  • Adobe ExtendScript Toolkit (входит в дистрибутив Photoshop)
  • Знание JScript
  • Несколько фоток

Теория

У Photoshop-а есть COM API, в котором покрыты многие из фотошоповских функций. Его, разумеется, можно использовать из JS- или VBS-скриптов. Adobe любезно предоставила разработчикам свою IDE, с автокопмлитом и брейкпоинтами. Поддерживаемые языки в ней JScript, VBScript (Win) и AppleScript (Mac). Я остановился на JScript, потому как большинству будет лучше всего понятен именно он.

Удобно, особенно если надо написать скрипт для фотошопа под заказ и не хочется давать исходники. Насчёт возможности его декомпиляции я детально не разбирался, но думаю, что переменные он меняет и кое-какую оптимизацию всё-таки делает.
Итак, IDE на первый взгляд неудобная, но поработав в ней минут 30, привыкаешь.

Скриптовый язык

Т.к. ExtendScript кроссплатформенный, пути к файлам представляются как /d/Temp/…

Живой пример

#target photoshop
app.bringToFront(); // запускаем Photoshop. Если он уже запущен, подключимся именно к нему, не к новому инстансу.
var Constants = < /* определим кое-какие константы */ >
ProcessDir(Constants.InputDir, Constants.OutputDir);
function ProcessDir(dir, outDir) <
var folder = Folder(dir); // Adobe-овский объект
var files = folder.getFiles(Constants.FileMask); // Внимание, две маски через запятую (*.jpg,*.png) уже не работают.
var outFolder = Folder(outDir);
if (!outFolder.exists) <
if (!outFolder.create()) <
alert( "Cannot create output folder" );
return ; // может и не получиться
>
>
var totalFiles = 0;
for ( var fileNum in files) <
var outFile = GetOutputFileName(files[fileNum], outFolder.fullName); // куда писать результат
AddLogoToFile(files[fileNum], outFile); // собственно, сама обработка
totalFiles++;
>
alert(totalFiles + " files processed" ); // увидит юзер в Photoshop-е в конце обработки
>
function AddLogoToFile(file, outputFile) <
var photoFile = File(file); // Так открываются файлы, строчку open не понимает
var logoFile = File(Constants.AddLogo.LogoPath);

app.open(logoFile); // открываем лого
app.activeDocument.artLayers[ "Text" ].copy(); // ArtLayers – слои в файле. Этот слой назывался "Text"
var logoW >as ( "px" );
var logoHeight = app.activeDocument.height. as ( "px" );
app.activeDocument.close();

app.open(photoFile); // открываем фотку

var w >as ( "px" );
var height = app.activeDocument.height. as ( "px" );

var logoLayer = app.activeDocument.artLayers.add(); // добавляем на фотку новый слой, куда поместим лого
logoLayer.name = "Logo" ; // название нового слоя

app.activeDocument.paste(); // вставляем лого из clipboard

var shape = [ // Photoshop вставляет всё в середину; выделяем лого, чтобы перенести его
[(width — logoWidth) / 2, (height — logoHeight) / 2],
[(width — logoWidth) / 2, (height + logoHeight) / 2],
[(width + logoWidth) / 2, (height + logoHeight) / 2],
[(width + logoWidth) / 2, (height — logoHeight) / 2]
];
app.activeDocument.selection.select(shape);

app.activeDocument.selection.translate( // переносим selection вправо вниз
new UnitValue((w >"px" ),
new UnitValue((height — logoHeight) / 2, "px" ));

var minImageDimension = Math.min(w >// масштабируем лого, чтобы оно было в 5 раз меньше минимального размера фотки
var logoScaleMultiplier = minImageDimension / 5 / logoWidth * 100;
app.activeDocument.selection.resize(logoScaleMultiplier, logoScaleMultiplier, AnchorPosition.BOTTOMRIGHT); // обратите внимание на последний аргумент

app.activeDocument.artLayers[ "Logo" ].opacity = 75; // делаем слой полупрозрачным
app.activeDocument.artLayers[ "Logo" ].blendMode = BlendMode.LUMINOSITY; // устанавливаем режим смешивания, чтобы выглядело симпатичнее
// а вот тут бы установить blending options! Об этом читайте дальше.
SaveFile(outputFile); // сохранит и закроет файл
>

function SaveFile(outputFile) <
var isPng = /png$/i.test(outputFile);
var saveOptions;
if (isPng) <
saveOptions = new PNGSaveOptions();
> else <
saveOptions = new JPEGSaveOptions(); /* неинтересный код про качество картинки */
>
app.activeDocument.saveAs(File(outputFile), saveOptions, true , Extension.LOWERCASE)
app.activeDocument.close(SaveOptions.DONOTSAVECHANGES); // закрываем документ
>

Скрипт готов. Осталось сделать лого в формате PSD – такое, чтобы внутри был слой Text, на котором и должно быть размещено лого.
Пример того, что получится:

Полностью скрипт вылолжил на pastebin.

Читайте также:  Catroot что это за папка

О грустном

Немного о недокументированном API

var >"setd" );
var desc15 = new ActionDescriptor();
var >"null" );
var ref6 = new ActionReference();
var >"Prpr" );
var >"Lefx" );
ref6.putProperty( idPrpr, idLefx );
var >"Lyr " );
var >"Ordn" );
var >"Trgt" );
ref6.putEnumerated( idLyr, idOrdn, idTrgt );
desc15.putReference( idnull, ref6 );
var >"T " );
var desc16 = new ActionDescriptor();
var >"Scl " );
var >"#Prc" );
desc16.putUnitDouble( idScl, idPrc, 100.000000 );
var >"DrSh" );
var desc17 = new ActionDescriptor();
var >"enab" );
desc17.putBoolean( >true );
var >"Md " );
var >"BlnM" );
var >"Mltp" );
desc17.putEnumerated( idMd, idBlnM, idMltp );
var >"Clr " );
var desc18 = new ActionDescriptor();
var >"Rd " );
desc18.putDouble( idRd, 0.000000 );
var >"Grn " );
desc18.putDouble( idGrn, 0.000000 );
var >"Bl " );
desc18.putDouble( idBl, 0.000000 );
var >"RGBC" );
desc17.putObject( idClr, idRGBC, desc18 );
var >"Opct" );
var >"#Prc" );
desc17.putUnitDouble( idOpct, idPrc, 75.000000 );
var >"uglg" );
desc17.putBoolean( >true );
var >"lagl" );
var >"#Ang" );
desc17.putUnitDouble( idlagl, idAng, 120.000000 );
var >"Dstn" );
var >"#Pxl" );
desc17.putUnitDouble( idDstn, idPxl, 5.000000 );
var >"Ckmt" );
var >"#Pxl" );
desc17.putUnitDouble( idCkmt, idPxl, 0.000000 );
var >"blur" );
var >"#Pxl" );
desc17.putUnitDouble( idblur, idPxl, 5.000000 );
var >"Nose" );
var >"#Prc" );
desc17.putUnitDouble( idNose, idPrc, 0.000000 );
var >"AntA" );
desc17.putBoolean( >false );
var >"TrnS" );
var desc19 = new ActionDescriptor();
var >"Nm " );
desc19.putString( >"Linear" );
var >"ShpC" );
desc17.putObject( idTrnS, idShpC, desc19 );
var >"layerConceals" );
desc17.putBoolean( >true );
var >"DrSh" );
desc16.putObject( idDrSh, idDrSh, desc17 );
var >"Lefx" );
desc15.putObject( idT, idLefx, desc16 );
executeAction( idsetd, desc15, DialogModes.NO );

Как вы думаете, что делает этот код? Он добавляет тень (Drop Shadow) к слою, это видно по название «DrSh». Я подозреваю, что внутри Photoshop-а прямо так и называются контролы в GUI.
Но, выполнив этот код, обнаружим, что он работает.
Можно найти, что executeAction может как показать диалог пользователю, так и сделать свою работу молча (это определяет последний параметр). Сами ID-шники нигде не описаны, о них (как и о том, что будет с ними в CS6) мы можем только гадать.
Тем не менее, фича логгирования действий довольно интересная, если очень надо, можно по-быстрому накидать скриптик для себя.

Ещё скрипты

Заодно я написал вот такие функции:

  • ресайзинг картинок до определённого размера (ширина не больше X, высота не больше Y)
  • добавление рамок к картинкам – таких же, как в этом топике

Если вам интересно, вы можете посмотреть их в том же скрипте на pastebin.

Интересные факты

  • в API есть поддержка RAW. После того, как вы обработали RAW-файлы в Photoshop-е, сохранив в них настройки, вы можете быстро сконвертировать их в JPEG
  • в отличие от blending options, фильтры представлены в API довольно хорошо, для каждого из них есть функция
  • код в jsx-файлах можно вешать на события в Photoshop: например, при открытии файла добавлять в него новый слой, и так далее
  • API есть и для Illustrator, и для Bridge
  • из API есть доступ к гистограмме и к каналам

Выводы

API вкусное, очень вкусное. Но отсутствие поддержки blending options сильно удручает; если они нужны – будьте готовы к тому, что придётся возиться со страшным кодом. Если всё, что вам надо (что как раз и надо в большинстве случаев от пакетной обработки) – обвести картинку рамочкой, думаю, ImageMagick в этом случае будет быстрее и намного удобнее.

фильтры, гистограммы
RAW
color profiles, как в Photoshop-е
javascript – удобный, понятный почти всем язык
документация с примерами
отсутствие blending options
для работы нужен Photoshop /* внезапно */
работает довольно медленно

Почитать

Adobe Photoshop Scripting – официальный ресурс
Scripting Photoshop – небольшой, но полезный тьюториал по скрпитингу в Photoshop
PS-Scripts – форум о скриптах для Photoshop

Ссылка на основную публикацию
Adblock detector