-Рубрики

 -Поиск по дневнику

Поиск сообщений в Jorjorych

 -Подписка по e-mail

 

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 11.07.2013
Записей: 1657
Комментариев: 21885
Написано: 29186


Переход по кадрам, урок второй, AS2.Контент.

Пятница, 05 Декабря 2014 г. 17:41 + в цитатник

В прошлом уроке создали шаблон перехода по кадрам флешки с помощью кнопок.

Мы имеем эскизы кнопок и скрипты на них с инструкциями действия.

Но все кадры, на которые переводят действие кнопки, пусты.

Вот и будем заполнять кадры материалом (содержанием, контентом).


Это может быть просто картинки из инета или собственные, созданные в графическом редакторе (фотошоп ...),

анимированные (гифки) или видео. Статические изображения загружаются прямо в программу

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

 который также появится в библиотеке. А из библиотеки материал (символы) переносятся на рабочий кадр

путём перетаскивания левой кнопкой (нажать и удерживая перенести) на нужный слой и кадр!

 Приступаем (материалы для работы есть во влжении, но Вы можете использовать свои).:

Запускаем программу АФ, Открываем шаблон "Переход по кадрам"

1

VFL.RU - ваш фотохостинг

Для работы создаём рабочую папку (я на рабочем столе), в ней загружаем материал.  Я взял три файла: анимация снегопада, Санта в ПНГ 

и рисунок фотошопный "Кнопка":

2

VFL.RU - ваш фотохостинг

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

3

VFL.RU - ваш фотохостинг

В панели "Свойства" задаём размеры нашей будущей работы (в примере =700/438) по размерам анимашки. 

Создаём новый слой, переносим под слой с кнопками, Имя - "Контент".

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

4

VFL.RU - ваш фотохостинг

Теперь приступаем к импорту материала. Начнем с анимашки, для неё создаём контейнер:

Вставка > Создать символ > Фрагмент ролика.

5

VFL.RU - ваш фотохостинг

6

VFL.RU - ваш фотохостинг

Открывается редактор ролика. Импортируем нашу заготовленную анимашку из папки. Для этого нажимайте одновременно на клавиатуре кнопки =Ctrl и R= (или через меню =Файл>Импорт>Импортировать в рабочую область):

7

VFL.RU - ваш фотохостинг

Видеоролик из анимашки создан, он в библиотеке под именем "Символ4", одновременно в библиотеке появились и все кадры нашей анимации.

Возвращаемся на монтажный кадр:

8

VFL.RU - ваш фотохостинг

Стали на первый кадр слоя "Контент", открыли библиотеку и, нажав левую кнопку мыши и удерживая, перетаскиваем одно изображение, например, "Растровое изображение1", на кадр:

9

VFL.RU - ваш фотохостинг

Выравниваем по центру монтажного кадра. Для этого заходим в панельку "Выровнять" и нажимаем соответствующие значки:

(Если панелька "Выровнять" отсутствует, откройте из вернего меню "Окно",)

10

VFL.RU - ваш фотохостинг

Теперь на первом кадре есть изображение. 

Переходим на второй кадр слоя "Контент". На него из библиотеки перетаскиваем уже известным способом видеоролик "Символ4". 

Также выравниваем по центру (смотри фото 10)

11

VFL.RU - ваш фотохостинг

Есть два кадра.

 Стали на третий, импортируем на него из библиотеки тот же видеоролик "Символ4", выравнивать по центру.

Затем из папки проекта импортируем Санту (изображение в PNG, то есть, без фона) сюда же: Ctrl+R: (смотри объяснения к фото 7). Размещаем как и куда планировали.

12

VFL.RU - ваш фотохостинг

Тестируйте работу: Ctrl+Enter.

Всё работает. Только кнопки неприглядны и расположены неудачно.

Давайте ещё чуть поработаем с кнопками: Ставьте замочек на слой "Контент", переходите на слой "Кнопки", первый кадр

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

13

 VFL.RU - ваш фотохостинг

Заменим изображения кнопок на заготовленный рисунок из папки проекта.

