Маска динамическим текстом. Урок для флеш. Action Script 2. Часть 3.

Среда, 21 Мая 2014 г. 13:34 + в цитатник

Ну вот и заключительная третья часть урока по созданию маски динамическим текстом. Приступим непосредственно к маскированию.
Напоминаю, что наша цель это создание вот такого информера, в котором используется маска динамическим текстом для видео (футажа).

В первой части урока мы создали папку для нашего проекта, сам файл проекта в формате sqf и создали в этом проекте цифровые часики, которые поместили на основную сцену "Сцена 1".

Урок 1. Смотрим здесь
Маска динамическим текстом. Урок для флеш. Action Script 2. Часть 1.

Во второй части урока мы создали цифровой календарь, который разместили на основную сцену "Сцена 1", к уже имеющимся там цифровым часикам и протестировали нашу флешку.

Урок 2. Смотрим здесь
Маска динамическим текстом. Урок для флеш. Action Script 2. Часть 2.

Теперь самое интересное. Создадим саму маску для футажа.
Снова откроем программу Sothink SWF Quicker и откроем в ней наш сохраненный проект - "Маска динамическим текстом".
Файл - Открыть
На данном этапе наш проект должен выглядеть следующим образом

Не забывайте, в дальнейшем, для постоянного сохранения вашего проекта периодически нажимать

Файл - Сохранить

Для дальнейшей работы нам потребуется создать дополнительные слои на Временной шкале. То есть, для того, чтобы часики и календарик стали масками, необходимо создать слои, где будут размещены футажи для маскирования.

Выделяем слой "Часики" и выше него создаем слой "Видео для часиков". Для этого нажимаем на плюсик под Временной шкалой. Теперь, дважды щелкнув по вновь созданную слою, в диалоговом окне вводим название для этого слоя - "Видео для часиков".

Далее, выделяем слой "Календарь" и выше него создаем слой "Видео для календарь".
И теперь наша Временная шкала будет выглядеть следующим образом

Далее нам надо будет создать Новый символ, в который мы поместим футаж для маскирования.

Вставка - Новый Символ
Новый символ - это видеоролик и имя ему даем "Футаж".

После того как Новый символ "Футаж" будет создан, откроется окно редактирования этого символа.

Импортируем в этот символ выбранное вами для маскирование видео (футаж).

Файл - Импорт

Указываете путь к вашему футажу. У меня он в папке с материалами проекта.
Если вы загружаете в Sothink SWF Quicker неотконвертированное видео, то сначала появиться диалоговое окно Импорта видео

В этом диалоговом окне обязательно проставьте галочку в пункте "Save a copy of the Flash Video file (*.FLV)". Это даст вам возможность сохранить копию вашего перекодированного видео в формате FLV, который используется во флеш программах для импорта видео файлов. Ниже данного пункта укажите путь для сохранения копии файла FLV. В нашем случае это папка создаваемого вами проекта. Этот ролик в формате FLV вы, затем запросто, можете использовать без проблем в других флешках и даже без дополнительной перекодировки.

Теперь нажимаем кнопку "Далее". Начнется загрузка видео в программу и его перекодировка.
Перед вами появиться диалоговое окно извещающее о том, что данному видео необходимы дополнительные кадры на Временной шкале.

Соглашаемся с тем, чтобы создать недостающие кадры для видео и видеофайл начинает загружаться на Временную шкалу символа "Футаж.

Теперь, нам надо из символа "Футаж" переключиться на основную сцену "Сцена 1".
Для этого щелкаем по вкладке "Сцена 1", которая находится над Временной шкалой.

На основной сцене "Сцена 1" закрываем на замочек слои "Часики" и "Календарь" для того, чтобы нечаянно не сдвинуть находящиеся там динамические тексты.

Теперь, выделив слой "Видео для часиков", из Библиотеки перетаскиваем на Рабочее поле, на слой "Видео для часиков" видеоролик "Футаж".

При выделенном слое "Видео для часиков" инструментом "Трансформация" щелкаем на Рабочем поле символ видеоролик "Футаж" и, немного, трансформируем размеры и положение видеофутажа, а в панели "Свойства" в графе "Имя" вписываем

