• Авторизация
Дневник novprospekt Лента друзей - Дневник - Полная версия


Делаем заготовку для флеш-календарика в Adobe Flash CS6.. 17-03-2014 12:24 к комментариям - к полной версии - понравилось!

Это цитата сообщения jzayka Оригинальное сообщение




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



В комментариях и на скринах я покажу и расскажу принцип создания таких заготовок.Потом вы сможете их использовать на свое усмотрение,применяя фантазию.Добавлять фоны,украшательства и т.д.
Для урока использована программа Adobe Flash CS6 с применением AS2.
Рассчитан урок на тех,кто знаком с интерфейсом и основными инструментами программы.
Такие заготовки можно сделать в программе SWFQuicker ,принцип тот же.Я специально использовала код AS2,чтобы можно было его применить и в этой программе.
Итак,начинаем.


1.Первое,что мы делаем,открываем программу.
2.Создаем новый документ AS2.
[561x431]
3.В Панели Свойства указываем размеры рабочей сцены,цвет.
Цвет может быть любым.При просмотре флеш ролика он не будет виден.
[561x431]
4.На временной шкале создадим 3 слоя.
[561x431]
5.Переименуем их для удобства работы.
[561x431]
Фон-на этом слое будет фон календарика(если хотите на прозрачном фоне ,оставьте его пустым)
Календарь-здесь будет наш календарик.
Скрипт-это код для календарика ,который мы введем в соответствующее поле.
6.Сохраним документ под названием Календарь AS2
[561x431]
7.Создадим символ для календарика.
7.1 Открываем на Панели меню-Вставка-Создать символ.
Заполним соответствующие поля:
Имя -календарик
Тип символа выбираем-Фрагмент ролика
[561x431]
Открылось окно редактирования символа Календарик
[561x431]
8.Создадим в этом окне для календаря на шкале времени 3 слоя.
Число,Месяц,День.
[561x431]
9.Делаем активным слой Число(нажать на него инструментом Стрелка)
Активируем инструмент Текст(Т).Создаем текстовое поле.
[561x431]
11.В панели Свойства
в окошко"Назначить имя экземпляру"вводим yearBox
[314x101]
Внимание! Обязательно внедрить шрифт!
Если шрифт не внедрить,ничего отбражаться в календаре не будет!
Жмем на окошко Внедрить,в открывшемся окне выбираем шрифт.
[556x428]
Дальше см. по скрину.
[431x561]
12.Возвращаемся на временную шкалу символа календарик.
Делаем активным слой Месяц.
На слоях ДЕНЬ и ЧИСЛО поставьте пока замочки(нажать на слое напротив значка замочка),чтобы случайно не перескочить на ненужный слой.
102 (195x99, 7Kb)
13.Активируем инструмент Текст(Т)
Создаем текстовое поле.
Для этого текстового поля размер шрифта установите меньше.
Я поставила 20 пт.
[561x431]
В Панели Свойства назначаем имя экземпляру monthBox.
[показать]
14.Возвращаемся к тектовому полю.
Активируем инструмент Текст,кликаем внутри окошка.
В текстовое окошко введите самое длинное название месяца(сентябрь)
Для того,чтобы удостовериться,что оно умещается в окошке .
Потом мы очистим текстовое поле.
[236x91]
Cнимаем замочек со слоя День(жмем по замочку-он исчезенет),ставим на слое Месяц.
103 (196x86, 6Kb)
15.Активируем инструмент Текст(T) для создания еще одного текстового поля
Создаем текстовое поле(активный слой на временной шкале День)
В Панели Свойства назначаем имя экземпляру dayBox
[314x100]
16.Переключаемся снова на инстумент Текcт(T).
В текстовое окошко(клик внутри окошка) введите самое длинное название дня недели(понедельник или воскресенье)
Так же как и во втором текстовом поле ,мы его потом удалим.
[285x77]
17.Снимаем замочки со слоев(жмем на них-они исчезнут)
Так выглядит календарик в поле редактирования.
[561x431]

18.Переходим на основную сцену.
[306x96]
Активный слой на временной шкале Календарь(нажать на него).
32 (178x74, 4Kb)
19.Идем в Библиотеку.
Там находим символ календарик.
[561x431]
20.Перетаскиваем левой кнопкой мыши его на сцену в рабочее поле
[562x431]
21.Выделяем инструментом стрелка(убедитесь что активный слой календарь)
[562x431]
22.Выравниваем инструментом Выравнивание.
[562x431]
23.Идем в Панель Свойства.Экземляр при этом выделен(синяя рамочка вокруг как в ш.21)
Назначаем имя экземпляру,который мы переместили из библиотеки
content_mc
[317x136]
24.Переходим на верхний слой Скрипт
Два остальных закройте замочками.
25.Открываем Панель Действия (Окно-Действия или F9)
Копирум код(очень внимательно и аккуратно) и вставляем его в окно Действия.
Можно скопровать код так же во вложении к посту.
----------------------
код

