Balls and holes PC game / Balls and Holes PC игра
Вакансии
Игродельня
Сегодня
17 января 2018
4:08
Вход Регистрация Забыли пароль ?

Happy Kittens Puzzle | puzzle
Happy Kittens Puzzle | puzzle
подробнее...

Теги

сайты, игры, дизайн, продвижение, php, html, css, my sql, c++, delphi, photoshop, 3ds max, fl studio, трекерская музыка, уроки

Статьи сайта

Equinox | ZX Spectrum | maze game | Mikro-Gen Ltd, 1986

Nanako Descends to Hell | ZX Spectrum | maze game | Ubhres Productions, 2009

Maritrini, Freelance Monster Slayer | ZX Spectrum | maze game | Ubhres Productions, 2012

Mad Mix 2 | ZX Spectrum | maze game | Topo Soft, 1990

Fat Worm Blows a Sparky | ZX Spectrum | maze game | Durell Software Ltd, 1986

Ant Attack | ZX Spectrum | maze game | Quicksilva Ltd, 1983

Dingo | ZX Spectrum | maze game | Tardis Remakes, 2011

Cheril of the Bosque | ZX Spectrum | maze game | Ubhres Productions, 2010

Pac-Mania | ZX Spectrum | maze game | Grandslam Entertainments Ltd, 1988

Boulder Dash | ZX Spectrum | maze game | Front Runner, 1984

Ms. Pac-Man | ZX Spectrum | maze game | Atarisoft, 1984

Pi-In'Ere | ZX Spectrum | maze game | Automata UK Ltd, 1984

Forest Raider Cherry | ZX Spectrum | maze game | Timmy, 2010

Mine Worker | ZX Spectrum | maze game | Firestarter, 2010

Go Bear Go! | ZX Spectrum | maze game | Sinclair User, 1988

Flash Beer Trilogy | ZX Spectrum | maze game | Weird Science Software, 2003

Pacman | ZX Spectrum | maze game | SuperSoft [2], 2000

Fast Food | ZX Spectrum | maze game | Code Masters Ltd, 1989

In The Walls of Eryx | ZX Spectrum | maze game | Monster's Legs Productions, 2016

Rockford | ZX Spectrum | maze game | Mastertronic Added Dimension, 1987

Tantalus | ZX Spectrum | maze game | Quicksilva Ltd, 1986

Gauntlet II | ZX Spectrum | maze game | US Gold Ltd, 1988

Maze Mania | ZX Spectrum | maze game | Hewson Consultants Ltd, 1989

Nonterraqueous | ZX Spectrum | maze game | Mastertronic Ltd, 1985

Mission Omega | ZX Spectrum | maze game | Mind Games, 1986

Gauntlet III: The Final Quest | ZX Spectrum | maze game | US Gold Ltd, 1991

Final Matrix, The | ZX Spectrum | maze game | Gremlin Graphics Software Ltd, 1987

Pacman's Revenge | ZX Spectrum | maze game | Idem Soft, 1988

игры онлайн | games online | play online | zx-spectrum games

игры онлайн | games online | play online | zx-spectrum games

Dynatron Mission | ZX Spectrum | maze game | Mastertronic Ltd, 1987

Moggy Adventure | ZX Spectrum | maze game | Ubhres Productions, 2010

FLAPPY BIRD | arcade | MULTIPLAYER | flaapio

Pencil Paper and the Ball | logic arcade | MULTIPLAYER | megainformatic

Micro Mouse | ZX Spectrum | maze game | Mastertronic Plus, 1989

Well 2, The | ZX Spectrum | maze game | Beyker Soft, 2006

Ninja Massacre | ZX Spectrum | maze game | Code Masters Ltd, 1989

Starblastio | arcade | MULTIPLAYER | ARENA - ASTEROIDS - BATTLE

Cut The Rope | Phisics | Zeptolab

Christmas Girl Dressup | Dressup

Panda Hair Do | Dressup | Funny House Games

Marble Smash | match 3

Two Cars | arcade

Spider Solitaire | card game

Simonmemory | memory trainer | Code This Lab