masked1

Следующим действием, выделяем слой "Видео для календарь" и на него также из Библиотеки перетаскиваем видеоролик "Футаж", а с помощью инструмента "Трансформация" изменяем размеры и положение футажа. В панели "Свойства" в графе "Имя" вписываем

masked

Выделяем слой "Скрипт" и открываем вкладку "Действия". В блокнот этой вкладки вписываем следующий скрипт.

code:


masked.setMask(mask);

masked1.setMask(mask1);

На этом этапе можно уже протестировать вашу флешку, нажав в панели задач программы кнопку предварительного просмотра.

Но это еще не все. Далее нам необходимо поработать с видеороликом "Футаж".

В Библиотеке дважды щелкаем по символу "Футаж" и заходим в окно его редактирования.
Далее, на Временной шкале в окне редактирования видеоролика "Футаж", выше слоя "Слой 1", создаем новый слой "Слой 2"
Выделяем "Слой 1" и встаем на первый кадр загруженного футажа. Далее правой кнопкой мыши щелкаем в этом кадре и вызываем контекстное меню. В контекстном меню выбираем пункт "Вставить пустой ключевой кадр".

Теперь в первом кадре у нас пустой ключевой кадр и футаж становится невидимым в первом кадре. Если щелкнуть во второй кадр на Временной шкале "Слоя 1", то футаж снова становиться видимым.

Зачем мы это сделали. Дело в том, что при загрузке вашей флешки на вэб страничку произойдет то, что в первую очередь мы увидим не маскированные футажи. Если же в первом кадре футаж виден не будет, то мы увидим в первую очередь наш календарик и часики, то есть маску. Но нам надо, чтобы после загрузки всех кадров футажа пустой кадр больше не загружался. Этого мы добьемся с помощью скрипта. Укажем, как должна происходить загрузка.
Для этого выделяем "Слой 2" и открываем вкладку "Действие".
Смотрим сколько кадров в настоящее время находится на "Слое 1". В моем случае это 50 кадров. У вас может быть другое количество кадров. Все зависит от видео, которое вы загрузили.
Итак, на "Слое 2" в первом кадре, в блокноте вкладки "Действие" вписываем следующий код

code:


ifFrameLoaded(здесь вписать цифру количества кадров вашего футажа)

{

    gotoAndPlay(2);

}

Возвращаемся на основную сцену "Сцена 1". Для этого щелкните вкладку "Сцена 1".
На Рабочем поле основной сцены "Сцена 1" теперь мы видим

То есть, даже при включенной видимости слоёв с футажами, мы с вами эти футажи не видим.
Если же провести тестирование ролика то мы видим как календарик и часики эти футажи маскируют.
Сохраните на этом этапе ваш проект обязательно.
Файл - Сохранить.

В принципе, мы с вами выполнили нашу основную задачу и создали маску динамическим текстом. Если хотите, то можете экспортировать флешку и пользоваться ей. Только опять же напоминаю, что флешка должна иметь название отличное от имени нашего проекта в формате sqf. Напоминаю, что наш проект имеет имя - "Маска динамическим текстом.sqf". Значит флешке при сохранении надо дать любое другое имя. Это сделать обязательно. Иначе все наши данные слоям и символам осмысленные названия, например - "Футаж", слой "Часики" и так далее, превратятся в Символ 16, Слой 4 и так далее, а работать с таким проектом будет очень тяжело.

Далее же, я предлагаю некоторые действия, которые помогут придать нашему информеру более законченный и привлекательный вид. Но, как я уже отмечала выше, эти шаги не обязательны и могут быть выполнены на ваше усмотрение.
И так для тех, кто решил продолжить
Поставьте замочки на слои "Видео для часиков" и "Видео для календарь". Для этого щелкаем в квадратик рядом с глазком у выделенного слоя.
Со слоя "Календарь" наоборот снимаем замочек, щелкнув по этому замочку.
Выделяем слой "Календарь" и, щелкнув по нему правой кнопкой мыши, в появившемся контекстном меню, выбираем пункт "Копировать слой".

