Автор Тема: J2DS. Движок для HTML5 игр. Поэтапная разработка. (Прочитано 2406 раз)

Skaner-Soft · « : 15 Августа 2015, 15:22:43 »

Наверняка уже все знают о том, что такое HTML5, Canvas, и что на этом самом "канвасе" можно рисовать. В этих видеоуроках разбирается последовательность создания двумерного игрового движка. Основа движка - CANVAS элемент HTML5, а так же requestAnimationFrame.
На данный момент движок имеет следующие возможности:

= Сцены
- Поддержка множества сцен
- Очистка сцены
- Отрисовка сцены
- Ограничение FPS
- Игровые циклы
- Поддержка клавиатуры

= Игровые объекты
- Невидимые объекты
- Движение/Позиционирование
- Привязки к объектам
- Масштабирование
- Расчет дистанции до объекта
- Столкновения объектов
- Примитивы

= Изображения
- Предзагрузка
- Статические объекты
- Карты изображений
- Покадровая анимация
- Создание множественных анимаций
- Привязка анимаций к объектам
- Управление скоростью анимации (real-time)
- Переназначение анимаций
- Дублирование анимаций
- Выполнение множественных анимаций с разной скоростью

Пример простого игрового приложения

Код: (html5) [Выделить]

<!DOCTYPE html> 
<html>   
   <head> 
    <script type="text/javascript" src="engineDOM.js"></script> 
    <script type="text/javascript" src="engine2D.js"></script> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>Вводный урок</title> 
   </head> 

<body onkeydown="pKey= event.keyCode;" onkeyup="pKey= 0;"> 

<canvas id="iCanvas"   
          width="350"   
          height="200"   
          style="border: 1px solid;   
                 left: 0px;   
                 top: 0px;    "> 
</canvas> 

<script type="text/javascript"> 
// Создаем сцену 
scene= createScene('iCanvas'); 

// Создаем куб 
a= CreateCube( 'User', 
                 90, 20, 
                 50, 50, 
                 'rgb(150,100,100)' 
                );                        

// Инициализируем игровой цикл 
function Engine() { 
   a.keyControl(5); 
   a.Draw(scene); 
}    

// Запускаем игру с 30 FPS 
startGame(30); 
</script> 

</body> 
</html>

На тот случай, если кому интересно, как все работает

(Нажмите, чтобы показать/скрыть)

Скачать: J2DS v 0
http://gcup.ru/go?https://drive.google.com/file/d/0B09c3UoyWG0xMGVkZ2FnTDhGTk0/view?usp=sharing

Skaner-Soft · « **Ответ #1 :** 17 Августа 2015, 18:23:04 »

Пример игры на движке: http://nagel-petr.ru/games/Demo.html
Игра запускается как на компьюетрах, так и на мобильных устройствах.

Skaner-Soft · « **Ответ #2 :** 08 Декабря 2015, 09:56:43 »

Меня тут упрекнули, что работа встала. Не встала, движок уже дорос до версии 0.3:
Добавлен файл history, отображающий изменений от версии к версии, лишь косвенные.

На данный момент движок оборудован следующим функционалом:
- Добавлена поддержка колесика мыши
- Добавлены возможности позиционировать объекты по отдельным координатам
- Изменен подход к организации события мыши, добавлены типы событий:
- isMouseDown - удерживание кнопки мыши
- isMousePress - однократное нажатие кнопки мыши
- isMouseUp - отпускание кнопки мыши
- Так же функции принимают в качестве аргумента следующие строки:
- LEFT
- RIGHT
- MIDDLE

Немного о грядущих нововведениях:
- Добавлен менеджер видов. Теперь можно создавать сколь угодно Видов (ViewPort), управлять ими, переключаться.
- Добавлены функции автоматической перерисовки сцены, чтобы не вызывать для каждого объекта метод draw()
- Добавлен менеджер игровых состояний.
- Изменен механизм работы с устройствами ввода / вывода.
- Добавлен менеджер обработки событий тачскрина "getTouchIO()" с поддержкой событий isTap[Down|Press|Up].
- Так же в обработчик мыши добавлены события isMouseMove() а в обработчик сенсорного ввода isTouchMove(). Подробно обо всех событиях будет описано в справке и в history-файле. Обновление выйдет в ближайшую субботу. По всем нововведениям и обновлениям информацию вы всегда можете получить на GitHub проекта и так же на сайтах проекта.

Так же справка полностью на русском, с примерами, готова уже для самой актуальной версии движка.

По всем вопросам отвечаю либо тут, либо ВК, либо на форуме проекта. Лучше конечно на форуме самого движка, дабы сконцентрировать информацию по движку.

victor00000 · « **Ответ #3 :** 08 Декабря 2015, 10:35:00 »

HTML5 - это canvas одной и много функции.

