Урок №1
LessonOne.capx- (1.64 МБ) Скачиваний: 95
Нам потребуется:
Изображение
Описание
1. Изображения - лежат они в папке Details. В принципе можете использовать свои, в инете их полно.
2. Звуковые эффекты представлены 4 файлами OGG - также лежат в папке Details.
3. Программа Notepad ++, весит мало, умеет много. Качайте с оф. сайта, поддерживает все ОС.
4. Ну и собственно сам движок Construct 2. Плагинов качать никаких не надо, последняя версия подойдет.
2. Звуковые эффекты представлены 4 файлами OGG - также лежат в папке Details.
3. Программа Notepad ++, весит мало, умеет много. Качайте с оф. сайта, поддерживает все ОС.
4. Ну и собственно сам движок Construct 2. Плагинов качать никаких не надо, последняя версия подойдет.
Ресурсы
Details.rar- (293.85 КБ) Скачиваний: 70
1. Создание проекта.
Изображение
Описание
1.1 Создадим новый проект - File -> New. Заполним нужные поля About, Project settings и Configuration Settings. Имя проекта (name) - Урок №1, размер окна Window Size - 1024,768.
1.2 Изменим название нашей сцены (Layout 1) - Game, название прикрепленного к ней эвента (Event sheet 1) - Event Game. Установим размер сцены Game равными размерам нашего окна проекта (Layout size) - 1024,768. Добавление объектов расписывать не буду, на скриншотах приведены все настройки. Необходимо подключить следующие плагины: AJAX (нужен для взаимодействия с нашими php скриптами), Audio (музыкальное сопровождение), Brouser (я его не использовал, но необходим для включения полноэкранного режима), Mouse (производит действия с объектами).
1.3 Перейдем во вкладку Слои (Layers). Переименуем наш слой (Name) - Ground, изменим его цвет (Background color) - 0,0,0 и изменим значение паралакса (Parallax) - 0,0 и Scale rate - 0.
1.2 Изменим название нашей сцены (Layout 1) - Game, название прикрепленного к ней эвента (Event sheet 1) - Event Game. Установим размер сцены Game равными размерам нашего окна проекта (Layout size) - 1024,768. Добавление объектов расписывать не буду, на скриншотах приведены все настройки. Необходимо подключить следующие плагины: AJAX (нужен для взаимодействия с нашими php скриптами), Audio (музыкальное сопровождение), Brouser (я его не использовал, но необходим для включения полноэкранного режима), Mouse (производит действия с объектами).
1.3 Перейдем во вкладку Слои (Layers). Переименуем наш слой (Name) - Ground, изменим его цвет (Background color) - 0,0,0 и изменим значение паралакса (Parallax) - 0,0 и Scale rate - 0.
2. Настройка слоев и объектов.
Изображение
Описание
2.1 Создадим еще два слоя Menu и Record. Настроим их по аналогии Ground, но значение Transparent установим на yes. Слой Menu сделаем нивидимым на старте Initial visibility - Invisible.
2.2 Все объекты распределим по слоям, пользуйтесь скриншотами. На примере объекта Blood объясню как читать скриншоты с настройками всех остальных объектов.
2.2.1 Создадим спрайт с именем Blood на слое Ground.
2.2.2 Установим ему позицию 25, -100 и размер 50, 45
2.2.3 Добавим ему поведение Fade. Время появления (Fade in time) - 0, Время задержки (Wait time) - 0 и время исчезновения (Fade out time) - 1.
2.3 Будьте внимательны, некоторые объекты имеют свои поведения. Для объектов ter и girl нужно настроить коллизионную маску для точного попадания и точку origin - 150,150.
2.2 Все объекты распределим по слоям, пользуйтесь скриншотами. На примере объекта Blood объясню как читать скриншоты с настройками всех остальных объектов.
2.2.2 Установим ему позицию 25, -100 и размер 50, 45
2.2.3 Добавим ему поведение Fade. Время появления (Fade in time) - 0, Время задержки (Wait time) - 0 и время исчезновения (Fade out time) - 1.
2.3 Будьте внимательны, некоторые объекты имеют свои поведения. Для объектов ter и girl нужно настроить коллизионную маску для точного попадания и точку origin - 150,150.
Настройка коллизии
В идеале не рекомендуется использовать более 8 точек коллизии, но т.к. у нас всего один кадр анимации, то ничего страшного не будет.
3. Работа с php файлами.
Описание
3.1 Всего у нас будет 4 скрипта: base, enter, record и death. Далее мы подробно разберем их по отдельности.
3.2 base.php - отвечает за подключение к базе данных, в которой мы будем хранить информацию об участниках игры.
3.3 enter.php - выполняет проверку вводимых данных (имени и пароля) и автоматически определяет авторизуется участник или регистрируется.
3.4 record.php - выводит список игроков набравших большее количество очков.
3.5 death.php - проверяет имеющееся количество очков в базе и заменяет его если игрок поставил свой новый рекорд.
3.2 base.php - отвечает за подключение к базе данных, в которой мы будем хранить информацию об участниках игры.
3.3 enter.php - выполняет проверку вводимых данных (имени и пароля) и автоматически определяет авторизуется участник или регистрируется.
3.4 record.php - выводит список игроков набравших большее количество очков.
3.5 death.php - проверяет имеющееся количество очков в базе и заменяет его если игрок поставил свой новый рекорд.
base.php
- Код: Выделить всё
<?php
// ShadowSSystemSProductS - KrashtreaT
defined('PROTECTOR') or die('Error: restricted access');
// введем имя сервера, базы, пользователя и пароль
$mysql_host = "хост имя";
$mysql_base = "имя базы";
$mysql_user = "имя пользователя";
$mysql_pass = "пароль";
// выполним mysqli запрос серверу
$mysqli = new mysqli("$mysql_host","$mysql_user","$mysql_pass","$mysql_base");
// проверим подключение
if (mysqli_connect_errno()){
printf("Ошибка подключения к серверу. Код ошибки: %s\n", mysqli_connect_error());
exit;}
?>
enter.php
- Код: Выделить всё
<?php
// ShadowSSystemSProductS - KrashtreaT
define('PROTECTOR', 1);
// запишем переменные, отправленные нам методом POST
// перед записью в БД сделаем экранирование строк и символов
// для защиты от JS скриптов используем htmlspecialchars
$name = htmlspecialchars(addslashes($_POST['name']));
$pass = htmlspecialchars(addslashes($_POST['pass']));
// проверим вводимые данные на недопустимые символы
if (preg_match("/[^(\w)|(\x7F-\xFF)|(\s)]/",$name) or preg_match("/[^(\w)|(\x7F-\xFF)|(\s)]/",$pass)){
echo "ИМЯ ЗАНЯТО";
exit;}
// проверим длинну вводимых данных
if(strlen($name) < 3 or strlen($name) > 30 or strlen($pass) < 3 or strlen($pass) > 30){
echo "ИМЯ ЗАНЯТО";
exit;}
// подключимся к БД
include ('base.php');
// если имя не заполнено выведем ошибку
if ($name == ''){
echo "НЕТ ИМЕНИ";
exit;}
// закодируем пароль участника используя md5
$pass = md5($pass);
// выполним запрос к БД на наличие участника с нужным именем и паролем
$user = $mysqli->query("SELECT * FROM user WHERE name = '$name' AND pass = '$pass' LIMIT 1");
$numuser = $user->num_rows;
$user->close();
// если такой участник существует выведем его имя
if ($numuser == 1){
echo $name;
exit;}
// если такого нет, выполним запрос к БД на наличие участника с нужным именем
$user = $mysqli->query("SELECT * FROM user WHERE name = '$name' LIMIT 1");
$numuser = $user->num_rows;
$user->close();
// если такой участник существует, выведем ошибку
// если такого участника нет, произведем запись данных в БД и выведем его имя
if ($numuser == 0){
$mysqli->query("INSERT INTO user (name, pass) VALUES ('$name', '$pass')");
echo $name;
exit;}
else {
echo "ИМЯ ЗАНЯТО";
exit;}
?>
record.php
- Код: Выделить всё
<?php
// ShadowSSystemSProductS - KrashtreaT
define('PROTECTOR', 1);
// подключимся к БД
include ('base.php');
// выполним запрос к БД на выборку пятерых учатников с наибольшим количеством очков
$score = $mysqli->query("SELECT * FROM user ORDER BY `score` DESC LIMIT 5");
// выведем полученные данные
while( $result = $score->fetch_assoc() ){
echo $result['name']." - ".$result['score']."|";}
$score->close();
?>
death.php
- Код: Выделить всё
<?php
// ShadowSSystemSProductS - KrashtreaT
define('PROTECTOR', 1);
// запишем переменные, отправленные нам методом POST
$name = htmlspecialchars(addslashes($_POST['name']));
$score = htmlspecialchars(addslashes($_POST['score']));
// проверим вводимые данные на недопустимые символы
if (preg_match("/[^(\w)|(\x7F-\xFF)|(\s)]/",$name) or preg_match("/[^(\w)|(\x7F-\xFF)|(\s)]/",$score)){
echo "ОШИБКА";
exit;}
// подключимся к БД
include ('base.php');
// выполним запрос к БД на наличие участника с нужным именем
$user = $mysqli->query("SELECT * FROM user WHERE name = '$name' LIMIT 1");
$numuser = $user->num_rows;
// если такой участник существует, проверим его результат и сравним его с новым
// если новый результат больше записанного, перепишем его используя Update
// если такого участника нет, выведем ошибку
if ($numuser == 1){
while( $result = $user->fetch_assoc() ){
if ($score > $result['score']){
$mysqli->query("UPDATE `user` SET `score` = '$score' WHERE `name` = '$name' LIMIT 1");}}
$user->close();
exit;}
else {
echo "ОШИБКА";
exit;}
?>
4. База данных MySQL.
Изображение
Описание
4.1 Для того чтобы разместить проект в сети, необходимо выбрать хостинг провайдера. Для своих тестовых работ я использую поставщика услуг Hostinger, но это уже на ваше усмотрение. После регистрации на хостинге, первым делом создадим FTP аккаунт и новую базу данных MySQL.
4.2 Для работы с БД воспользуемся специальной средой phpMyAdmin. В папке SQL лежит файл lesson1.sql - это дамп базы данных, откроем его программой Notepad ++ и скопируем содержимое. В phpMyAdmin войдем в нашу базу -> вкладка SQL (выполнение SQL запросов) и вставим туда наш дамп. Таблица user успешно создана, в нее мы будем записывать имя, пароль и количество очков игрока.
4.2 Для работы с БД воспользуемся специальной средой phpMyAdmin. В папке SQL лежит файл lesson1.sql - это дамп базы данных, откроем его программой Notepad ++ и скопируем содержимое. В phpMyAdmin войдем в нашу базу -> вкладка SQL (выполнение SQL запросов) и вставим туда наш дамп. Таблица user успешно создана, в нее мы будем записывать имя, пароль и количество очков игрока.
5. Эвенты.
Изображение
Описание
5.1 Для начала назовем константы: name - имя участника, также будет использоваться для вывода ошибок авторизации и регистрации, stage - уровень игры, будет использоваться в формуле определяющей сложность игры, score - очки игрока, teror - количество врагов на уровне, увеличивающееся с каждым уровнем, resp - время спавна врагов и заложников, killteror - количество убитых врагов, girl - количество, скажем так, заложников, killgirl - количество убитых заложников, timer - определяет время, через которое враги начнут стрелять, diff - сложность игры, формирует время спавна врагов, patron - количество патронов в обойме.
5.2 Системные эвенты. Тут ничего сложного, прелоад музыкального сопровождения, установка спрайта на курсор. Выполним условие, если слой Record видимый, то выполним AJAX запрос к файлу record.php, для выборки лучших игроков. Также обозначим константы, которые обновляются в начале игры. Если слой Menu - видимый, то перенесем кнопку входа со слоя Record на Menu и оформим наши текстовые поля. Проверим не авторизован ли наш участник, если да то слой Menu делаем невидимым и переходим к игре. Если из видимых слоев только Ground, то обозначим константы, которые обновляются в начале уровня и заполним текстовые поля с номером раунда и количеством очков. Далее начнем игру, будем спавнить врагов и заложников, таймаут спавна расчитаем по формуле - resp/diff (с 1 по 30 уровень спавн будет через 1 секунду, далее время задержки будет уменьшаться). Также с каждым созданным врагом будем включать его таймер (поведение объекта ter). Если игрок не успеет уничтожить врага, до окончания таймера, то враг застрелит игрока. Заложники спавнятся заметно реже, расчитываем по формуле - resp/diff*5 и через 4 секунды после создания самоуничтожаются. Теперь нам нужно указать условия прохождения или окончания раунда. Если убитых заложников больше 2 или таймер закончил свое действие, отправляем POST запрос файлу death.php. Расстрел игрока оформим звуковым сопровождением и анимацией выстрелов. Если все враги и заложники раунда созданы, завершаем раунд, переходим на следующий - stage = stage + 1.
5.3 Теперь распишем эвенты управления. При любом клике мыши и при условии, что таймер перезарядки не работает, убираем один патрон и создаем звук выстрела. Кроме того в суб эвентах укажем объекты, с которыми будет взаимодействовать наш выстрел. Отметим смену видимости слоев при нажатии на кнопку входа, а также запустим анимацию ее нажатия. Если слой Menu видимый, то при нажатии на кнопку отправим AJAX запрос файлу enter.php. При нажатии на врага, выполним анимацию кровотечения, уничтожим врага и приплюсуем его к уже убитым в этом раунде. Также добавим очки за убийство. При выстреле в заложника, напротив снимем двойное количество очков. Выполним анимацию следа от выстрела при нажатии на стену. Далее следует условие перезарядки. Если в магазине патронов < 1 или нажата кнопка gun, то запустим таймер перезарядки, заполним магазин и включим звуковое сопровождение.
5.4 Теперь немного об AJAX. Любой сделанный нами запрос к php скрипту нужно проверить на completed и error. Если запрос Enter успешно прошел, то проверим, что нам вернул скрипт. Если пришел результат "НЕТ ИМЕНИ" или "ИМЯ ЗАНЯТО", то выведем текст указывающий об ошибке и обновим нашу сцену. Если пришел ответ с именем участника, исполльзуем его для приветствия и начнем игру, сделав слой Menu невидимым. В данном уроке использовано AJAX.LastData, т.е. последнее, что выводил скрипт. Знак |, который мы использовали при выборке лучших игроков заменим на перенос строки newline, с помощью функции replace. В случае ошибок обновим сцену. После выполнения запроса Death делаем слой Record видимым и переходим в начало проекта.
5.2 Системные эвенты. Тут ничего сложного, прелоад музыкального сопровождения, установка спрайта на курсор. Выполним условие, если слой Record видимый, то выполним AJAX запрос к файлу record.php, для выборки лучших игроков. Также обозначим константы, которые обновляются в начале игры. Если слой Menu - видимый, то перенесем кнопку входа со слоя Record на Menu и оформим наши текстовые поля. Проверим не авторизован ли наш участник, если да то слой Menu делаем невидимым и переходим к игре. Если из видимых слоев только Ground, то обозначим константы, которые обновляются в начале уровня и заполним текстовые поля с номером раунда и количеством очков. Далее начнем игру, будем спавнить врагов и заложников, таймаут спавна расчитаем по формуле - resp/diff (с 1 по 30 уровень спавн будет через 1 секунду, далее время задержки будет уменьшаться). Также с каждым созданным врагом будем включать его таймер (поведение объекта ter). Если игрок не успеет уничтожить врага, до окончания таймера, то враг застрелит игрока. Заложники спавнятся заметно реже, расчитываем по формуле - resp/diff*5 и через 4 секунды после создания самоуничтожаются. Теперь нам нужно указать условия прохождения или окончания раунда. Если убитых заложников больше 2 или таймер закончил свое действие, отправляем POST запрос файлу death.php. Расстрел игрока оформим звуковым сопровождением и анимацией выстрелов. Если все враги и заложники раунда созданы, завершаем раунд, переходим на следующий - stage = stage + 1.
5.3 Теперь распишем эвенты управления. При любом клике мыши и при условии, что таймер перезарядки не работает, убираем один патрон и создаем звук выстрела. Кроме того в суб эвентах укажем объекты, с которыми будет взаимодействовать наш выстрел. Отметим смену видимости слоев при нажатии на кнопку входа, а также запустим анимацию ее нажатия. Если слой Menu видимый, то при нажатии на кнопку отправим AJAX запрос файлу enter.php. При нажатии на врага, выполним анимацию кровотечения, уничтожим врага и приплюсуем его к уже убитым в этом раунде. Также добавим очки за убийство. При выстреле в заложника, напротив снимем двойное количество очков. Выполним анимацию следа от выстрела при нажатии на стену. Далее следует условие перезарядки. Если в магазине патронов < 1 или нажата кнопка gun, то запустим таймер перезарядки, заполним магазин и включим звуковое сопровождение.
5.4 Теперь немного об AJAX. Любой сделанный нами запрос к php скрипту нужно проверить на completed и error. Если запрос Enter успешно прошел, то проверим, что нам вернул скрипт. Если пришел результат "НЕТ ИМЕНИ" или "ИМЯ ЗАНЯТО", то выведем текст указывающий об ошибке и обновим нашу сцену. Если пришел ответ с именем участника, исполльзуем его для приветствия и начнем игру, сделав слой Menu невидимым. В данном уроке использовано AJAX.LastData, т.е. последнее, что выводил скрипт. Знак |, который мы использовали при выборке лучших игроков заменим на перенос строки newline, с помощью функции replace. В случае ошибок обновим сцену. После выполнения запроса Death делаем слой Record видимым и переходим в начало проекта.
В браузере проект выглядит неплохо, без лишних тормозов и подгрузок. В принципе для учебного проекта считаю работу законченной. Работа над уроком заняла 4 часа, 1 час - создание проекта, 3 часа - оформление теории. Если у кого возникли вопросы или предложения, просьба писать в л.с. Ждите новых уроков. Для вас работал KrashtreaT - SSP.
Фонд: