DataLife Engine > WEB > Программно-рисованные часы во Flash
Программно-рисованные часы во Flash8 января 2008. Разместил: John Frost |
|
Написал $teve;o)
Есть два способа создать аналоговые часы: программным методом и программно-рисованным. Сегодня я научу тебя создавать часы вторым способом. Возможно, кто-то скажет, что это не круто или слишком легко - и он будет прав. Но этот способ работает, он прост и следовательно будет полезен начинающим. Что нам понадобится: - Flash; - Редактор ActionScript2; - Руки; - Желание разобраться; - Мозк(опционально). Для начала создаем новый проект. Затем рисуем циферблат, жмем «F8»(или меню «Modify-Convert to Symbol…»), чтобы создать MovieClip для удобства позиционирования. MovieClip можно и не создавать, если у вас циферблат уже позиционирован. В настройках, при создании MovieClip я указал имя – ciferblat, позиционирование – по центру, соответственно точка отсчета координат у меня теперь в центре. Затем, выделив его, на вкладке свойств указываю instance name – ciferblat_mc, так как приставка _mc говорит нам, да и самой программе о том что это MovieClip. (смотри рисунок 1).
Рисунок 1. Циферблат от часов. Красным отмечено instance name. Теперь беремся за стрелки. Собственно процедура создания – почти такая же, как и циферблата, вот только точку позиционирования надо брать с левого края, т.к. точка отсчета координат должна быть с краю для того, чтобы стрелки часов поворацивались относительно своего края, а не центра. Название часовой стрелки – hour_arrow, instance name – hour_arrow_mc. Соответственно, минутной – minutes_arrow, а секундной – seconds_arrow.Position
Рисунок 2. Создание Муви клипа с часовой стрелкой. Задание позиционирования.Собственно, процесс рисования закончен. Начнем программировать. Создаем дополнительный слой, называем его Actions. Открываем панель Actions и пишем туда следующий код: //Задаем центр циферблата, а также начала стрелок ровно по центру
Вот и все… эти простенькие часы готовы. Надеюсь, все понятно, если нет – жду на форуме=)ciferblat_mc._x=_root._x/2; ciferblat_mc._y=_root._y/2; hours_arrow_mc._x=_root._x/2; hours_arrow_mc._y=_root._y/2; minutes_arrow_mc._x=_root._x/2; minutes_arrow_mc._y=_root._y/2; seconds_arrow_mc._x=_root._x/2; seconds_arrow_mc._y=_root._y/2; /*Теперь создаем функцию - обработчик, которая будет отвечать за получение времени и поворот стрелок*/ function time():Void{ var date:Date=new Date(); hours_arrow_mc._rotation=((date.getHours()-3)/12*360); // trace(ha_mc._rotation); minutes_arrow_mc._rotation=(date.getMinutes()-15)/60*360; seconds_arrow_mc._rotation=(date.getSeconds()-15)/60*360; }; //Задаем интервал для работы этой функции setInterval(this,"time",1000); /*Вызываем эту функцию, можно и без вызова... Просто так пройдет некоторый период времени прежде, чем она сработает*/ time(); |