Практическое упражнение 4.1: Работа со спрайтами
Теперь узнаем, как размещать спрайты в партитуре, и как работать с этими спрайтами на сцене. В этом упражнении вы будете помещать различные элементы труппы на сцену и применять различные эффекты для создания особого фонового изображения. Вы также будете осваивать выбор каналов, эффекты прозрачности, масштабирование и манипулирование спрайтами на сцене.
Рассмотрим пример
Давайте посмотрим на завершенное упражнение.
1. Откройте файл с именем *.dir.
а) Выберите File | Open .
б) Выберите и откройте файл *.dir. Щелкните по кнопке No (Нет) в ответ на запрос, будете ли вы сохранять изменения в файле, используемом нами в Экскурсии 4С.
2. Щелкните по кнопке Play на панели Control Panel. Вы не увидите на сцене ничего движущегося, но должны обратить внимание на следующие особенности завершенного упражнения.
а) Головка будет циклически двигаться по партитуре.
б) Должно быть шесть каналов, содержащих элементы труппы, показываемых на сцене.
в) В окне Internal Cast (Внутренняя Труппа) должно быть пять элементов труппы.
Что должно получиться на экране
На рис. 4.19 показано изображение сцены, созданное комбинацией пяти различных элементов труппы. Небо является фоном (задним планом) и помещено в канал 1. Деревья образуют передний план и помещены в каналы 5 и 6. При дальнейшей работе с Director'oM вы часто будете хотеть накладывать спрайты для создания иллюзии глубины, а также анимировать по отдельности различные спрайты на сцене.
Рис. 4.19. Завершенная сцена с отображением всех спрайтов
Что должно получиться за сценой
На рис. 4.20 показана завершенная партитура. Изучите ее вид на экране. Если окно Score закрыто, то выберите Window | Score.
Рис. 4.20. Завершенная партитура со спрайтами в шести каналах
Пять спрайтов, занимающие каналы 2-6 партитуры, окрашены в разные цвета, чтобы лучше их различать. Вы, вероятно, найдете практичным окрашивание спрайтов в партитуре и определение для каждого типа элементов своего цвета. Это уменьшает сложность партитуры и улучшает ее организацию. Вам представится возможность это проделать в данном упражнении.
Пошаговые инструкции
1. Начнем с открытия файла, содержащего необходимые нам элементы, следующим образом.
а) Выберите File | Open.
б) Выберите и откройте файл *.dir.
2. Выберите File | Save As и поместите ваш новый файл в папку с именем Save Work на вашем жестком диске. Назовите файл MyMomtain.dir.
3. Давайте изменим интервал показа кадров спрайтов следующим образом.
а) Выберите Edit | Preferences | Sprite (Правка | Предпочтения | Спрайт).
б) Теперь будет открыто диалоговое окно Sprite Preferences (Предпочтения Спрайта), показанное на рис. 4.21.
Рис. 4.21. Диалоговое окно Sprite Preferences
в) Найдите поле Span Duration (Интервал Показа) в нижней части окна.
г) Убедитесь в том, что выбрана радиокнопка рядом с полем Frames (Кадры) (но не кнопка Width of Score - Ширина Партитуры).
д) Щелкните курсором в поле ввода данных и напечатайте 10. При этом будет установлен интервал кадров, используемый по умолчанию, равный 10. Другими словами, когда спрайт будет помещен в партитуру, то Director автоматически создаст 10 кадров для этого спрайта.
е) Щелкните по ОК, чтобы закрыть это окно.
Подсказка
Работа с более короткими интервалами спрайтов облегчает управление спрайтами в партитуре.
Подсказка
При помещении элемента труппы в партитуру, а не на сцену изображение на сцене автоматически центрируется.
4. Создадим первый элемент нашего заднего плана следующим образом.
а) Окно Cast уже должно быть открыто либо в пристыкованном к партитуре виде, либо как независимая панель. Если оно не открыто, то выберите Window | Cast.
б) Выберите первый элемент в окне Cast. Его имя Sky (Небо).
в) Щелкните мышью прямо по миниатюре элемента труппы с именем Sky и, удерживая нажатой кнопку мыши, перетащите элемент в партитуру и поместите в кадр 1 канала 1. После «отпускания» элемента труппы Sky на кадр 1 спрайт теперь займет интервал с 1-го по 10-й кадр (так как мы изменили интервал показа на 10). На рис. 4.22 показан элемент труппы Sky в партитуре.
Рис. 4.22. Элемент труппы Sky в партитуре
г) Ознакомьтесь с цветовой палитрой каналов, расположенной внизу столбца видимых каналов (см. рис. 4.23). То, вы увидите на своем экране, может выглядеть немного по-другому в зависимости от установленных размеров окна Score.
Рис. 4.23. Цветовая палитра каналов внизу столбца каналов
Подсказка
Вы можете присваивать спрайтам в партитуре любой цвет, выбирая спрайт, а затем щелкая по цвету в цветовой палитре каналов. Какие цвета вы выберете, не имеет значения. Когда вы начнете работать над своим собственным проектом, то, может быть, захотите присвоить спрайтам определенные цвета в соответствии с некоторым составленным вами организационным планом.
д) Щелкните по каналу 1 в любом месте между кадрами 1 и 10. При этом будет выбран спрайт в партитуре.
е) Щелкните по голубому кубику в цветовой палитре каналов. Спрайт в канале 1 станет голубым (какой цвет вы определите, здесь не имеет значения - вы просто имеете возможность изучить эту функцию).
5. Давайте поместим горы в партитуру.
а) Выберите второй элемент в окне Cast: Mountains (Горы).
б) Щелкните по этому элементу и перетащите его в канал 2 партитуры, поместив его в кадр 1. При помещении спрайта Mountains в партитуру, как показано на рис. 4.24, а не на сцену, он центрируется на сцене, хотя вы можете перемещать его на сцене, как вам угодно.
Рис. 4.24. Элемент труппы Mountain помещен в канал 2 партитуры
в) Спрайт Mountains должен быть в партитуре все еще выбранным (выделенным). Щелкните в цветовой палитре каналов по желтому кубику. Спрайт Mountains в канапе 2 теперь станет желтым.
Если вы выберете спрайт (щелкнете по нему) на сцене, то появится рамка, ограничивающая спрайт. Ограничивающая рамка представляет собой прямоугольник, в который заключено изображение спрайта и который определяет края спрайта сверху, снизу и с боков. В четырех углах и в середине каждой стороны ограничивающей рамки имеются метки-манипуляторы. Эти метки могут быть использованы для манипулирования изображением спрайта при изменении его размеров, зеркальном обращении, деформировании и вращении его на сцене. Наряду с ручным перемещением этих меток для манипулирования спрайтом вы можете вводить цифровые значения для более точных изменений. 6. Щелкните по спрайту Mountains на сцене. Теперь на сцене станет видна ограничивающая рамка этого спрайта. Вы можете сделать окно Stage чуть больше или использовать полосы вертикальной/горизонтальной прокрутки, для того чтобы полностью видеть ограничивающую рамку вокруг изображения Mountains.
1. Обратите внимание, что при выборе спрайта на сцене или в окне Cast в верхнем левом углу Property Inspector появляется изображение миниатюры. В Property Inspector также будут показаны номер элемента труппы выбранного спрайта, его имя, тип и место в окне Cast, как показано на рис. 4.25.
Рис. 4.25. Спрайт Mountains и его информация показаны в Property Inspector
8. Изображение гор является только «самими горами» и не включает в себя белый цвет, который вы видите за горами. Этот белый цвет был автоматически добавлен Director'ом. Когда спрайт помещается на сцену и его Изображение не имеет прямоугольной формы, то по умолчанию вне этого изображения, но в пределах ограничивающей рамки, показывается фоновый цвет. При помощи опции Ink Effects (Эффект Прозрачности) мы можем сделать белый фон прозрачным или создать другие эффекты.
9. Для того чтобы небо заднего плана было видно через белую часть гор, применим к этому спрайту эффект прозрачности.
а) Выберите спрайт Mountains, щелкнув по нему на сцене или в партитуре.
б) Если Property Inspector не открыт, то откройте его, выбрав Window | Property Inspector. Вкладка Sprite должна быть сверху.
в) Выберите ниспадающее меню Ink Effect, показанное на рис. 4.26.
Рис. 4.26. Ниспадающее меню Ink Effect
г) Выберите Matte (Прозрачная Маска). Эффект прозрачности Matte воздействует на белые области вне объекта гор и делает их прозрачными. Конечный результат будет состоять в том, что спрайт Sky на заднем плане теперь станет виден в областях спрайта Mountains, которые раньше были белыми (см. рис. 4.27.).
Рис. 4.27. Сцена после применения эффекта прозрачности Matte к спрайту Mountains
10. Поместим на сцену озеро.
а) Выберите третий элемент в окне Cast: Field and Lake (Поле и Озеро).
б) Перетащите Field and Lake на сцену и поместите его у подножия гор. Director создаст спрайт Field and Lake и автоматически поместит его в следующий свободный канал (в этом случае - в третий).
в) Примените эффект прозрачности Matte, выбрав в партитуре или на сцене спрайт Field and Lake и использовав ниспадающее меню эффектов в Property Inspector. Результат показан на рис. 4.28.
11. Поместим на сцену деревья.
а) Выберите в окне Cast элемент труппы Tree 1 и перетащите его на сцену.
Рис. 4.28. Сцена и партитура после добавления спрайтов Field and Lake
б) Расположите Tree 1 в нижней правой части сцены, как показано на рис. 4.29.
в) Эффект прозрачности Matte не подойдет для этого спрайта, так как в листьях есть пикселы, которые должны быть прозрачными. Щелкните по ниспадающему меню Ink Effect в Property Inspector и выберите опцию Background Transparent (Прозрачный Фон). Этот эффект преобразует каждый белый пиксел и сделает его прозрачным.
Рис. 4.29. Сцена и партитура после добавления Tree 1
12. Теперь поместим на сцену другое дерево.
а) Выберите Tree 2 в окне Cast и поместите его в нижнюю левую часть сцены. (Этот элемент труппы слишком велик, но мы быстро это поправим.)
б) Цвет фона этого изображения оранжевый. Чтобы эффект прозрачности работал правильно, вы должны выбрать оранжевый цвет для фона. Используя селекторы цвета переднего и заднего плана Forecolor и Backcolo в Property Inspector, щелкните по кнопке Background Color, чтобы вызвать палитру цвета заднего плана, показанную на рис. 4.30.
Подсказка
Работа с селектором заднего плана имеет небольшую хитрость. Когда вы щелкаете и несколько секунд удерживаете нажатой кнопку мыши; то при отпускании кнопки палитра остается открытой. Однако если вы щелкните и сразу начнете водить по палитре мышью, то палитра закроется в тот момент, когда вы выберете нужный цвет и отпустите кнопку.
Рис. 4.30. Доступ к палитре Background Color
в) На цветовой палитре выберите оранжевый кубик, расположенный прямо под белым цветом, как показано на рис. 4.31.
Рис.4.31. Выбор подходящего цвета заднего плана
г) Выберите опцию Background Transparent из ниспадающего меню Ink Effect. Фон Tree 2 теперь должен стать прозрачным (см. рис. 4.32.).
Подсказка
Наиболее предпочтительным методом является импорт в Director графических изображений с уже подобранными размерами. Изменение графики на сцене может привести к замедлению отображения при воспроизведении. Мы изменяем размеры изображения здесь, только чтобы показать вам, как можно манипулировать с изображениями.
Рис. 4.32. Фон в Tree 2 стал прозрачным
13. Теперь немного «фотомагии». Давайте изменим размеры и выполним зеркальное обращение спрайта второго дерева так, чтобы оно выглядело удаленным и стало ближе к заднему плану сцены.
а) Выберите на сцене Tree 2.
б) Используя угловые метки на ограничивающей рамке, щелкните по углу и, не отпуская кнопку мыши, уменьшите размеры Tree 2, как показано на рис. 4.33.
Подсказка
Если нажать и удерживать клавишу Shift, перед тем как начать изменение размеров, то при проведении изменений будут сохраняться первоначальные пропорции (коэффициент пропорциональности) дерева.
Рис. 4.33. Использование угловой метки на ограничивающей рамке для уменьшения размеров изображения
в) Щелкните по кнопке Flip Horizontal (Горизонтальное Зеркальное Обращение) в Property Inspector, для того чтобы получить зеркальное отображение спрайта на сцене, как показано на рис. 4.34.
Рис. 4.34. Выбор кнопки Flip Horizontal в Property Inspector
14. Сохраните вашу работу.