Tap the Frog | point and click

Tap the Frog | point and click

Fruit Pop | link objects

Farm Pets | swap objects

Blow Fish | point and click

Bug Match | swap objects & match 3

Froggee | point and click

Molecule Man | ZX Spectrum | maze game | Mastertronic Ltd, 1986

Cybex | ZX Spectrum | maze game | Pirate Software Ltd, 1987

Gobbleman | ZX Spectrum | maze game | Artic Computing Ltd, 1982

Muncher Compo, The | ZX Spectrum | maze game | Sinclair User, 1988

Шаг 4 в освоении Flash-технологий - как анимировать персонажа и управлять им

[к содержанию]

Хочу поделиться своими изысками и экспериментами, а также опытом в области создания Flash-игр.

В данном обширном уроке я попытался охватить следующую тему:

Как создать простейшую игру - анимированный персонаж ходит по экрану по нажатию клавиш стрелок ВЛЕВО/ВПРАВО

Вопросы рассматриваемые в ходе урока:

1) Как создать приложение в среде FlashDevelop ?
2) Как подготовить анимацию персонажа во Flash CS5 и экспортировать в SWC библиотеку
3) Как использовать полученную в SWC библиотеке анимацию в AS3-приложении
4) Как управлять анимированным персонажем от клавиатуры и мыши
5) Фокус ввода для Flash-приложения в браузере

В результате выполнения действий описанных по ходу данного урока у Вас может получиться нечто нижеследующее -

Для того, чтобы управлять зомби кликните по нему мышкой, а затем используйте клавишу стрелка ВПРАВО.



1) Как создать приложение в среде FlashDevelop ?

Ну что ж, приступим.

1) Запускаем IDE FlashDevelop;

2) Закрываем текущий проект (если он был открыт) File > Close All, создаем новый проект AS3 - Project > New Project > AS3;

вставляем такой код в файл Main.as

package walked_zomby
{
import flash.display.Sprite;
import flash.events.Event;
import flash.events.TimerEvent;
import flash.utils.Timer;

public class Main extends Sprite
{

public function Main():void
{

if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);

}

private var _sprite:Sprite;
private var _vx:Number = 1;
private var _vy:Number = 0;
private var _timer:Timer;

private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point

_sprite = new Sprite();
_sprite.graphics.beginFill(0xffff00, 100);
_sprite.graphics.drawCircle(0, 0, 50);
_sprite, graphics.endFill();
_sprite.x = 0;
_sprite.y = 50;
addChild(_sprite);
_timer = new Timer(25);
_timer.addEventListener("timer", onTimer);
_timer.start();
}

public function onTimer(event:TimerEvent):void {
_sprite.x += _vx;
_sprite.y += _vy;
}

}

}

и выполняем сборку проекта.

Получаем swf ролик, работу которого можно проверить в браузере, например в GoogleChrome или в любом другом браузере при наличии установленного для этого браузера плагина Adobe Flash Player.

Данный проект демонстрирует анимацию желтой окружности по таймеру с интервалом 25 миллисекунд.

Итак, если с созданием проекта в среде FlashDevelop у вас вопросов больше нет (а если есть - то посмотрите еще такие статьи - Учимся создавать флеш-игры, что нужно знать для того, чтобы заняться созданием flash приложений и игр ?

Изучаем Flash

)

Перейдём ко 2 вопросу -
2) Как подготовить анимацию персонажа во Flash CS5 и экспортировать в SWC библиотеку

Если у вас нет под рукой готового персонажа, то предварительно надо его нарисовать и анимировать. Это подробно описано в одной из моих статей - Рисуем волка

В статье подробно описано как нарисовать волка в Photoshop, а затем анимировать его хотьбу. Если Вы научитесь это делать сами, тогда создать любого другого персонажа (как например моего зомби, который представлен в данном уроке) для вас уже не составит большого труда.

Итак, будем считать, что персонаж уже у вас готов и анимирован. Нам остается только разобраться каким образом вставить его в ваше приложение Flash Develop.