Для этого нужно войти в режим редактирования символа кнопки: кликать ПРАВОЙ кнопкой мыши по кнопке, в выпавшем меню выбрать "Правка".

14

VFL.RU - ваш фотохостинг

Это режим редактирования кнопки.

Удаляем синий квадратик: выделить и нажать на клавиатуре "Delete".

Импортируем на кадр из папки проекта изображение кнопки: Ctrl+R (см. фото7).

15

VFL.RU - ваш фотохостинг

Переходим на второй кадр, входим в редактирование кнопки "Символ2" =красный кружочек= (см. фото14),

удаляем кружочек, а из библиотеки переносим на кадр изображение кнопки. Выравнивать по центру (см. фото 10).

Переходим на третий кадр, производим действия как для предыдущей кнопки.

Тестировать: Ctrl+Enter

Сохраните проект в FLA файл. С ним продолжим работу в следующих уроках.

Файл > Сохранить как , направьте в папку проекта, дайте название.

VFL.RU - ваш фотохостинг

На данном этапе Вы можете сохранить флешку: Файл > Экспорт > Экспортировать ролик. Дайте название, укажите куда

VFL.RU - ваш фотохостинг

Пока всё. Продолжение следует.

Во вложении  есть исходники и FLA.

Вложение: 4148196_vlozhenie.rar

Серия сообщений "МОИ УРОКИ. ":
Часть 1 - Создание флеш-альбома "Листалка" в программе FLIP Flash Album Deluxe 2
Часть 2 - Наложение футажей в фотошопе на временной шкале.2-й урок
...
Часть 25 - Анимация во флеш Некоторые приёмы
Часть 26 - "Переход по кадрам", создание шаблона, Adobe Flash, AS2.Урок первый.
Часть 27 - Переход по кадрам, урок второй, AS2.Контент.
Часть 28 - Шаблон "Переход по кадрам" , AS3.
Часть 29 - Переход по кадрам, работа по шаблону, AS2. Третий урок
...
Часть 46 - Пламя свечи на AS3
Часть 47 - Выставляем на ЛиРу картинки с Гугл фото!
Часть 48 - Сглаживание анимации в фотошопе на видео шкале.

Рубрики:  Уроки/Уроки флеш
Уроки/Adobe Flash


Процитировано 34 раз
Понравилось: 19 пользователям

