Привет всем. Это мой 2-й пример для Love2D на этом сайте. Он показывает, как можно сделать игру с псевдо 3D графикой, без использования моделей или кучи кадров анимации для каждой позиции предмета.
Что нам нужно для начала: Изображение, содержащее несколько кадров - стрип. Они чаще используются для анимаций, но тут они будут использоваться в качестве слоев изображения. Я по-быстрому нарисовал машину. Вот что вышло:
файл я назвал carStrip.png
Да, не особо то понятно, что здесь творится, но я объясню - это стрип, состоящий из 7 кадров-слоев снизу вверх. Каждый кадр - 32x32. и между ними нет лишних пикселей. Поэтому картинка выглядит так странно.
Теперь приступим к кодингу. Первое, что нам нужно сделать - создать объект машины, и загрузить изображение:
function love.load()
love.graphics.setBackgroundColor(30, 30, 30) -- Просто меняем цвет фона :]
car = {}
car.angle = 0
car.x = 400
car.y = 300
car.img = love.graphics.newImage('carStrip.png') -- Загружаем наш стрип
end
car.angle нам нужен для того, чтобы во время просмотра мы могли вращать машину и осмотреть её со всех сторон. Далее, нужно записать каждый кадр в отдельную переменную. Но это будет гов*окод. Поэтому создадим таблицу и в неё запишем все кадры, и в этом нам поможет love.graphics.newQuad(x, y, w, h, sw, sh). Эта функция записывает в переменную кусок изображения, определенный координатами x, y и шириной с высотой w, h. sw и sh - размеры исходного изображения. Тут можно задать вопрос: почему нет аргумента, определяющего само исходное изображение? Ответ простой: quad - не изображение, а просто координаты на изображении (как координаты текстуры в d3d_vertex_texture). Использование этой функции можно сравнить с созданием текстур паков для Minecraft.
Более коротким и понятным языком - один quad можно использовать для нескольких изображений.
Добавляем в конец love.load:
for i = 0, 6 do
car.frames[i] = love.graphics.newQuad(i * 32, 0, 32, 32, 224, 32) -- Записываем кадры с помощью цикла
end
В love.update нет ничего важного - только вращение машины. Сразу напишем это, чтобы в конце уделить время основной части примера:
function love.update(dt)
if love.keyboard.isDown('left') then
car.angle = car.angle - math.rad(90) * dt
elseif love.keyboard.isDown('right') then
car.angle = car.angle + math.rad(90) * dt
end
end
Теперь основная часть нашего примера - рисование машины послойно. Рисовать надо снизу вверх, чтобы наложение слоев было правильным:
function love.draw()
for i = 0, 6 do
love.graphics.drawq(car.img, car.frames[i], car.x, car.y - i, car.angle, 1, 1, 16, 16)
end
end
Тут используется не love.graphics.draw, а drawq, которая рисует часть изображения, определенную quad'ом, который мы создали вначале.
Можно запускать. Но с таким маленьким изображением эффект будет не особо хорошо виден. Можно увеличить все в 2 раза. Для этого заменяем аргументы love.graphics.drawq, для увеличенного изображения:
love.graphics.drawq(car.img, car.frames[i], car.x, car.y - i * 2, car.angle, 2, 2, 16, 16)
И вот что у нас вышло:
function love.load()
love.graphics.setBackgroundColor(30, 30, 30) -- Просто меняем цвет фона :]
car = {}
car.angle = 0
car.x = 400
car.y = 300
car.img = love.graphics.newImage('carStrip.png') -- Загружаем наш стрип
for i = 0, 6 do
car.frames[i] = love.graphics.newQuad(i * 32, 0, 32, 32, 224, 32) -- Записываем кадры с помощью цикла
end
end
function love.update(dt)
if love.keyboard.isDown('left') then
car.angle = car.angle - math.rad(90) * dt
elseif love.keyboard.isDown('right') then
car.angle = car.angle + math.rad(90) * dt
end
end
function love.draw()
for i = 0, 6 do
love.graphics.drawq(car.img, car.frames[i], car.x, car.y - i * 2, car.angle, 2, 2, 16, 16)
end
end
Как всегда, вы можете скачать
.love примерВсем спасибо за внимание
Добавлено: Март 09, 2013, 14:27:37 Хочу добавить: Если собираетесь рисовать подобные изображения - лучше подготовьте пару заготовок с видом сбоку, сверху, спереди, для правильности послойного изображения
