• Авторизация


Делаем флеш календарик в Adobe Flash (AS3). 22-12-2014 08:00 к комментариям - к полной версии - понравилось!

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





Сегодня мы будем делать флеш календарик программно, используя класс Calendar.

Ccылкой на урок поделилась Татьяна_Волкова_Литвинова

Большая благодарность автору Урока за дополнительные пояснения))


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




В ходе урока вы узнаете как создать ,видоизменить и настроить под свой вкус и потребности такой календарик.


1.Создадим на компьютере папку для проекта.
Назовем "Проект календарик AS3 ".

1.1.Скопируем в нее документ класса Calendar.as из вложения в посту.


Вложение: 4151280_calendar.rar



2.Отроем программу и создадим документ Аs3.(Файл-Создать-ActionScript 3.0)

Размеры рабочей области могут быть любыми.В зависимости от вашего проекта.
У меня 350/400

3.Сохраним в созданную папку"Проект календарик AS3" (!Обязательное условие!)
под любым названием,например"календарик AS3".

В папке проекта у нас два файла

[показать]
4.Создадим 2-ой слой для кода as
На 1-ом слое у нас будет фон.
[показать]

На слое фон, инструментом прямоуголник я нарисовала фигуру по размеру рабочей области 350/400 с градиентной заливкой.
У вас это может быть картинка,ваша работа,все что хотите...))
[показать]
5.В Свойствах укажем размеры рабочей области и выровняем по центру
инструментом Выравнивание.
[показать] [показать]


6.Переходим на слой as откроем Панель Действия(F9)
Cкопируем код
code:

//импортируем класс
import Calendar;

//создаём экземпляр класса Calendar
var calendar:Calendar = new Calendar();
//добавляем на сцену
addChild(calendar);

//позиционируем календарь на сцене
calendar.x = 100;
calendar.y = 120;

//создаём объект Date
var d:Date = new Date();

//устанавливаем текущий месяц и год для нашего календаря

calendar.month = d.getMonth();
calendar.year = d.getFullYear();

//отрисовка календаря

calendar.Render();



Вот и все,календарик готов.
Покликайте по стрелочкам,которыми можно перемещаться по годам.
Текущая дата выделена.

[показать]


Посмотрим как и что можно изменить в календарике.

Например,мы хотим расположить наш календарик выше,ниже..слева,справа..

Указывать место положения(позиционировать) будем изменяя значения х и y.
Значения x и y будут разными(в зависимости от размеров фона,на который вы хотите расположить и места, где вы хотите расположить..
Например:
при увеличении значения x,календарик будет сдвигаться вправо(и наоборот);
при уменьшении значения y,календарик сдвинется вверх(и наоборот)
[показать]

Давайте разместим календарик в левом верхнем углу

Для этого скопируем код ,именив значения х=50;y=50
code:

import Calendar;

var calendar:Calendar = new Calendar();
addChild(calendar);

calendar.x = 50;

calendar.y = 50;

var d:Date = new Date();

calendar.month = d.getMonth();

calendar.year = d.getFullYear();

calendar.Render();


результат


[показать]


В разделе Style Configurations внутри класса Calendar.as
можно менять шрифт, его размер и цвет.
[показать]
Чтобы поменять цвет квадратиков,надо открыть внутри класса Calendar.as раздел Buttons
[показать]


Если хотите оставить только стрелочки,меняем прозрачности заливки на "0"
и будет вот так
[показать]


Изменяя значения выше указанных параметров и,применив фантазию, мы сможем видоизменять наши календарики .


А теперь увеличим масштаб календарика
В документе класса ,в соответствующих разделах, внесены изменения.
Применим другой шрифт,уменьшим размер ,поменяем цвета.
[показать]

Уменьшим прозрачность окошек(0.3)
[показать]
Копируем код.Открываем Панель Действия(F9)
code:

import Calendar;

var calendar:Calendar = new Calendar();
addChild(calendar);
//позиционируем
calendar.x = 35;
calendar.y = 70;
/*
скалируем
*/
calendar.scaleX = 2;
calendar.scaleY = 2;

var d:Date = new Date();

calendar.month = d.getMonth();
calendar.year = d.getFullYear();

calendar.Render();



[показать]


На этом все! Успехов в творчестве!





Серия сообщений "Мои уроки":

Часть 1 - Цветочный шлейф за курсором
Часть 2 - Слайд-шоу в Aleo Flash Intro Banner Maker встроенным эффектом..)
...
Часть 19 - Реалистичный эффект падающего снега в Adobe Flash(AS3).
Часть 20 - Урок.Загружаем музыку в Adobe Flash c помощью библиотеки классов .
Часть 21 - Делаем флеш календарик в Adobe Flash (AS3).


вверх^ к полной версии понравилось! в evernote
Комментарии (3):
Marina-Rozina 23-12-2014-18:49 удалить
Просто чудо, Мариночка! Спасибо за урок!
шалмани 22-02-2015-00:04 удалить
Замечательный календарик получился.
Ответ на комментарий шалмани # Спасибо в первую очередь за труд и за уроки.Всё очень понятно и подробно.


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

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

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