5. Вновь UI

1.

Повтор
На прошлом уроке мы
⮚ Научились создавать бонусы
⮚ Добавили бонус для скорости
атаки
⮚ Добавили бонус дополнительного
орудия

2.

Сегодня на уроке…
⮚ Мы вспомним, как
добавлять UI элементы
⮚ Создадим необычное
начало для каждого уровня
⮚ Добавим кнопкиуправление для игрока
⮚ Научимся новому приёму
создания кнопок

3.

Помните ли вы, как
правильно настроить
канвас?
Создаём канвас, а
дальше?

4.

Далее, в окне инспектора у канваса
указываем
Render Mode
Screen Space – Camera
И перемещаем в появившееся окно
“Render Camera” камеру
Чтобы сделать размер канваса под
размер экрана

5.

И последним шагом
настраиваем компонент
Canvas Scaler, чтобы все UI
элементы автоматически
изменяли размер, в
зависимости от размера экрана

6.

Меню
Первое ваше задание – за 20
минут создать главное меню
и меню выбора уровней
Подберите подходящие
спрайты и подключите работу
всех кнопок

7.

Начало игры
Создали главное меню и
меню выбора уровней?
Давайте теперь перейдём
к первому игровому
уровню

8.

Начало игры
Сейчас при запуске игрового
уровня наш персонаж сразу
же отправляется в бой, а
игрок получает управление
над кораблём
Однако почему бы нам не
разнообразить игру
необычным стартом уровня?

9.

Начало игры
Давайте каждый уровень
будет начинаться с
небольшого текстового поля,
который будет
информировать игрока: кто
мы, в чём наша задача, или
может придумать сюжет для
своей игры?
Такое разнообразие пойдёт
только на пользу нашей
игре!

10.

Начало игры
Но, чтобы реализовать
данную систему, давайте для
начала сделаем так, чтобы в
начале игры наш персонаж
не будет никуда лететь до
тех пор, пока не нажмёт
соответствующую кнопку
«Начать игру»

11.

Кнопка «Начать
игру»
Для начала, создайте на
вашем игровом уровне
канвас, настройте его, а
также добавьте на него
кнопку «Начать игру»

12.

Далее, создайте скрипт,
назовите его StartLevel

13.

Для начала, мы получим доступ
к спавнеру врагов и к скрипту
GameSession (который
находится на нашем
Background (фоне)
В void Start(), или же в начале
игры мы отключаем спавнер,
чтобы до начала игры враги не
появлялись и в GameSession
выключаем движение фона

14.

Следующим шагом создаём
публичную функцию
StartGame(), которую позже
подключим к кнопке
Данная функция наоборот
будет включать спавнер врагов,
а также активирует движение
фона

15.

Передайте скрипт нашей
кнопке
Дайте значение переменным в
нашем компоненте
(перетаскиваем)
Спавнер врагов
Фон со cкриптом
GameSession

16.

Затем подключаем
функцию StartGame()
на нажатие кнопки
Перетаскивается сама
кнопка, или компонент с
кнопки

17.

Начало игры
Что-то всё же мы с вами
забыли…

18.

Начало игры
Что-то всё же мы с вами
забыли…
Мы не убрали с вами
кнопку при нажатии на
неё
Исправьте эту проблему
самостоятельно

19.

Самостоятельная работа
Перейдём к следующей части
урока. Создайте текстовое
описание вашего уровня
Внесите изменения в скрипт
StartLevel()
При нажатии на кнопку начала
игры, текст должен пропадать с
экрана
Ваших знаний более чем
предостаточно для выполнения
этого задания!

20.

Проверим вашу работу
Получаем доступ к
текстовому полю
Не забываем перетащить
текст в unity
Отключаем текстовое
поле при нажатии

21.

Начало игры
Также, давайте добавим
анимацию появления
текста, для того, чтобы
наша игра смотрелась
более серьёзной
Данное дополнение не
является обязательной
для реализации, но
остаётся желательной

22.

23.

Ставим скрипт
именно на сам
текст
Просто добавьте скрипт
на текстовое поле
Добавляем через
AddComponent, или
перетаскиваем скрипт в
объект

24.

Джойстик
Теперь давайте перейдём к
управлению
Для начала самостоятельно
добавьте на сцену уже
знакомый нам джойстик и
попытайтесь подключить его
к нашему кораблю

25.

Джойстик
Если ваш корабль также,
как и наш не способен
летать в одном
направлении, значит вы
реализовали перемещение
неверно
Что не удивительно, ведь
ранее мы добавляли
перемещение с
джойстиком только по
одной оси, а теперь у нас их
2

26.

Переменная для
джойстика
(Не забудьте
перетащить в Unity)
Для начала откройте скрипт
Move
Создайте переменную для
джойстика, а также для
удобства сверните условия
перемещения по клавишам

27.

В функцию Update() добавьте ещё 2
условия: одно для горизонтального
перемещения, одно для вертикального

28.

В функцию Update() добавьте ещё 2
условия: одно для горизонтального
перемещения, одно для вертикального
Умножая нашу скорость на положение джойстика мы
сделаем перемещение более плавным
(Т.к. при смещении джойстика его значения по
горизонтали и вертикали изменяются от 0 до 1

29.

Джойстик
Написали? Самое время
проверить перемещение
по джойстику
Не забудьте дать
значение новой
переменной joystick в
скрипте Move у нашего
игрока!
Перетащите в это поле джойстик со
сцены, а не сам скрипт

30.

Кнопка атаки
И в заключении
перейдём к кнопке атаки
Добавьте на сцену кнопку
для атаки
Подсказка: чтобы кнопка
не сильно мешалась на
экране, вы можете
сделать её
полупрозрачной

31.

Кнопка атаки
С подключением кнопки
атаки у нас также как и с
перемещением возникнут
сложности
Дело в том, что экранные
кнопки в Unity по
умолчанию настроены на
обработку нажатия
клавиш. А нам нужно
обрабатывать зажатие

32.

Создайте скрипт,
назовите его ButtonUI

33.

Подключен модуль
работы с событиями
(работа с кнопками)
Подключаем обработку нажатия и
отжатия кнопки
Создав переменную isPressed мы
переключаем её значение на true,
если кнопка была нажата и на
false, если кнопка была отжата
В данном коде используются
сложные приёмы, с которыми вы
ознакомитесь лучше при более
подробном изучении языка
программирования C#

34.

В этот раз в поле OnClick
будет пусто, так как вместо
этого поля будет работать
наш новый скрипт
Скрипт ButtonUI
Добавьте этот скрипт к
нашей кнопке атаки

35.

Скрипт проверки зажатия
кнопки готов
Теперь перейдём к скрипту
Shoot

36.

Получаем доступ к
скрипту ButtonUI у
нашей кнопки атаки
Теперь для стрельбы мы
сначала проверяем,
нажимаем ли мы пробел,
или зажали ли мы кнопку
атаки, и если хотя бы одно
из условий истинно, мы
проверяем, готова ли наша
пушка стрелять
Дополняем условие
стрельбы
Будьте внимательны
со скобками!!!

37.

Не забудьте дать значение
переменной attackButton
Проверьте, работает ли кнопка
атаки
Данная часть урока весьма
сложная, не бойтесь вернуться
назад и всё перепроверить

38.

Завершение урока