Далее, выделяем слой "Видео для часиков", который находится под слоем "Календарь" и, щелкнув по нему правой кнопкой мыши, в появившемся контекстном меню выбираем пункт "Вставить слой".
Очень внимательно посмотрите на скрин ниже и обратите особое внимание на то, где находится этот пункт меню, так как самым первым пунктом меню тоже является пункт "Вставить слой". Но это команда вставляет пустой новый слой, а вот команда "Вставить слой", которая расположена после пункта "Копировать слой", вставляет именно копию слоя, того, что вы скопировали ранее.

То есть, на Временной шкале под слоем Календарь, у вас должен появиться слой "Календарь копия"

Точно также поступаем со слоем "Часики". Снимаем с него замочек, выделяем слой "Часики", щелкаем по нему правой кнопкой мыши, из контекстного меню выбираем пункт "Копировать слой".
Снова щелкаем по слою "Часики" правой кнопкой мыши и, в появившемся контекстном меню, выбираем пункт "Вставить слой" (этот пункт находится внизу под пунктом "Копировать слой").
Над слоем "Часики" появиться слой "Часики копия". Этот слой надо опустить под слой "Часики". Для этого щелкаем по слою "Часики копия" левой кнопкой мыши и тянем его вниз, под слой "Часики".

Временная шкала на этом этапе должна выглядеть следующим образом

Следуем далее.
На Временной шкале выделите слой "Календарь", а на Рабочем поле инструментом "Выбор" (черная стрелка), выделите видеоролик "Календарь", щелкнув по нему. Откройте панель - вкладку "Фильтр" и нажмите на "+" - "Добавить фильтр".
В открывшемся контекстном меню выберите пункт "Тень"

Появятся параметры для настройки фильтра "Тень". Установите их как на скрине.

Слой "Календарь" закройте на замочек. Перейдите на слой "Календарь копия", выделите его, стрелками с клавиатуры нажмите один раз вправо и один раз вниз. Закройте слой "Календарь копия" на замочек.

Перейдите на слой "Часики", выделите слой и на Рабочем поле видеоролик "Часики". Примените фильтр "Тень" с такими же настройками как и для видеоролика "Календарь". Закройте слой "Часики" на замочек и перейдите на слой "Часики копия". Стрелками с клавиатуры нажмите один раз вправо и один раз вниз.
Оставьте замочки только на слоях - "Видео для календарь" и "Видео для часиков". С остальных замочки можно снять. На этом этапе обязательно сохраните ваш проект
Файл - Сохранить.

Теперь, перейдите в палитру Библиотека и дважды щелкните по символу - видеоролику "Календарь текст". В открывшемся окне редактирования этого символа, поочередно переходя на слои "День недели", "Месяц" и "Число", инструментом "Текст" удалите все тексты в текстовых полях.

Точно также в Библиотеке щелкните дважды по символу - видеоролику "Часики" и в окне редактирования этого символа инструментом "Текст", со слоя с часиками удалите текст в текстовом поле.

Перейдите на основную сцену "Сцена 1"и протестируйте флешку. Сохранять на этом этапе свой проект не надо, так как без текста в текстовых полях работать с проектом очень неудобно.
Теперь экспортируйте флеш файл под каким либо именем, отличным от названия вашего проекта.
Файл - Экспорт - Экспорт фильма

Серия сообщений "Уроки Flash":
уроки в разных флешпрограммах, авторские уроки flash
Часть 1 - Делаем элементарные часики.Начинаем учиться созданию flash.
Часть 2 - Как правильно записать код флешки или видео в рамочку для кодов.
...
Часть 21 - Делаем заготовку для флеш-календарика в Adobe Flash CS6..
Часть 22 - Маска динамическим текстом. Урок для флеш. Action Script 2. Часть 1.
Часть 23 - Маска динамическим текстом. Урок для флеш. Action Script 2. Часть 3.
Часть 24 - Создание 3D карусели ( пояснения к уроку от Веры BAT)
Часть 25 - Работа по уроку «Создание эффекта Боке».
...
Часть 48 - Анимация частей картинки с помощью маски.Урок для Adobe Flash.
Часть 49 - Использование панели «Редактор движения» в Adobe Flash CS6.
Часть 50 - Анимация формы во Flash(морфинг).

