Любой проект, будь то игра или приложение состоит не только из одного экрана. Всегда есть вспомогательные экраны, например с настройками.

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

Подготовка

Игровой экран

До сих пор мы работали в файле main.lua. Давайте представим, что это наш игровой уровень и переименуем его в game.lua.

Пока оставим этот файл в покое.

Выбор уровня

Для сцены с выбором уровня создадим новый файл: menu.lua.

Теперь нам предстоит познакомиться с библиотекой Composer.

Composer - библиотека для создания и управления экранами в Solar 2D.

Каждый экран - это группа объектов, отображаемых на экране и функции обработчики событий.

Для работы с Composer нужно сначала загрузить эту библиотеку и создать сцену:

local composer = require('composer') -- загружаем библиотеку

local scene = composer.newScene() -- создаем сцену

Далее нам нужно создать событий жизненного цикла экрана. Жизненный цикл экрана состоит из 4 этапов:

• create - вызывается, когда сцена создалась, но еще не появился на экране
• show - вызывается прямо перед показом сцены на экране
• hide - вызывается перед переходом на другую сцену
• destroy - вызывается после исчезновения сцены с экрана

Теперь нам нужно для только что созданной сцены добавить функции-обработчики этих событий:

function scene:create(event)
end

function scene:show(event)
end

function scene:hide(event)
end

function scene:destroy(event)
end

scene:addEventListener("create", create)
scene:addEventListener("show", show)
scene:addEventListener("hide", hide)
scene:addEventListener("destroy", destroy)

И самое последнее, что нам нужно обязательно сделать - в конце файла вернуть эту сцену:

return scene

В итоге пока наша болванка для сцены меню выглядит так:

local composer = require("composer")

local scene = composer.newScene()

function scene:create(event)
end

function scene:show(event)
end

function scene:hide(event)
end

function scene:destroy(event)
end

scene:addEventListener("create", create)
scene:addEventListener("show", show)
scene:addEventListener("hide", hide)
scene:addEventListener("destroy", destroy)

return scene

Делаем меню

Теперь нам нужно нарисовать само меню. Вопрос, где это делать? До этого у нас не было сцен и мы могли это делать где угодно. Теперь же нам нужно всю отрисовку делать в функции обработчике scene:create

Нужно учесть, что все объекты нужно добавить в группу сцены. Её можно достать вот так:

function scene:create(event)
	local sceneGroup = self.view

	local bg = display.newImageRect(sceneGroup, "resources/background.png", _W, _H);
	-- добавляем фон

	bg.x = _W / 2
	bg.y = _H / 2
end

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

for i = 1, 3 do
	local levelButton = display.newText(sceneGroup, i, 50 * i, 100, native.systemFont, 40)
	levelButton:setFillColor(1, 0, 0)
	levelButton:addEventListener("tap", levelTapListener)
end

Тут мы добавляем текст и добавляем обработчик касания на этот текст, который впрочем пока ничего не делает.

Переходим на экран с меню

Итак, у нас есть функция обработчик касания. В нее нужно добавить функцию перехода на другую сцену:

function levelTapListener(event)
   composer.gotoScene("game");
end

Да, вот так просто можно перемещаться между двумя сценами. НО, пока при нажатии вылетает ошибка, из-за того что в файле game.lua нет никакой сцены.

Предлагаю вам переделать файл game.lua по образу menu.lua, чтобы переход между экранами заработал.