Найти тему
ТехноШаман

Pixilang. Урок 2. Переменные.

Сегодня заставим двигаться прямоугольник по экрану.

Для этого познакомимся с простейшим циклом и переменными.

В прошлый раз у нас был неподвижный прямоугольник, что бы заставить его двигаться, нужно несколько раз в секунду перерисовывать его.

На скрине видна знакомая нам функция box(), рисующая прямоугольник и функция frame(), обновляющая экран. В функцию frame() мы не передавали параметра задержки, поэтому задержки не происходит и после обновления экрана сразу выполняется следующая команда - goto.

Это команда безусловного перехода, если перевести по русски, то получается "перейти к". После этой команды пишется название метки, на которую надо перейти. В нашем случае - перейти к метке aaa.

Что бы обозначить метку в коде, нужно придумать ей имя, записать в нужном месте кода и после неё поставить двоеточие. Теперь можно перепрыгивать на неё из любого места в коде. Команд перехода на метку может быть много, а метка с заданным именем только одна.

Здесь сразу хочу предупредить, что команда goto пользуется недоброй славой, так как обилие переходов в коде делает код плохо читаемым и профессиональные программисты избегают использования этой команды.
Но для небольших проектов она удобна, интуитивно понятна и я ей постоянно пользуюсь.

Если запустить этот код, то мы опять увидим жёлтый прямоугольник, который стоит на месте, но зато обновляется много раз в секунду.
Что бы заставить его двигаться, нужно в каждом цикле менять координаты прямоугольника. Для этого нам понадобятся
переменные.

Переменные.

Переменная - это выделенная "ячейка" памяти, для которой мы сами придумываем имя. Используя это имя, мы можем менять значение, записанное в переменной, также можем передавать это имя как ссылку в качестве параметров для функции и использовать имя переменной в разных формулах.

Считается хорошим тоном давать переменным имена, что бы сразу было понятно, для чего она используется. Для переменных , где будут храниться координаты x и y прямоугольника, я придумал имена Xcoord и Ycoord .

В Pixilang, для создание переменной, достаточно написать её имя и через символ "=" присвоить ей значение, что я и сделал во 2 и 3 строчках кода.

-2

Дальше я функцией box() нарисовал красный квадрат, который нам ещё пригодится. Затем начинается цикл.

В цикле я каждый ход изменяю значение переменных Xcoord и Ycoord на единицу. Делается это очень просто. Я пишу имя переменной, ставлю символ "=" , показывающий компьютеру, что собираюсь присвоить переменной новое значение и записываю новое значение. Новое значение в данном случае вычисляется как текущее значение + 1

Xcoord = Xcoord + 1
Ycoord = Ycoord + 1

Далее мы в функцию box() в качестве координат передаем не фактическое значение, а имена переменных

box( Xcoord, Ycoord, 20, 20, YELLOW )

Сохраняем файл, открываем Pixilang и запускаем полученный скрипт.
Получаем вот такую картину.

-3

Прямоугольник начал перемещаться, но его старое изображение никуда не исчезло. Чтобы устранить этот эффект, самый простой здесь вариант - рисовать черный прямоугольник поверх старого.

-4

Добавляем в код функцию box(), рисующую чёрный прямоугольник ( строчка 6 ). Заметьте, что сделал я это до того, как изменил значения переменных.

Здесь я добавил в коде новый элемент - комментарии.
Если поставить два символа "
//" , то до конца строки можно писать свои заметки, они игнорируются при выполнении и служат для пояснений, что бы проще было в последствии разобраться в коде.

Если нужно закомментировать несколько строк, то нужно перед ними поставить "/*", а по окончанию "*/".

Запускаем скрипт на выполнение и видим такую картину

-5

Прямоугольник движется, след не оставляет, пробивает красный прямоугольник и уплывает за пределы экрана.

Теперь наша задача, заставить прямоугольник отскакивать от стенок красного прямоугольника. Для этого нам понадобится выполнение условий. Об этом в следующей статье.