Главная ReadMe F.A.Q. Регистрация Форум




А вы подписаны на рассылку?
Да
Нет, но подпишусь
Нет и не собираюсь
А что это такое?
Система Orphus
Популярные новости!
» flash юмор:Animator vs Animation
» flash игра: FastClick
» flash урок: Анимация формы
» flash урок: Анимация при помощи Bone Tool и Bind T ...
» flash игры: Little Wheel - вид изнутри.
Случайные новости!
» flash демо: 3D квартира, можно менять обои потолок ...
» flash игра: Steppenwolf. Эпизоды 1-4.
» flash урок: MP3-плеер c XML-плейлистом
» Скачать шаблон flash сайта (гламур, элегантность)
» flash журнал #4: Улучши свой flash фотоальбом - до ...
» Миссии и идейные составляющие проекта!
» работа: Моя версия)
Архив
Июль 2009 (8)
Июнь 2009 (30)
Май 2009 (18)
Апрель 2009 (15)
Март 2009 (24)
Февраль 2009 (23)


Внимание! У Вас появился шанс изучить все секреты Flash анимации! Перейти из разряда новичка в разряд опытного пользователя даже без посещения дорогих репетиторов и толстенных толмутов "библий пользователя".

Более 100 уроков записанных с экрана компьютера в превосходном качестве помогут пройти, Вам, терни Flash анимации кратчайшим путём!

Подробнее!..

www.webmoney.ru

flash урок: Кнопка, которая остается в нажатом состоянии.

22 апреля 2009

Описание flash урока:


alt

1. Создайте новый файл File > New, выберите Flash file (ActionScript 3.0) и кликните Ok. Сохраните файл как myButton.fla.


2. Вставьте новый слой (Insert>Timeline>Layer), назовите слои, начиная сверху: actions и buttons. В панели Property установите frame rate= 30.


3. Выделите Rectangle tool, установите цвет обводки - без обводки, цвет заливки (у меня черный) и в слое buttons нарисуйте прямоугольник. Установите размеры прямоугольика следующие: width = 170, height = 40. Выделите прямоугольник и нажмите F8, чтобы конвертировать его в муви клип. Установите его имя about_btn, точка регистрации в левом верхнем углу и кликните Ok. В панели Property установите ее инстанс имя about_btn.


4. Дважды кликните по мувику about_btn, чтобы открыть его. Вставтьте 3 новых слоя и назовите их сверху: actions, labels, text и bg. Выделите черный прямоугольник, нажмите F8, чтобы конвертировать его в мувик и установите его имя bg.


5. В слое bg выделите кадр 2 и нажмите F6, чтобы вставить новый ключевой кадр, повторите этот шаг для кадров 9, 10, 11 и 18. Выделите кадр 9; кликните по черному прямоугольнику и в панели Property установите его свойство альфа 50%. Сделайте то же самое для кадров 10 и 11.
Теперь по правой кнопке меню между кадрами 2 и 9 выберите Create Motion Tween. Сделайте то же самое для интервала 11-18. Ваш слой bg должен выглядеть так:


alt

6. Заблокируйте слой bg и выделите слой text. Из Toolbar возьмите Text tool, установите тип в static и на сцене кликните и напечатайте слово About. Выделите текстовое поле, нажмите F8, чтобы конвертировать его в мувик и установите его имя aboutTxt.
Положение мувика aboutTxt такое: x=5, а для y - разместите мувик в центре черного прямоугольника.


7. В слое text выделите кадр 2 и нажмите F6, чтобы вставить новый ключевой кадр, повторите этот шаг для кадров 9, 10, 11 и 18. Выделите кадр 9; кликните по мувику aboutTxt и в панели Property установите x=20. Сделайте то же самое для кадров 10 и 11.
Теперь по правой кнопке между кадрами 2 и 9 выберите Create Motion Tween. Сделайте то же самое для интервала 11-18.


8. В слое labels выделите кадр 2 и нажмите F6, чтобы вставить новый ключевой кадр, повторите этот шаг для кадров 10 и 11. Выделите кадр 2 и в панели Property установите название Frame - over, установите название для кадра 10 - down и для 11 кадра - out.


