1 Уроки Flash Создаем часы Пт Окт 01, 2010 9:51 am
Admin
Admin
Хотите украсить свою страничку или flash-ролик симпатичными часиками? Если ДА, то этот урок будет полезен для вас, а если НЕТ - все равно в будущем пригодиться. Итак, начнем.
Сейчас будем учиться делать простейшие часы, которые будут отображать часы, минуты и секунды.
Создайте на главной сцене динамическое текстовое поле и назовите его "tpole".
Откройте Text Options (Windows -> Panels -> Text Optoins)
Выберите Dynamic Text и дайте ему имя в строке Variable - "tpole"
[Вы должны быть зарегистрированы и подключены, чтобы видеть это изображение]
Затем добавьте первому кадру такой скрипт:
time = new Date();
s = time.getSeconds();
m = time.getMinutes();
h = time.getHours();
if (s<10) {
s = "0"+s;
}
if (m<10) {
m = "0"+m;
}
if (h<10) {
h = "0"+h;
}
tpole = h+":"+m+":"+s;
В первой строчке мы создаем новый объект "time" с использованием конструктора new. После выполнения данной строки из нового объекта "time" можно вернуть значение года, месяца, даты, часов, минут, секунд и миллисекунд. В следующих строчках мы присваеваем переменым "s", "m" и "h" соответственно значение секунд, минут и часов с использованием метода "get" из недавно созданного нами оъекта "time". Далее с помощью оператора "if" мы задаем условие каждой переменной, что если её значение меньше 10, то перед ней должен ставиться нуль, иначе может получиться следующее: 15:5:9 или 9:5:46. А это не совсем красиво. Ну а в последней строчке мы выводим все полученные значения в динамическое текстовое поле "tpole", причем знак ":", чтобы разделять часы с минутами, а минуты с секундами, мы должны поставить в кавычках, как обычный текст.
Для обновления данных мы должны на 2-ом кадре нажать F5.
[Вы должны быть зарегистрированы и подключены, чтобы видеть это изображение]
Часы готовы. Видите, как легко! А сколько пользы они могут принести....
Циферблатные часы
А сейчас мы создадим часы, у которых будет часовая, минутная и секундная стрелочки, как это бывает у циферблатных часов.
Нарисуйте окружность, которая будет являться циферблатом ваших часов. Можно поставить деления, чтобы было точно понятно какое время.
[Вы должны быть зарегистрированы и подключены, чтобы видеть это изображение]
Затем создайте еще один слой. Нарисуйте в нем часовую, минутную и секундную стрелки. Конвертируйте каждую из них в мувиклип с помощью клавиши F8 (Insert -> Convert to Symbol) .
Теперь в панели "Instance" ([Ctrl+I] или Windows -> Panels -> Instance) часовую стрелку назовите "hour", минутную - "min", а секундную - "sec". Расположите каждую стрелку вертикально вверх, так чтобы её низ и её центр вращения находились в самом центре нарисованного циферблата.
[Вы должны быть зарегистрированы и подключены, чтобы видеть это изображение]
Первому кадру любого слоя добавьте этот скрипт:
time = new Date();
s = time.getSeconds();
m = time.getMinutes();
h = time.getHours();
setProperty ("min", _rotation, m*6+s*0.1);
setProperty ("sec", _rotation, s*6);
setProperty ("hour", _rotation, h*30+m*0.5);
Первые четыре строчки - (см. цифровые часы). Давайте разберемся с тремя последнеми.
Третья снизу строчка, поворачивает вашу минутную стрелочку с помощью функции "_rotation" на градусы, значение которых вычисляется выражением "m*6+s*0.1", где m - минуты, а s - секунды. Вторая снизу строчка поворачивает вашу секундную стрелку на градусы, значение которых вычисляется выражением "s*6", где s - секунды. Ну а последняя строчка поворачивает вашу часовую стрелку на значение выражения "h*30+m*0.5".
Для обновления данных нажмите в верхнем и нижнем слое клавишу F5.
В создании циферблатных часов тоже ничего сложного нет, как и в создании цифровых. Так что я думаю у вас все получилось. А если нет - пишите на форум. Поможем!
Вот что у меня получилось...]
Сейчас будем учиться делать простейшие часы, которые будут отображать часы, минуты и секунды.
Создайте на главной сцене динамическое текстовое поле и назовите его "tpole".
Откройте Text Options (Windows -> Panels -> Text Optoins)
Выберите Dynamic Text и дайте ему имя в строке Variable - "tpole"
[Вы должны быть зарегистрированы и подключены, чтобы видеть это изображение]
Затем добавьте первому кадру такой скрипт:
time = new Date();
s = time.getSeconds();
m = time.getMinutes();
h = time.getHours();
if (s<10) {
s = "0"+s;
}
if (m<10) {
m = "0"+m;
}
if (h<10) {
h = "0"+h;
}
tpole = h+":"+m+":"+s;
В первой строчке мы создаем новый объект "time" с использованием конструктора new. После выполнения данной строки из нового объекта "time" можно вернуть значение года, месяца, даты, часов, минут, секунд и миллисекунд. В следующих строчках мы присваеваем переменым "s", "m" и "h" соответственно значение секунд, минут и часов с использованием метода "get" из недавно созданного нами оъекта "time". Далее с помощью оператора "if" мы задаем условие каждой переменной, что если её значение меньше 10, то перед ней должен ставиться нуль, иначе может получиться следующее: 15:5:9 или 9:5:46. А это не совсем красиво. Ну а в последней строчке мы выводим все полученные значения в динамическое текстовое поле "tpole", причем знак ":", чтобы разделять часы с минутами, а минуты с секундами, мы должны поставить в кавычках, как обычный текст.
Для обновления данных мы должны на 2-ом кадре нажать F5.
[Вы должны быть зарегистрированы и подключены, чтобы видеть это изображение]
Часы готовы. Видите, как легко! А сколько пользы они могут принести....
Циферблатные часы
А сейчас мы создадим часы, у которых будет часовая, минутная и секундная стрелочки, как это бывает у циферблатных часов.
Нарисуйте окружность, которая будет являться циферблатом ваших часов. Можно поставить деления, чтобы было точно понятно какое время.
[Вы должны быть зарегистрированы и подключены, чтобы видеть это изображение]
Затем создайте еще один слой. Нарисуйте в нем часовую, минутную и секундную стрелки. Конвертируйте каждую из них в мувиклип с помощью клавиши F8 (Insert -> Convert to Symbol) .
Теперь в панели "Instance" ([Ctrl+I] или Windows -> Panels -> Instance) часовую стрелку назовите "hour", минутную - "min", а секундную - "sec". Расположите каждую стрелку вертикально вверх, так чтобы её низ и её центр вращения находились в самом центре нарисованного циферблата.
[Вы должны быть зарегистрированы и подключены, чтобы видеть это изображение]
Первому кадру любого слоя добавьте этот скрипт:
time = new Date();
s = time.getSeconds();
m = time.getMinutes();
h = time.getHours();
setProperty ("min", _rotation, m*6+s*0.1);
setProperty ("sec", _rotation, s*6);
setProperty ("hour", _rotation, h*30+m*0.5);
Первые четыре строчки - (см. цифровые часы). Давайте разберемся с тремя последнеми.
Третья снизу строчка, поворачивает вашу минутную стрелочку с помощью функции "_rotation" на градусы, значение которых вычисляется выражением "m*6+s*0.1", где m - минуты, а s - секунды. Вторая снизу строчка поворачивает вашу секундную стрелку на градусы, значение которых вычисляется выражением "s*6", где s - секунды. Ну а последняя строчка поворачивает вашу часовую стрелку на значение выражения "h*30+m*0.5".
Для обновления данных нажмите в верхнем и нижнем слое клавишу F5.
В создании циферблатных часов тоже ничего сложного нет, как и в создании цифровых. Так что я думаю у вас все получилось. А если нет - пишите на форум. Поможем!
Вот что у меня получилось...]