Skaner-Soft · « **Ответ #4 :** 09 Декабря 2015, 09:18:13 »

Немного изменена архитектура движка. Теперь функционал разделен на Менеджеры.
в j2Ds менеджер - это специальный объект, который отвечает за ту или иную часть движка. Разбивка на менеджеры дает возможность использовать в ваших проектах только тот функционал, который требуется именно вам, при этом совершенно не нужно вникать, как работают остальные части.
На текущий момент в движке задействованы следующие менеджеры:
- Менеджер сцены: getSceneManager()
- Менеджеры управления
- - getIO
- - getTouchIO
- Менеджер игровых состояний: getGameStateManager()
- Менеджер слоев: getLayerManager()
- Менеджер текстур: getTextureManager()
- Менеджер устройства: getDeviceManager()
- Менеджер звука: getSoundManager()
- Менеджер хранения данных: getMemoryManager()
- Менеджер видок (камер): getViewManager()
- Менеджер расчетов FPS и оптимизации: getFPSManager()
- Менеджер для работы с DOM: getDOMManager()

Пока это все менеджеры, доступные в движке, но поверьте, на их основе создать полноценный проект можно уже сейчас.
Обновление планируется на субботу.

Skaner-Soft · « **Ответ #5 :** 14 Декабря 2015, 09:33:41 »

Глобальное обновление. Полная потеря совместимости. Поддержка звука. Как-то так должна называться эта новость...
Но, название, как всегда - весьма банальное: Обновление j2Ds до версии 0.4.0.
Первое, и, наверное, не очень радостное известие - безболезненно обновиться на новую версию будет нельзя. Связано это с тем, что изменениям подверглись все глобальные объекты. В движок введено понятие "Менеджер", которое определяет специальный объект, отвечающий конкретно за свою область работы. Менеджер следит за стеком, за объектами, вверенными ему в наблюдение. Всеми менеджерами можно легко управлять. Для обновления, в принципе, нужно внимательно глядеть в справку, чтобы ваш проект внезапно не начал работать не совсем так, как вы того ожидаете. При обновлении так же очень рекомендуется поглядывать в веб-консоль, и следить, какие методы вызывают ошибки, чтобы устранить их, посмотрев в справку. Ну, думаю, справиться будет не сложно. Благо это касается лишь самих менеджеров, методы не тронуты, только расширенны.

Второе, не менее важное, список менеджеров:
- Менеджер сцены: getSceneManager()
- Менеджеры управления
- - getIO
- - getTouchIO
- Менеджер игровых состояний: getGameStateManager()
- Менеджер слоев: getLayerManager()
- Менеджер текстур: getTextureManager()
- Менеджер устройства: getDeviceManager()
- Менеджер звука: getSoundManager()
- Менеджер хранения данных: getMemoryManager()
- Менеджер видок (камер): getViewManager()
- Менеджер расчетов FPS и оптимизации: getFpsManager()
- Менеджер для работы с DOM: getDOMManager()
- Менеджер векторов и математики: getMathManager()
- Менеджер рисования (кисть): getPaintManager()
Подробно обо всем написано в справке.

Третье, в движок заехал звук.
Менеджер звука полностью рабочий, базируется на HTML5 Audio, и позволяет следующее:
- загрузка звука из файла
- Воспроизведение
- - Одиночное
- - Зацикленное
- Управление воспроизведением
- Управление громкостью
- Все возможности плеера
- Глобальные методы
- Блокировка воспроизведения

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

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

Ну и на этом, пока что, все. Вчера не выложил ничего, каюсь, но не жалею! День прошел очень позитивно, с друзьями. Желаю всем хорошего окончания года!

И сразу за обновлением готовится обновление 0.5.0, в котором добавлен новый менеджер для работы с триггерами.
На текущий момент поддерживаются три типа событий:
- Циклическое выполнение команд каждый N секунд.
- Разовый запуск команд с задержкой
- Циклическое выполнение с зарержкой.

Пока это лишь прототип, проверить можно будет чуть позже на j2ds.ru, там уже, кстати, доступны примеры программ с использованием звуков. BezaBead тоже модифицирован согласно вововведениям.

Форум русскоязычного сообщества Ubuntu

Автор Тема: J2DS. Движок для HTML5 игр. Поэтапная разработка. (Прочитано 2406 раз)

Skaner-Soft

J2DS. Движок для HTML5 игр. Поэтапная разработка.

Skaner-Soft

Re: J2DS. Движок для HTML5 игр. Поэтапная разработка.

Skaner-Soft

Re: J2DS. Движок для HTML5 игр. Поэтапная разработка.

victor00000

Re: J2DS. Движок для HTML5 игр. Поэтапная разработка.

Skaner-Soft

Re: J2DS. Движок для HTML5 игр. Поэтапная разработка.

Skaner-Soft

Re: J2DS. Движок для HTML5 игр. Поэтапная разработка.