9. В слое actions выделите кадр 1, нажмите F9, чтобы открыть панель ActionScript и напишите stop();Выделите кадр 9, нажмите F6, чтобы вставить новый ключевой кадр, откройте панель ActionScript и напишите stop();.
Теперь наш about_btn создан полностью. Кнопка должна выглядеть внутри таким образом:


alt



Кликните по Scene 1, чтобы вернуться на основную сцену. Мы построим еще две кнопки, чтобы в финале мы имели хорошее меню с тремя кнопками. Вы можете сделать кнопок больше, если хотите.

10. Кликните по about_btn на сцене, удерживая клавишу Alt, вытащите новую копию кнопки. По правой кнопке мыши по новой кнопке выберите Duplicate Symbol, установите имя кнопки portofolio_btn. В панели Property установите ее инстанс имя portofolio_btn.


11. Дважды кликните по portofolio_btn, нам нужно изменить текст. В слое text выделите кадр 1, правой кнопкой мыши по мувику aboutTxt выберите Duplicate Symbol, установите имя portofolioTxt. Теперь, дважды кликните по мувику portofolioTxt, чтобы открыть его, и измените текст на Portofolio.


12. Вернитесь к portofolio_btn, кликнув по синей стрелке слева над Timeline. В слое text выделите кадр 2, правой кнопкой мыши по мувику aboutTxt выберите Swap Symbol, выберите portofolioTxt и кликните Ok. Повторите этот процесс для кадров 9, 10, 11 и 18.
Наша вторая кнопка готова. Сейчас у нас две кнопки: About и Portofolio. Третья кнопка для вас, следуйте шагам от 10 до 12 чтобы сделать кнопку Contact.


13. Вернитесь на основную сцену, теперь вы должны иметь три кнопки. Выделите кадр 1 из слоя actions и нажмите F9, чтобы открыть панель ActionScript, скопируйте и вставьте код, приведенный ниже.


stage.frameRate = 30;
//---- добавляем кнопки к массиву --------
var buttonsArray:Array = [about_btn,portofolio_btn,contact_btn];
//----цикл в массиве buttonsArray-----
//----установим некоторые свойства и добавим события кнопкам----
function setButtons():void {
for (var i:int=0; i<buttonsArray.length; i++) {
 buttonsArray[i].id = i;
 buttonsArray[i].buttonMode = true;
 buttonsArray[i].mouseChildren = false;
 buttonsArray[i].mouseEnabled = true;
 buttonsArray[i].addEventListener(MouseEvent.ROLL_OVER,playOver);
 buttonsArray[i].addEventListener(MouseEvent.ROLL_OUT,playOut);
 buttonsArray[i].addEventListener(MouseEvent.CLICK,doClick);
}
}
//----выполняется, когда мышь наводится над кнопкой----
function playOver(event:MouseEvent):void {
event.currentTarget.gotoAndPlay("over");
}
//----выполняется, когда мышь уходит с кнопки----
function playOut(event:MouseEvent):void {
event.currentTarget.gotoAndPlay("out");
}
//----выполняется, когда мышь кликает кнопку-----
function doClick(event:MouseEvent):void{
 //----установим переменную currentBtn равную-----
//----идентификатору кнопки (id) , которая была кликнута-----
 var currentBtn:int = event.currentTarget.id;
 //----вызываем функцию setSelectedBtn
 setSelectedBtn(currentBtn);
}
/*проверим, какая кнопка была кликнута,
если id , переданная в функцию setSelectedBtn,
идентична id кликнутой кнопки,
мы полагаем, что кнопки находятся в положении нажатой down (выделенная)
и удаляем все события, добавленные к ней*/
 
