Продолжаю обзор Flex Skin Design Extension, на этот раз буду повествовать об extension под Adobe Photosop CS3. Часть первая, об extension в целом и его версии под Adobe Flash CS3, находится тут.
Flex Skin Design Extension под Photoshop представляет собой набор PSD шаблонов и два скрипта (экспорт скина и мастер создания скина).
Установка крайне простая, копируем содержимое архива в папку “\Program Files\Adobe\Adobe Photoshop CS3\Presets“. Теперь можно запускать Photoshop и начинать зверский акт вандализма над стандартными скинами 
Запускаем Photoshop и запускаем мастер создания скина (File -> Scripts -> New Flex Skin…). Первое отличие от extension под Flash – это наличие выбора создания скина для нескольких компонент или для одного выбранного компонента. При выборе опции создания скина для единичного компонента активируется возможность выбрать диапазон применимости скина (для всех виджетов этого типа в приложении или только для тех, у кого заданный styleName 
).
Рассмотрим создание скина для кнопки, у которой styleName=”customButton”. После выбора нужных значений и ввода styleName в мастере создание скина жмем Ок и получаем новый документ с импортированными в него заготовками для состояний кнопок (названия слоев и папок заданы в виде Button_customButton_overSkin и т.д., по состояниям виджета), а также хитрая папка с фоновым декором и пояснениями к шаблону (ее нужно скрывать перед экспортом скина, она так и называется – “_HIDE BEFORE EXPORTING”, но об этом потом).
После того, как вдоволь поиздевались над скином, прячем папку с названием _HIDE BEFORE EXPORTING и запускаем скрипт экспорта (File -> Scripts -> Export Flex Skins…). Скрипт попросит вас указать, куда будем создавать скины, и после нажатия OK начинаются танцы с бубнами, т.е. сохранение скина. (Фотошоп желательно оставить в покое, так как скрипт устраивает всяческие махинации с создаванием документов и т.д.)
После того, как скрипт закончит злодеяния, заходим в выбранный каталог для экспорта и смотрим, что создалось. А создалось, вопреки ожиданиям на чудо, css или что-то в этом духе – папка assets с четырьмя PNG-24 файлами. Теперь настал час “Ч” – импортировать весь этот artwork в Flex приложение.
Запускаем импорт нашего скина (File -> Import -> Skin Artwork…). Выбираем нашу папку со скином, в качестве значения для поля Folder or Bitmaps, и проект, внешний вид которого мы хотим изменить (также можно выбрать папку, куда все будет свалено, и название CSS файла; по умолчанию стоят названия assets). Next. Выведется список из доступных PNG, в котором можем выбрать, что будет импортироваться, а что – нет. Дополнительно в списке указывается название состояния виджета, на которое будет влиять PNG.
Finish. В папке проекта создается каталог assets, в который скопировались картинки, и в корне создался assets.css, в котором прописан стиль для нашей кнопки, а также в main MXML файл подключили наш CSS.
Fin.
Впечатления: все хорошо, но:
- В версии для Flash не хватает мультивыбора компонент и указания styleName для единичного компонента, и довольно грязный импорт во Flex: помимо скина там в списке еще масса всякого хлама; хорошо, что все, что относится к скину, выбрано по умолчанию, а остальное отключено;
- В версии для Photoshop не очень удобно редактировать скины, особенно полупрозрачные градиентные заливки;
- В версии для Photoshop есть один большой минус: дизайнеру нельзя задать параметры для Scale-9 (это можно будет сделать только в коде, то есть подправить ручками CSS) и результат растровый;
Вроде все перечислил. Если что забыл, пишите, обновлю пост.