Простой способ - путём загрузки картинки, например в формате PNG тут не пройдёт, поскольку желательно, чтобы Ваша флешка swf хранила всё необходимое внутри себя в виде ресурсов и не требовала больше никаких внешних файлов.

Для работы Вам понадобится среда Adobe Flash CS5 или выше.

Пошагово процесс выглядит так:

1) Запускаем Flash CS5.

2) Создаем новый пустой проект AS3.

3) Выполняем File > import > import to stage > png - обращаю ваше внимание что каждый кадр анимации должен быть представлен отдельным PNG-файлом. При этом удобно создать для всех кадров отдельную папку, а при импорте сразу выбрать эту папку и все файлы в ней.

4) Произойдёт вставка всех изображений в сцену AS3-проекта. Пока выделение с объектов не снято - кликните по ним правой кнопкой мыши и выберите пункт Distribute to Layers (т. е. распределить по слоям)

Произойдёт вставка всех изображений в сцену AS3-проекта. Пока выделение с объектов не снято - кликните по ним правой кнопкой мыши и выберите пункт Distribute to Layers (т. е. распределить по слоям)

5) Далее даем каждому слою имя, которое будет однозначно определять каждый кадр анимации и пока слой выделен нажимаем F8 чтобы преобразовать его в символ.

Далее даем каждому слою имя, которое будет однозначно определять каждый кадр анимации и пока слой выделен нажимаем F8 чтобы преобразовать его в символ.

6) Не забудьте включить сглаживание изображения ­ (smoothing) в библиотеке - для этого нужно кликнуть по изображению правой кнопкой в панели списка изображений СПРАВА и выбрав Properties > Bitmap properties установить сглаживание - для PNG сжатие желательно вообще отключить. Тогда никаких искажений не будет.

Не забудьте включить сглаживание изображения ­ (smoothing) в библиотеке - для этого нужно кликнуть по изображению правой кнопкой в панели списка изображений СПРАВА и выбрав Properties > Bitmap properties установить сглаживание - для PNG сжатие желательно вообще отключить. Тогда никаких искажений не будет.

Не забудьте включить сглаживание изображения ­ (smoothing) в библиотеке - для этого нужно кликнуть по изображению правой кнопкой в панели списка изображений СПРАВА и выбрав Properties > Bitmap properties установить сглаживание - для PNG сжатие желательно вообще отключить. Тогда никаких искажений не будет.

7) Теперь остается экспортировать ваш анимированный спрайт в SWC библиотеку. Об этом уже рассказано в статье Flash. Экспорт SWC библиотеки.

8) В результате получим некий SWC библиотечный файл, который вам остается разместить в папке lib вашего FlashDevelop проекта.

После того, как это сделано, нужно добавить классы swc-библиотеки во FlashDevelop проект. Для этого в рабочей среде FlashDevelop просто кликаем правой кнопкой по названию добавленной SWC библиотеки и выбираем пункт Add to Library.

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

3) Как использовать полученную в SWC библиотеке анимацию в AS3-приложении
Сделать это можно самыми разными способами, тот способ который я предложу вам в данной статье не является истиной в последней инстанции, но главное - он уже дает нужный нам результат - т. е. перемещаемого и анимированного персонажа.

Вот собственно необходимый код для реализации -

====================

package walked_zomby
{

import flash.display.Sprite;
import flash.events.Event;
import flash.events.TimerEvent;
import flash.utils.Timer;

public class Main extends Sprite
{

public function Main():void
{

if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);

}
private var _vx:Number = 1;
private var _vy:Number = 0;
private var _timer:Timer;

private var zomby_frames: Array;

private var current_frame: int;

private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point

current_frame = 1;

zomby_frames = new Array();

zomby_frames.push(new walked_zomby_right_1);
zomby_frames.push(new walked_zomby_right_2);
zomby_frames.push(new walked_zomby_right_3);
zomby_frames.push(new walked_zomby_right_4);

zomby_frames.push(new walked_zomby_right_5);
zomby_frames.push(new walked_zomby_right_6);
zomby_frames.push(new walked_zomby_right_7);
zomby_frames.push(new walked_zomby_right_8);

for ( var i:int = 0; i < 8; i++ )
{
addChild(zomby_frames[i]);
(Sprite)(zomby_frames[i]).visible = false;
}
(Sprite)(zomby_frames[0]).visible = true;

_timer = new Timer(100);
_timer.addEventListener("timer", onTimer);
_timer.start();
}

