Сегодня заставим двигаться прямоугольник по экрану.
Для этого познакомимся с простейшим циклом и переменными.
В прошлый раз у нас был неподвижный прямоугольник, что бы заставить его двигаться, нужно несколько раз в секунду перерисовывать его.
На скрине видна знакомая нам функция box(), рисующая прямоугольник и функция frame(), обновляющая экран. В функцию frame() мы не передавали параметра задержки, поэтому задержки не происходит и после обновления экрана сразу выполняется следующая команда - goto.
Это команда безусловного перехода, если перевести по русски, то получается "перейти к". После этой команды пишется название метки, на которую надо перейти. В нашем случае - перейти к метке aaa.
Что бы обозначить метку в коде, нужно придумать ей имя, записать в нужном месте кода и после неё поставить двоеточие. Теперь можно перепрыгивать на неё из любого места в коде. Команд перехода на метку может быть много, а метка с заданным именем только одна.
Здесь сразу хочу предупредить, что команда goto пользуется недоброй славой, так как обилие переходов в коде делает код плохо читаемым и профессиональные программисты избегают использования этой команды.
Но для небольших проектов она удобна, интуитивно понятна и я ей постоянно пользуюсь.
Если запустить этот код, то мы опять увидим жёлтый прямоугольник, который стоит на месте, но зато обновляется много раз в секунду.
Что бы заставить его двигаться, нужно в каждом цикле менять координаты прямоугольника. Для этого нам понадобятся переменные.
Переменные.
Переменная - это выделенная "ячейка" памяти, для которой мы сами придумываем имя. Используя это имя, мы можем менять значение, записанное в переменной, также можем передавать это имя как ссылку в качестве параметров для функции и использовать имя переменной в разных формулах.
Считается хорошим тоном давать переменным имена, что бы сразу было понятно, для чего она используется. Для переменных , где будут храниться координаты x и y прямоугольника, я придумал имена Xcoord и Ycoord .
В Pixilang, для создание переменной, достаточно написать её имя и через символ "=" присвоить ей значение, что я и сделал во 2 и 3 строчках кода.
Дальше я функцией box() нарисовал красный квадрат, который нам ещё пригодится. Затем начинается цикл.
В цикле я каждый ход изменяю значение переменных Xcoord и Ycoord на единицу. Делается это очень просто. Я пишу имя переменной, ставлю символ "=" , показывающий компьютеру, что собираюсь присвоить переменной новое значение и записываю новое значение. Новое значение в данном случае вычисляется как текущее значение + 1
Xcoord = Xcoord + 1
Ycoord = Ycoord + 1
Далее мы в функцию box() в качестве координат передаем не фактическое значение, а имена переменных
box( Xcoord, Ycoord, 20, 20, YELLOW )
Сохраняем файл, открываем Pixilang и запускаем полученный скрипт.
Получаем вот такую картину.
Прямоугольник начал перемещаться, но его старое изображение никуда не исчезло. Чтобы устранить этот эффект, самый простой здесь вариант - рисовать черный прямоугольник поверх старого.
Добавляем в код функцию box(), рисующую чёрный прямоугольник ( строчка 6 ). Заметьте, что сделал я это до того, как изменил значения переменных.
Здесь я добавил в коде новый элемент - комментарии.
Если поставить два символа "//" , то до конца строки можно писать свои заметки, они игнорируются при выполнении и служат для пояснений, что бы проще было в последствии разобраться в коде.
Если нужно закомментировать несколько строк, то нужно перед ними поставить "/*", а по окончанию "*/".
Запускаем скрипт на выполнение и видим такую картину
Прямоугольник движется, след не оставляет, пробивает красный прямоугольник и уплывает за пределы экрана.
Теперь наша задача, заставить прямоугольник отскакивать от стенок красного прямоугольника. Для этого нам понадобится выполнение условий. Об этом в следующей статье.