Элементы управления. Клавиатура.
Элементы управления. Клавиатура.
Подготовительный этап:
- Зайти на цифровой образовательный ресурс по изучению языка программирования Javascript: https://www.khanacademy.org/computer-programming/new/pjs;
- В разделе эмулятора языка программирования Javascript перейти на вкладку: Dokumentation;
- В блоке Keyboard обратить внимание на keyCode и активировать его;
- Открыть текст с кодом (программой) из домашнего задания прошлого урока. Выделить, скопировать весь текст кода и вставить в пространство "Редактор кода" новой программы.
***** ***** *****
Образовательный ресурс KHANACADEMY, в качестве примера использования кнопочного функционала манипулятора, предлагает код (программу):
var draw = function() {
background(0, 0, 0);
if (keyIsPressed && keyCode === UP) {
fill(255, 0, 0);}
else {fill(255, 255, 255);}
ellipse(100,100,100,100);
};
Данный код (программа) позволяет, используя конкретную клавишу клавиатуры изменить свойство заливки окружности с белого на красный цвет.
Не будем останавливаться на уже знакомые нам элементы кода, а рассмотрим как прописано условие оператора ветвления:
(keyIsPressed && keyCode === UP)
keyIsPressed - представляет собой запись логической системной переменной, которая имеет значение true, если нажата клавиша клавиатуры и false, если не нажата.
&& представляет собой логический оператор "И", объединяющий две логические системные переменные. // Для операций над логическими значениями в JavaScript есть ||
(ИЛИ - логическое сложение), &&
(И - логическое умножение) и ! (НЕ - инверсия).
keyCode === UP - представляет собой запись логической системной переменной конкретной кнопки клавиатуры, которую можно идентифицировать как клавиша "стрелка вверх" и имеет значение true, если нажата именно эта кнопка клавиатуры и false, если эта кнопка не нажата. При этом UP можно заменить на числовой код для данной клавиши - 38.
Числовые коды клавишам клавиатуры можно просмотреть используя онлайн ресурс - http://keycode.info/
Практическое задание.
- Открыть загруженную в начале урока страницу с кодом вашего домашнего задания;
- Внести следующие изменение в код (программу):
-
- задать переменную для "динамического" изменения координаты Х;
- добавить элементы ветвления для проверки нажатия клавиш клавиатуры;
- создать "динамическое" изменение координаты положения объекта по горизонтали в левую и правую сторону (согласно нажатию клавиш клавиатуры);
- проверить синтаксис и запустить код (программу).
Если у вас при нажатии соответствующих клавиш клавиатуры объект начинает движение в левую или в правую стороны, то вы всё сделали правильно. Молодцы! Иначе, внимательно просмотрите добавленные элементы кода, обращая внимание на принцип увеличения (уменьшения) координатной переменной по горизонтали.