Нечто скрытое…

Фев 14
2012

zxcatbeta, Всякое 7 комментариев

Один из проектов. 100% хит :-)

something hidden

something hidden

Кто угадает, что это?

Пишем игру на HTML5 и JS. Часть 2.5

Фев 04
2011

zxcatbeta, ИгроДел , , , , , , , No Comments

Эта статья — продолжение части 2, код в которой получился незавершёным. Сегодня мы сделаем следующее:

  1. Добавим в ядро возможность загружать ресурсы для модулей.
  2. Проверим работоспособность модуля zx.Image.
  3. Разберём простую анимацию.

Загрузка ресурсов ядром.

MindDefGame

Прежде всего, перенесём в ядро некоторые свойства из game.js. Например, canvas и его context. Также вынесем их инициализацию в ядро. Таким образом метод MindDefGame.initialize() упростится до:

			initialize: function(cnv, w, h) {
				zx.go(cnv, w, h);
				this.x = 0;
			},

В методе MindDefGame.loop() исправим использование canvas и его контекста:

			loop: function() {
				zx.ctx.globalAlpha = .017;
				zx.ctx.fillStyle = "#000";
				zx.ctx.fillRect(0,0,zx.cnv.width,zx.cnv.height);
				zx.ctx.globalAlpha = 1;
				var clr = 'rgb(' + Math.round(Math.random()*255) + ',' + Math.round(Math.random()*255) + ',' + Math.round(Math.random()*255) + ')';
				zx.ctx.fillStyle = clr;
				zx.ctx.fillRect(this.x, 0, 1, zx.cnv.height);
				this.x++;
				this.x %= zx.cnv.width;

			},

Кроме того, счётчик this.x теперь сбрасывается при достижении значения, равного ширине canvas’а, что позволяет полностью заполнить его цветными полосками.

Ядро.

Теперь перейдём к ядру. More

Создание игры на HTML5. Часть 1.

Янв 08
2011

zxcatbeta, ИгроДел , , , , 2 комментария

В этой части расскажу немного теории об устройстве игр и покажу небольшой пример работы с canvas.

Алгоритм практически каждой игры состоит из стандартной последовательности действий. Сначала происходит подготовка, настройка параметров игры (уровня), затем запускается повторяющийся игровой цикл, ну а после выхода из него (game over/переход на след. уровень) освобождаются выделенные ресурсы.

Самое интересное находится внутри цикла. Тут у нас происходит следующее:

  1. Опрос клавиатуры/мыши/итд — управление.
  2. Глобальные события (например, перемещение камеры).
  3. Обновление состояния игровых объектов  (координаты, скорости, поведение: столкновение, умирание, появление, превращение и т.п.).
  4. Отрисовка игровых объектов и всего остального (задний фон, набранные очки и др.).

Вообще, слово «объект» слишком общее, им можно назвать что угодно. Но не придумал пока что ничего лучше (если есть идеи — сообщите ;) ). Поэтому уточню.

Игровым объектом будем считать элемент игры, обладающий своим поведением; с этим элементом игрок (или другие объекты) может взаимодействовать.

More