wellax   обратиться по имени Пятница, 05 Декабря 2014 г. 18:11 (ссылка)
Цитирую с благодарностью!
Ответить С цитатой В цитатник
ВАТ   обратиться по имени Пятница, 05 Декабря 2014 г. 18:12 (ссылка)
Георгий, спасибо за продолжение урока! Первый сделала, теперь возьмусь за этот. Цитирую с благодарностью! А это резльтат первой части урока http://www.yapfiles.ru/files/1012996/_novyi_god_bez_snega_s_maskoi.swf
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 19:38ссылка
Преотлично! Уроки упрощаю для совсем новичков, а Вы уже профи!
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 20:37ссылка
Вот и хорошо, что "Уроки упрощаю для совсем новичков". Это как раз для меня. Кнопки у меня как камень преткновения. Что-то хотела недавно сделать, тыкалась, тыкалась, но ничего не получилось. Поэтому ещё раз спасибо! Буду разбираться. Потом отчитаюсь.
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 21:28ссылка
Хорошо. Сейчас опубликую создание аналогичного шаблона в AS3.
Татьяна_Волкова_Литвинова   обратиться по имени Пятница, 05 Декабря 2014 г. 18:41 (ссылка)
Георгий, спасибо! Домашнее задание есть. Урок мельком пробежала. Цитирую и завтра основательно посмотрю. Спасибо!
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 19:40ссылка
Таня, ты уже выполнила эту часть, я смотрел твою работу! Если найдёшь в уроке что-то полезное - буду рад!
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 19:46ссылка
Георгий, а ты не путаешь? Возможно это Вера сделала? Я ее работу видела здесь в комментариях.
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 20:01ссылка
Прости, всё равно справишься!
LiSu   обратиться по имени Пятница, 05 Декабря 2014 г. 18:43 (ссылка)
Спасибо, займусь, когда придет вдохновение.
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 19:41ссылка
Пусть вдохновение постоянно Вам надоедает!
jzayka   обратиться по имени Пятница, 05 Декабря 2014 г. 18:51 (ссылка)
Спасибо за урок..
В копилку пока))
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 19:50ссылка
Привет, Лена! Не думаю, что тут много нового для Вас! Просто я систематизирую для себя, делюсь с желающими своими соображениями. Флеш сложен в плане написания скриптов (для меня), то есть, изучение самого языка AS. Остальное - дело техники!
Irina-snez   обратиться по имени Пятница, 05 Декабря 2014 г. 19:20 (ссылка)
Спасибо, Георгий!
Уроки по переходу по кадрам после прочтения кажутся понятными. Постараюсь проделать, не откладывая.
Но в As3 такое, кажется, принципиально невозможно, вроде бы, нет опции назначения скрипта на отдельный символ. Жалко, что пока не вижу способа кнопками регулировать "движение за курсором", у меня по этой теме скрипты в As3...
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 19:33ссылка
Переход по кадрам есть и в AS3, урок сделаю.
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 19:55ссылка
Заранее благодарю!
Аноним   обратиться по имени Пятница, 05 Декабря 2014 г. 19:36 (ссылка)
Jorjorych, Я только начинаю разбираться в этой программе.
Какое видео или урок порекомендуете вы мне для начала?
Можете поссоветовать?
Ответить С цитатой В цитатник    |    Не показывать ветку
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 20:05ссылка
Если есть прога попробуйте, для начала, тренироваться по этим урокам: http://uroki-flash-as3.ru/uroki-flash-cs6.html
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 22:10ссылка
а вот за это-отдельное спасибо
Kantemirova_Irina   обратиться по имени Пятница, 05 Декабря 2014 г. 20:51 (ссылка)
Спасибо за урок!
Ответить С цитатой В цитатник
здесь_нет_никого   обратиться по имени Пятница, 05 Декабря 2014 г. 21:09 (ссылка)
Великолепно!
В as3 это делается очень просто фрагментами кода.
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 21:36ссылка
Да! Я чуточку упростил. Сегодня опубликую и для AS3.

0_fe7c5_795f6567_S (110x150, 148Kb)
Lyusya-Spring   обратиться по имени Пятница, 05 Декабря 2014 г. 22:04 (ссылка)
рада новому уроку!
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 23:44ссылка
Рад, если пригодится!
koreckolga   обратиться по имени Пятница, 05 Декабря 2014 г. 22:38 (ссылка)
Добрый вечер!
Сколько благодарностей!!!
И я благодарю тебя, Георгий, за твои труды и интересные уроки!!!
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 23:47ссылка
Добрый вечер, Ольга! Спасибо за визит! Не приступаешь ещё к флешпроизводству?
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 23:51ссылка
Несколько раз открывала программу, но что-то никак не пойму, видно надо курсы просмотреть для начинающих, ведь я ещё в этом программе не работала. Гуляла по рубрике "Уроки флеш" нашла кое-что интересного...)) Самое лёгкое уже попробовала сделаь. Спасибо, Георгий!
Tamreko   обратиться по имени Пятница, 05 Декабря 2014 г. 22:57 (ссылка)
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 23:48ссылка
Благодарю за внимание!
Лариса_Гурьянова   обратиться по имени Пятница, 05 Декабря 2014 г. 23:00 (ссылка)
Спасибо, Георгий, за новый урок...))
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 23:55ссылка
Добрый вечер, Лариса! Спасибо за визит! Вот, потею над "скриптологией", вроде как начинаю понимать откуда и куда! Решил поделиться, заодно лучше сам потренируюсь!
Перейти к дневнику

Пятница, 05 Декабря 2014 г. 23:57ссылка
Если все время этим заниматься, то, конечно, понимание придет...
Я вспоминаю, когда коды HTML были для меня китайскими иероглифами, а теперь все ясно и понятно. Удачи, Георгий. И нам помощь...))
Перейти к дневнику

