Надеюсь, у вас уже установлен Pixilang и есть редактор для написания кода. Если нет, то смотри Урок 0. Сегодня разберём несколько простейших примеров. Буду исходить из предположения, что вы никогда не занимались программированием.
Система координат экрана Pixilang представлена на следующей картинке.
По горизонтали идёт ось Х, по вертикали ось Y. Оси пересекаются по центру экрана.
Точка по центру экрана имеет координату (0,0). Первое число - это координата по оси X, второе число - это координата по оси Y.
Ось X идёт слева направо, ось Y сверху вниз. Для примера я привёл несколько точек в виде синих крестиков с их координатами. Размер ячейки сетки - 10 пиксель.
Рисуем прямоугольник и линии
Открываем текстовой редактор и пишем код:
line(0,-40,0,40,BLUE)
line(-40,0,40,0,BLUE)
box(-10,-10,20,20,YELLOW)
frame(5000)
Сохраняем файл, открываем Pixilang и запускаем наш скрипт. Получаем на 5 секунд вот такую картинку.
Разберём, что мы написали.
line
Функция для рисования линии. После функции в скобках идут параметры функции. Их может быть у разных функций разное количество.
Для функции line идут параметры:
- X координата начала линии
- Y координата начала линии
- X координата конца линии
- Y координата конца линии
- Цвет линии
box
Функция для рисования прямоугольников.
Параметры функции.
- X координата верхнего левого угла прямоугольника
- Y координата верхнего левого угла прямоугольника
- ширина прямоугольника
- высота прямоугольника
- цвет прямоугольника
Попробовал изобразить это на рисунке :)
Почему получилось такое изображение. Здесь я проставил координаты точек.
frame
Вывести содержимое рабочего экрана на дисплей и подождать указанное количество миллисекунд. Если оставить скобочки пустые frame(), то задержки не будет. Мы формируем изображение на рабочем экране с помощью таких функций, как line( ), box( ), а уже потом выводим созданное изображение на дисплей с помощью функции frame().
Цвета
Для задания цвета в примере я использовал константы, уже "встроенные" в Pixilang. Их семь штук.
- ORANGE - оранжевый;
- BLACK - черный;
- WHITE - белый;
- YELLOW - желтый;
- RED - красный;
- GREEN - зеленый;
- BLUE - синий.
Обычно используется другой способ. Ставиться символ решётки и после этого идут числа в шестнадцатеричном виде.
общий формат такой: (здесь я заменил решётку на символ номера из за особенностей форматирования в Дзен)
№RRGGBB, где RR - яркость красного, GG - яркость зеленого; BB - яркость голубого.
Для тех, кто не знает, что такое шестнадцатеричное представление чисел, немного поясню. Используется не 10 цифр от 0 до 9, а 16 цифр, от 0 до F
0 1 2 3 4 5 6 7 8 9 A B C D E F
F равно 15 в десятичной системе, а
10 - равно 16 в десятичной системе. ( F + 1 = 10 )
Так как Дзен не даёт написать символ решётки, код будет в виде скрина.
Здесь я вместо функции box( ) использую функцию fbox(). Она делает то же самое, но прямоугольник становится закрашенным указанным в параметрах цветом.
В полученном результате первый прямоугольник имеет красный цвет.
Красный = FF, зелёный = 00, синий = 00. (смотри код)
То есть красная составляющая цвета максимальна и равна в десятичной системе 255. Зелёная и синяя составляющие равны 0.
Во втором и третьем прямоугольнике то же самое, один из цветов на максимуме, остальные равны 0.
В 4, 5 и 6 прямоугольниках на максимуме находятся по два цвета и получилось три варианта цвета, соответствующих цветам в струйном принтере.
В последнем прямоугольнике значения выставлены случайно.
На этом всё.
В следующем уроке будем двигать прямоугольник по экрану.