Очень плохо, если игра начинается сразу, без меню. Вы ещё не открыли вкладку с игрой, а вас уже "замочили".
На главном меню должна располагаться основная информация о ней, ссылка на обучение, авторы, начать/загрузить игру. На скриншоте моего варианта шутера пока всего две кнопки, но их количество в скором времени вырастет. И у вас тоже :)
Сейчас мы научимся делать кнопки, курсоры, сделаем главное меню и оформим его.
Кнопки
Если мы для каждой кнопки будем делать свой спрайт, как это можно было сделать для простой игры для компьютера, то для браузерных игр надо сокращать количество используемых файлов - их большое число серьёзно замедляет загрузку игры.
Для своих кнопок я использовал такой спрайт:
И шрифт с настройками Family - century gothic, verdana, sans-serif и размером 24.
Как указывать шрифт в поле Family? Мы сначала записываем тот шрифт, который нам нужен, а затем те, которые наиболее похожи на него. Шрифты перечисляем через запятую.
Не указывайте шрифты, не встроенные в систему или не идущие вместе с Microsoft Office - на других компьютерах этих шрифтов просто не будет.
Создаём объект для кнопки. Одна кнопка - один объект.
В событие Draw добавляем следующий код для прорисовки:
draw_sprite(sprite_index,0,x,y);Текст кнопки ставим свой. Цвет текста подбираем в любом графическом редакторе в формате RGB.
draw_set_color(95,236,241);
draw_set_font(font_button);
draw_set_valign(fa_middle);
draw_set_halign(fa_center);
draw_text(x,y,"Текст кнопки");
Для события step добавляем этот код:
if (mouse_check_released()){Этот кусочек кода для любых приблизительно прямоугольных кнопок. С помощью (sprite_index).height и (sprite_index).width узнаются размеры кнопки. В настройках спрайта нужно нажать на кнопку "Center".
if (mouse_x > x - (sprite_index).width / 2 && mouse_x < x + (sprite_index).width / 2 && mouse_y < y + (sprite_index).height / 2 && mouse_y > y - (sprite_index).height / 2) {
*какой-нибудь код*
}
}
Чтобы перейти в другую комнату, достаточно вставить следующий код:
room_goto(arena);arena заменяем на название комнаты, в которую переходим.
Добавляем кнопку в новую комнату.
Курсор
Для курсора загружаем необходимый нам спрайт. В моём случае это что-то, похожее на серебрянный коготь (я ещё сам не придумал, что это :D).Для курсоров и для эффектов в главном меню я добавляю новый объект с отрицательной глубиной (чтобы курсор лежал поверх кнопок).
В событие create добавляем одну-единственную строчку для скрытия стандартной мыши:
hide_mouse();И ещё одну для прорисовки своей в событии draw:
draw_sprite(cur,0,mouse_x + room_viewport_x,mouse_y + room_viewport_y);cur заменяем на название спрайта свого курсора.
Добавляем объект-контроллер для меню в соответствующую комнату.
Для основной игры нам тоже понадобится курсор, но для шутера логичней будет указать другой спрайт в виде прицела. Создаём спрайт, добавляем вышеуказанные куски кода в контроллер основной битвы.
Оформление
Главное меню без анимаций и музыки моментально вызывает у меня панику, и я начинаю судорожно тыкать во всё и вся от мысли, что только что у меня завис комп.
Любая анимация оживит вашу игру и сделает её привлекательней. Это могут быть бегающие на фоне монстры, какие-нибудь искры, бегающие по экрану, смена картинок-слайдов или ещё чего-нибудь. Можно сделать на фон пейзаж и добавить анимированную погоду - очень красиво.
Страницы
Пустующее меню с одной-двумя кнопками навевает грустные мысли... Если вы уже придумали сюжет для своего шутера, то его можно вынести в отдельную комнату и добавить соответствующую кнопку в главное меню. Можно добавить кнопку "как играть" или "авторы".
Лого
В главном меню обычно помещается логотип. В его оформлении я не буду ничего подсказывать - делайте сами) В комнату логотип лучше добавить как тайл (tile).
 |
| добавление логотипа как тайл |
Если что-то где-то не получается или нужна помощь в оформлении - пишите в комментариях.
Также ждём дальнейших туториалов по созданию шутера.
Если вы ведёте свой блог, микроблог, либо участвуете в какой-то популярной социальной сети, то вы можете быстро поделиться данной заметкой со своими друзьями и посетителями. Для этого воспользуйтесь предлагаемыми ниже кнопками:
Блог: http://romanlovetext.blogspot.com/