Суббота, 06 Декабря 2014 г. 00:12ссылка
Спасибо, всех благ!
Оленька_555   обратиться по имени Суббота, 06 Декабря 2014 г. 00:08 (ссылка)
Спасибо! Очень интересный урок!
Ответить С цитатой В цитатник
Перейти к дневнику

Суббота, 06 Декабря 2014 г. 00:10ссылка
Спасибо! В ожидании Ваших прекрасных работ!
Перейти к дневнику

Суббота, 06 Декабря 2014 г. 00:12ссылка
ОООО! Для меня это пока сложно! Я только начала изучать эту программу! Щас попробовала сделать по вашему уроку а картинка (контект) моргает почему то! Теперь завтра буду разбираться!
Перейти к дневнику

Суббота, 06 Декабря 2014 г. 00:15ссылка
Позабыли про =stop();= !?
Перейти к дневнику

Суббота, 06 Декабря 2014 г. 00:21ссылка
Наверное! Я в этом не понимаю!
Перейти к дневнику

Суббота, 06 Декабря 2014 г. 00:23ссылка
В скриптах важно все символы правильно и к месту прописать!
Любовь_Терехова   обратиться по имени Суббота, 06 Декабря 2014 г. 01:38 (ссылка)
Георгий большое спасибо за новый урок! Буду стараться!
Ответить С цитатой В цитатник
Перейти к дневнику

Суббота, 06 Декабря 2014 г. 11:37ссылка
Здравствуйте, Люба! Верю, но проверю! Жду Ваших работ! Успеха!
эжейни   обратиться по имени Воскресенье, 07 Декабря 2014 г. 13:26 (ссылка)
Jorjorych, Большое спасибо за урок. Цитирую.
Ответить С цитатой В цитатник
Перейти к дневнику

Воскресенье, 07 Декабря 2014 г. 21:12ссылка
Спасибо, Евгения! Успехов!
Перейти к дневнику

Воскресенье, 07 Декабря 2014 г. 21:59ссылка
И Вам УДАЧИ !!!
Cadmii   обратиться по имени Воскресенье, 07 Декабря 2014 г. 14:31 (ссылка)
Спасибо за огромный труд и душевные вложения при создании урока. Урок отличный. Написан понятным языком. Слов не могу подобрать , чтобы выразить свою благодарность.
Кстати. Шаблон в Сотнике я так и не нашла как сохранить. Только как проект Сотника.
Ответить С цитатой В цитатник
Перейти к дневнику

Воскресенье, 07 Декабря 2014 г. 21:12ссылка
Добрый вечер, Таня! Спасибо тебе за добрые слова!

Сотинк этого не поддерживает.
Я (давненько) написал отзыв на сайте Sothink и, кроме благодарности, добавил, что цены программе не было бы, если бы ввести возможность использования AS3. Поживём - увидим!
Перейти к дневнику

Воскресенье, 07 Декабря 2014 г. 23:43ссылка
Мда.. Но вряд ли они это сделают.
Sobirayu_vinograd   обратиться по имени Воскресенье, 07 Декабря 2014 г. 23:45 (ссылка)
Благодарю, добрый человек.
Прогу Flash пока не смогла установить...
Разберусь с установкой, тогда и уроки делать...
Удачи!
Ответить С цитатой В цитатник
Перейти к дневнику

Понедельник, 08 Декабря 2014 г. 01:07ссылка
Успехов Вам!
MissKcu   обратиться по имени Пятница, 12 Декабря 2014 г. 21:21 (ссылка)
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 12 Декабря 2014 г. 22:33ссылка
Пусть мечты сбываются!
Комментировать К дневнику Страницы: [1] [Новые]
 

Добавить комментарий:
Текст комментария: смайлики

Проверка орфографии: (найти ошибки)

Прикрепить картинку:

 Переводить URL в ссылку
 Подписаться на комментарии
 Подписать картинку