public function onTimer(event:TimerEvent):void {

for ( var i:int = 0; i < 8; i++ )
{
var sx:int = (Sprite)(zomby_frames[i]).x;
if ( sx > 300 )
{
sx = 0;
(Sprite)(zomby_frames[i]).x = sx;
}

(Sprite)(zomby_frames[i]).x += _vx;
}

(Sprite)(zomby_frames[current_frame-1]).x += _vx;

(Sprite)(zomby_frames[current_frame-1]).visible = false;

if ( current_frame < 8 )
{
current_frame += 1;
}
else {
current_frame = 1;
}

(Sprite)(zomby_frames[current_frame-1]).visible = true;

}
}

}

====================
У нас с вами остаются 2 вопроса -

4) Как управлять анимированным персонажем от клавиатуры и мыши
5) Фокус ввода для Flash-приложения в браузере

4) Как управлять анимированным персонажем от клавиатуры и мыши

Пока опыт мой во флеше не такой уж большой, поэтому всё что я здесь опишу - это лишь результаты моих проб и ошибок. Я конечно добиваюсь, чтобы поставленная задача была решена, но имейте в виду, что всё что здесь написано - ни в коем случае не самое правильное и оптимальное решение.

Итак, приступим. Оказывается, чтобы заставить вашего персонажа реагировать на клавиши СТРЕЛКА ВЛЕВО/СТРЕЛКА ВПРАВО нужно учесть всего 2 важных момента:

4.1 ) Это правильно написать "слушатель" - т. е. метод объекта класса вашего приложения, который будет обрабатывать события ввода

и второе -

4.2) Сделать так, чтобы ваш объект мог получать "фокус ввода". В противном случае нажатия клавиш не будут обрабатываться правильно, т. е. попросту говоря персонаж не будет перемещаться по нажатию клавиш.

Теперь рассмотрим необходимый для этого код -

//в метод public function Main():void добавляем такой код

stage.focus = this;
addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);

//в классе приложения объявляем метод "слушатель" onKeyDown

private function onKeyDown(event:KeyboardEvent):void {

if ( event.keyCode == Keyboard.RIGHT )
{
MoveHero();
}
}

//ну и наконец самое главное

//в код, который я уже приводил выше нужно добавить такую строку -

for ( var i:int = 0; i < 8; i++ ) //это код, который я уже приводил выше, когда рассматривал вопрос номер 3
{//это код, который я уже приводил выше, когда рассматривал вопрос номер 3
addChild(zomby_frames[i]);//это код, который я уже приводил выше, когда рассматривал вопрос номер 3
(Sprite)(zomby_frames[i]).visible = false;//это код, который я уже приводил выше, когда рассматривал вопрос номер 3

(MovieClip)(zomby_frames[i]).buttonMode = true; //это новая строчка кода, благодаря которой зомби сможет быть управляем от клавиатуры !!!



}//это код, который я уже приводил выше, когда рассматривал вопрос номер 3
(Sprite)(zomby_frames[0]).visible = true;//это код, который я уже приводил выше, когда рассматривал вопрос номер 3


5) Фокус ввода для Flash-приложения в браузере

Тут всё просто - делайте свои флеш-приложения таким образом, чтобы пользователь постоянно что-то кликал в них мышкой. Тогда фокус ввода будет постоянно находится на области вашего Flash-приложения и всё будет ОК.



[к содержанию]

X
Создаем анимацию хотьбы волка в Photoshop и ImageReady
 

Оставленные комментарии



Something: Unexplained 2 captive of desires / Нечто: Необъяснимое 2 в плену желаний
Костя Коробкин Комикс Коллекционное издание - 6 комиксов, 81 страница, 220 mp3 треков
Время загрузки: 1,5028