function d3ClockUpdate()
{
var _loc1 = new Date();
tempHour = _loc1.getHours();
if (String(tempHour).length < 2)
{
content_mc.time1.text = "0" + tempHour;
}
else
{
content_mc.time1.text = tempHour;
} // end else if
tempMinutes = _loc1.getMinutes();
if (String(tempMinutes).length < 2)
{
content_mc.time2.text = "0" + _loc1.getMinutes();
}
else
{
content_mc.time2.text = _loc1.getMinutes();
} // end else if
tempSeconds = _loc1.getSeconds();
if (String(tempSeconds).length < 2)
{
content_mc.time3.text = "0" + _loc1.getSeconds();
}
else
{
content_mc.time3.text = _loc1.getSeconds();
} // end else if
content_mc.time3.text = _loc1.getSeconds();
content_mc.dayBox.text = weekDayLabels[_loc1.getDay()];
content_mc.yearBox.text = _loc1.getDate();
content_mc.monthBox.text = monthLabels[_loc1.getMonth()];
content_mc.passed1.text = int((getTimer() - startTime) / 1000 / 60 / 60 / 24) % 24;
content_mc.passed2.text = int((getTimer() - startTime) / 1000 / 60 / 60) % 60;
content_mc.passed3.text = int((getTimer() - startTime) / 1000 / 60) % 60;
content_mc.passed4.text = int((getTimer() - startTime) / 1000) % 60;
content_mc.line1._rotation = int((getTimer() - startTime) / 1000 / 60 / 60 / 24) % 24 * 6 + 200;
content_mc.line2._rotation = int((getTimer() - startTime) / 1000 / 60 / 60) % 60 * 6 + 260;
content_mc.line3._rotation = int((getTimer() - startTime) / 1000 / 60) % 60 * 6 + 160;
content_mc.line4._rotation = int((getTimer() - startTime) / 1000) % 60 * 6;
} // End of the function
var monthLabels = new Array("Января", "Февраля", "Марта", "Апреля", "Мая", "Июня", "Июля", "Августа", "Сентября", "Октября", "Ноября", "Декабря");
var weekDayLabels = new Array("Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг", "Пятница", "Суббота");
var d3Clock = setInterval(d3ClockUpdate, 10);
startTime = getTimer();
-----------------------------------
[562x431]

Теперь давайте удалим слова из текстовых окон.Они нам не нужны.
Идем в поле редактирования символа календарик(жмем на треугольничек у значка)
[230x77]
Активируем инструмент Текст,встаем в окошко с текстом,выделяем мышкой слово -жмем delete
[561x431]
То же самое проделываем на слое Месяц.

Если хотите подписать,создайте еще один слой,активируйте инструмент Текст,подпишите.
Проверяем что получилось.
Управление-Тестировать ролик-тестировать ролик
или
Жмем CTRL+ENTER
***


***
Все. Календарик готов.Экспортируем его.
[показать]
Моей целью было показать и рассказать принцип создания.
Меняя шрифт и цвет,применяя фон,вы сожете сделать свои неповторимые календарики.
Если возникнут вопросы,спрашивайте.Будем разбираться вместе.
Удачи!


вверх^ к полной версии понравилось! в evernote
Комментарии (4):
Kantemirova_Irina 17-03-2014-13:55 удалить
Спасибо,пригодится.
Обратиться - Ответить - К полной версии
ВАТ 18-03-2014-01:05 удалить
Спасибо, Мариночка! Завтра, после работы займусь этим уроком.
Обратиться - Ответить - К полной версии
Irina-snez 18-03-2014-08:34 удалить
Спасибо Мариночка и jzayka! Код отличается от того, которым пользовалась... Приберу в коллекцию...
Обратиться - Ответить - К полной версии
Татьяна_НК 02-05-2014-18:57 удалить
Спасибо, Мариночка! Очень интересный дневник! Взяла себе этот урок!
Обратиться - Ответить - К полной версии


Комментарии (4): вверх^

Вы сейчас не можете прокомментировать это сообщение.

Дневник Делаем заготовку для флеш-календарика в Adobe Flash CS6.. | novprospekt - Дневник novprospekt | Лента друзей novprospekt / Полная версия Добавить в друзья Страницы: раньше»