function setSelectedBtn(id:int):void{
for (var i:int=0; i< buttonsArray.length; i++) {
 if (id == i) {
 buttonsArray[i].gotoAndStop("down");
 buttonsArray[i].buttonMode = false;
 buttonsArray[i].mouseEnabled = false;
 buttonsArray[i].removeEventListener(MouseEvent.ROLL_OVER,playOver);
 buttonsArray[i].removeEventListener(MouseEvent.ROLL_OUT,playOut);
 buttonsArray[i].removeEventListener(MouseEvent.CLICK,doClick);
 } else {
 if(buttonsArray[i].currentLabel =="down"){
 buttonsArray[i].gotoAndPlay("out");
 }
 buttonsArray[i].buttonMode = true;
 buttonsArray[i].mouseEnabled = true;
 buttonsArray[i].addEventListener(MouseEvent.ROLL_OVER,playOver);
 buttonsArray[i].addEventListener(MouseEvent.ROLL_OUT,playOut);
 buttonsArray[i].addEventListener(MouseEvent.CLICK,doClick);
 }
}
}
setButtons();

Это все с actionscript.


Источник: http://demiart.ru/forum/index.php?showtopic=86522

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

Другие новости по теме:

  • flash урок: Портфолио AS3
  • flash урок: Анимированые кнопки без использования скрипта
  • flash урок: Эффект с помощью маски
  • flash урок: Создание презентации
  • flash урок: Random Boxes Text Effect with Actionscript 3



  •  (голосов: 3)
    Producer | Просмотров:1120 | Напечатать
    #1 написал: Aloran (24 апреля 2009 01:08)


    Группа: Журналисты
    Регистрация: 6.03.2009
    Комментариев: 78
    Публикаций: 10
    Россия, Ульяновск
    Урок полезный.
    Но это не ты являешься автором его, так что сделай ссылку внизу откуда взял и кто является автором.


    --------------------
    Учитель достается тому, кто его достает!
    ICQ: --
    #2 написал: Fly (24 апреля 2009 01:19)


    Группа: Администраторы
    Регистрация: 21.07.2008
    Комментариев: 194
    Публикаций: 41
    Республика Беларусь, Минск
    Цитата: Aloran
    Но это не ты являешься автором его

    не факт, по крайней мере я не нашёл откуда он был скопирован :)


    --------------------
    1) Админ всегда прав
    2) Если админ не прав, смотри пункт 1

    Мы в контакте - http://vkontakte.ru/club9573247
    ICQ: 207886769
    #3 написал: nadya.fd (6 мая 2009 02:33)


    Группа: Посетители
    Регистрация: 8.03.2009
    Комментариев: 13
    Публикаций: 0
    Канада, Торонто
    Вы чего, народ!
    Там же в конце урока черным по белому ссылочка на источник дана:

    Источник: ...
    Ну.. или точнее на перевод, т.к. у автора перевода в свою очередь дана ссылка на источник.
    ICQ: --
    #4 написал: dr.S (6 мая 2009 12:09)


    Группа: Посетители
    Регистрация: 27.03.2009
    Комментариев: 10
    Публикаций: 0
    ,
    вот-вот, хорошо, что ссылочка появилась, иначе некрасиво как-то получалось :)
    демиарт - портал хороший очень и полезный... но давайте все-таки не будем друг с друга копипастить. имхо: этим мы обесцениваем достоинство этого ресурса и его оригинальность, против которой, кстати, лично я ничего не имею. лучшее место - еще поискать. где так все было доступно и интересно изложено - это я про изи флеш. спасибо вам, ребята, большое-большое и, надеюсь, такие копипастеры перестанут выдавать чужие работы за свои и не будут тем самым умалять достоинства этого прекрасного сайта
    вроде все сказала. если что, прошу прощения.


    --------------------
    c'est la vie
    ICQ: --
    #5 написал: kornet (6 июня 2009 11:31)


    Группа: Посетители
    Регистрация: 5.06.2009
    Комментариев: 2
    Публикаций: 0
    Латвия,
    спасибо за урок! неважно откуда, главное что есть!
    ICQ: --
    Информация
    Посетители, находящиеся в группе Гости, не могут оставлять комментарии в данной новости.
    Видео Журнал "Легко о Flash" - подписавшись на него вы будете один раз в месяц получать его выпуск на свой почтовый ящик, там вы найдете новые видео уроки по работе в программе Adobe Flash CS4.

    Ваш e-mail:

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


    Требуется для просмотраFlash Player 9 или выше.

    Показать все теги


    Rambler's Top100 Рейтинг@Mail.ru Rating All.BY Каталог SiteCreation rate your site
    links
    Internet Map page counter