Серия сообщений "Маска в Sothink SWF Quicker":
Уроки флеш в программе Sothink SWF Quicker
Часть 1 - Эффект колышущейся картинки с помощью маски. Урок для Sothink SWF Quicker.
Часть 2 - Использование масок в программе Sothink SWF Quicker
...
Часть 4 - Маска динамическим текстом. Урок для флеш. Action Script 2. Часть 1.
Часть 5 - Маска динамическим текстом. Урок для флеш. Action Script 2. Часть 2.
Часть 6 - Маска динамическим текстом. Урок для флеш. Action Script 2. Часть 3.
Часть 7 - Эффект колышущейся картинки с помощью маски. Урок для Sothink SWF Quicker. Часть 2.

Рубрики:

Flash/флеш-информеры,часики
Flash/уроки sothnik swf quicker

Уроки по программе Sothnik SWF Quicker

Комментировать

« Пред. запись — К дневнику — След. запись »

Страницы: [1] [Новые]

Ирина_М-Лисёнок обратиться по имени Среда, 21 Мая 2014 г. 13:58 (ссылка)

Спасибо за уроки,все три взяла,буду изучать!!улыбка!

Ответить С цитатой В цитатник

Среда, 21 Мая 2014 г. 14:17ссылка

novprospekt

Желаю успехов. Если что-то будет не понятно, обращайтесь за дальнейшими разъяснениями.

Ответить С цитатой В цитатник Обратиться по имени

Jorjorych обратиться по имени Среда, 21 Мая 2014 г. 14:04 (ссылка)

Прекрасно, дождался. Вы, Марина, прелесть. Теперь придётся забыть обо всём надолго и заниматься упорно ... Огромное спасибо!
Спасибо-J (250x200, 611Kb)

Ответить С цитатой В цитатник

Среда, 21 Мая 2014 г. 14:16ссылка

novprospekt

Да уж, у меня Георгий теперь совесть, как говорится, чиста. Столько тянула с этим уроком, но действительно, наконец -то свершилось. Думаю особых трудностей с часиками и календариками не будет. Просто очень много всяческий действий. Если что, то пишите, будем разбираться.

Ответить С цитатой В цитатник Обратиться по имени

Среда, 21 Мая 2014 г. 15:28ссылка

Jorjorych

Прошёлся по уроку глазами - первые две части знакомы, третья, основная - понятна. Осталось совсем ничего: начать да закончить!
Счастья и удачи во всех начинаниях!
Love1 (211x200, 350Kb)

Ответить С цитатой В цитатник Обратиться по имени

wellax обратиться по имени Добрый день! Среда, 21 Мая 2014 г. 14:12 (ссылка)

Марина, у меня слов нет.., восхищаюсь твоим трудолюбием и желанием научить нас! У меня почти шок, столько написать, скрины и прочее.., я может позже напишу, с момента осознания. Спасибо!

Ответить С цитатой В цитатник

Среда, 21 Мая 2014 г. 14:26ссылка

novprospekt

Валюш, я сама еще плохо соображаю после такого рывка. Этот урок мучила больше чем полгода. Обещала Георгию (Jorjorych) и все никак не могла собрать все клочки в кучку. То одно, то другое отвлекало. Так что если вдруг какие-то непонятки будут когда начнешь разбираться, то пиши.

Ответить С цитатой В цитатник Обратиться по имени

Среда, 21 Мая 2014 г. 15:04ссылка

wellax

Марина, в моём восприятии это подвиг творческий!
Может, когда и попытаюсь, но я 100% не одолею столько "телодвижений", ещё и жара стоит одуряющая...но, если - вдруг, спрошу непременно, спасибо!

Ответить С цитатой В цитатник Обратиться по имени