Язык processing для начинающих

Processing

Хотелось ли вам сделать свою игру? А управлять собственной игрой с собственного джойстика?

Если да, то вы по адресу!

Что такое Processing?

Processing – это язык программирования, основанный на Java. С помощью него легко можно “оживить” показания датчиков, а из скучных цифр устроить красочную анимацию.

Кстати, Arduino IDE написана на Processing.

Я не буду рассказывать об основах Processing. Если станет интересно – на сайте processing.org есть обучающие видео от Даниэля Шиффмана. Одна загвоздка – они на английском. Если языковой барьер мешает изучать Processing, то можно поискать в интернете обучающие видео. На helloprocessing.ru есть перевод уроков Шиффмана к часу кода.

Поехали!

Так как Processing не предназначен для создания игр, от сложных проектов придется отказаться.

А вот небольшую игру из 90ых накодить – пожалуйста.

Этой игрой будет Арканоид. Если кто не помнит или не знает, Арканоид – это игра, цель которой сбить шариком все кирпичи сверху и при этом не дать мячу упасть ниже платформы.

Управлять платформой мы будем с джойстика. А играть будем на экране компьютера.
Примечание: В одном из последующих уроков джойстик станет беспроводным.

Начнем с необходимых сегодня компонентов. Их немного:

Схема джойстика

Готовый джойстик

Сейчас нужно подумать, как же связать Arduino и компьютер. Для этого и существует Serial port. Помните – мы использовали Serial monitor в Arduino IDE для просмотра показаний с датчиков? Теперь с помощью передачи данных с джойстика в Serial мы сможем управлять платформой. Осталось разобраться с тем, каким образом мы будем это делать.

Алгоритм

Джойстик и Serial

Открываем Arduino IDE и пишем код.

Протокол?

Возможности Serial port ограничены передачей только одного показания, а показаний то у нас целых три – ось Х, ось Y и кнопка. Для этого и нужны протоколы связи. Что такое протокол?

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

Так и с устройствами. Они не могут понимать друг друга без протокола связи. Он устанавливает правила общения между устройствами и позволяет им понимать друг друга. Если хочется более полного и “мудреного” объяснения загляните в Википедию.

Вернемся к скетчу. Данные с джойстика отправляются в виде:

ОсьY, ОсьX, Кнопка *Переход на другую строку*

Это и есть наш протокол. Осталось научить Processing его распознавать.

Processing

Теперь нужно открыть Processing.

Начнем с “дешифровки” нашего протокола.

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

Игра

Теперь можно начинать делать игру. Так как код достаточно большой, я не буду писать его. Код можно найти в прикрепленных файлах под именем Game.pde.

Пояснения

Структура игры состоит из методов или функций, которые взаимодействуя друг с другом, создают игру. А метод draw выводит на экран картинку производимых действий.

Так как Processing не предназначен для создания игр, в нем нет функции о соприкосновении объектов друг с другом, поэтому пришлось определять момент столкновения по координатам, что несколько сложнее.

Каждое действие должно подлежать описанию, а для того чтобы определить действия используются переменные, которые меняют свое значение в соответствии с выполняемым сейчас действием. К примеру – при запуске игры значение переменной start равно нулю, в это время на экране мы видим надпись “Press the button!”, а при нажатии кнопки, значение переменной start становится равным единице и начинается игра.

Итог

Ура! Получился Арканоид V1.0. Я собираюсь дальше улучшать его и привести к канонам настоящего Арканоида с бонусами и уровнями, с кирпичами и блоками.

Геймплей Арканоида можно посмотреть на видео.

Как вторая версия будет готова, обязательно поделюсь, а пока – можно двигаться дальше.

Источник

Processing. Урок 13. Ардуино

Привет! Можно ли связать приложение в компьютере и схему на основе Ардуино? Конечно, можно. Для этого даже существует специальный язык программирования Processing. Хотя данные между компьютером и платой передаются через последовательный порт, так что вы можете использовать любой язык поддерживающий работы через com порт.

Содержание

В этом уроке нам понадобятся класс и функции для работы с com портом. Для этого у нас уже были уроки. Посмотрите их если уже забыли или пропустили.

Последовательный порт. Урок 5. Ардуино

С помощью языка программирования Processing мы сможем создать приложение для windows, osx или linux и считывать данные с последовательного порта.

Для того, чтобы выполнить этот урок нам понадобиться.

Processing

Это открытый язык программирования, основанный на Java. Программа на Processing называется скетч так же как и в Ардуино. Ну и язык программирования Ардуино основан на Processing. Так что даже среда разработки выглядит одинаково.

Скачаем среду разработки на официальном сайте. http://processing.org

Устанавливать ее не нужно, можно сразу запустить.

Схема и программа Ардуино

Наша цель сегодня собрать схему на Ардуино. Передать данные от потенциометра. И считать данные в программе на компьютере.

Соберем простую схему с двумя потенциометрами. Подключим их к портам А0 и А1.

А на плату Ардуино загрузим простой скетч. Который считает данные из портов А0 и А1 и запишет их в последовательный порт.

const int POT0=0;
const int POT1=1;

void setup() <
Serial.begin(9600);
>

void loop() <
val0 = map(analogRead(POT0), 0, 1023, 0, 255);
val1 = map(analogRead(POT1), 0, 1023, 0, 255);

Serial.print(val0);
Serial.print(«.»);
Serial.println(val1);
delay(50);
>

Отправлять данные будем одной строкой. Но разделим один потенциометр от другого точкой. После записи данных со второго потенциометра отправим символ перевода строки.

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

Processing программа

Теперь осталось написать программу для считывания данных из com порта и их обработки. Откроем IDE processing и напишем простую программу.

Подключим класс для работы с последовательным портом и создадим объект port.

import processing.serial.*;
Serial port;

Объявим все необходимые переменные.

float dataFloat = 0;
int dataInt = 0;

String strData;
String[] listData = <"0","0">;

В функции setup() создадим окно программы размером 255 на 255 пикселей.

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

void setup() <
// Размер окна
size(255, 255);
port = new Serial(this, «COM5», 9600); // Инициализация
// последовательного порта
port.bufferUntil(‘\n’);// Символ конца строки
>

Чтобы разделить их по разным переменным, преобразуем float в string и разделим ее на элементы массива.

void serialEvent(Serial port) <
dataFloat = float(port.readStringUntil(‘\n’)); // Получить переменную
dataInt = int(dataFloat);

strData = str(dataFloat);
listData = split(strData, ‘.’);

println( listData[0] );
println( listData[1] );
>

Теперь осталось перерисовать окно программы. Для этого есть функция draw(). Она работает как цикл loop() в Ардуино. Постоянно выполняет код внутри функции. Передадим в нее переменные, которые мы вычислили из последовательного порта.

void draw() <
background(0, 0, dataFloat);
stroke(255);
line(float(listData[0]), float(listData[1]), mouseX, mouseY);
>

Полный текст программы

// код программы Processing
import processing.serial.*;
Serial port;

float dataFloat = 0;
int dataInt = 0;

String strData;
String[] listData = <"0","0">;

void setup() <
// Размер окна
size(255, 255);
port = new Serial(this, «COM5», 9600); // Инициализация
// последовательного порта
port.bufferUntil(‘\n’);// Символ конца строки
>

void draw() <
background(0, 0, dataFloat);
stroke(255);
line(float(listData[0]), float(listData[1]), mouseX, mouseY);
>

// Перерисовать окно
void serialEvent(Serial port) <
dataFloat = float(port.readStringUntil(‘\n’)); // Получить переменную
dataInt = int(dataFloat);

strData = str(dataFloat);
listData = split(strData, ‘.’);

println( listData[0] );
println( listData[1] );
>

В целом программа напоминает программу на Ардуино. Языки программирования очень похожи друг на друга.

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

Заключение

Мы рассмотрели использование языка программирования Processing. И написали простую программу для обмена данными между Ардуино и программой в компьютере. В следующий раз, наоборот, попробуем использовать приложение на компьютере для управления схемой на Ардуино.

Спасибо, что дочитали статью до конца.

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

Источник

Язык processing для начинающих

Здравствуйте, дорогие друзья! С сегодняшнего дня мы начинаем изучать взаимодействие платформы Arduino с программной средой Processing.

Данный раздел будет ориентирован на тех людей, которые никогда с данной средой не встречались, но хотят научить свой компьютер взаимодействовать с устройствами, созданных на Arduino.

Весь урок будет разбит на 6 частей:

Общая часть

Давайте же разберемся что такое Processing, как его настроить и запустить!

Processing — это открытый язык программирования, основанный на java с простым и понятным си-подобным синтаксисом. Представляет собой лёгкий и быстрый инструментарий для людей, которые хотят программировать изображения, анимацию и интерфейсы.

В принципе, также можно создавать даже 3D-аппликации (в том числе и игры), ведь processing имеет средства поддержки OpenGL. Все эти возможности, в совокупности с большим количеством функций и очень логичным синтаксисом, делают этот язык идеальным для обучения и прививания интереса к программированию.

Имеются инструменты для построения графических примитивов, 3D-объектов, работа со светом, текстом, инструментами трансформации. Также мы можем импортировать и эскпортировать файлы аудио/видео/звуковых форматов, обрабатывать события мыши/клавиатуры, работать со сторонними библиотеками (openGL, PDF, DXF), работать с сетью.

Как видите, этот язык очень богат разнообразными функциями и инструментами. Хотелось бы показать несколько примеров работы Arduino и Processing.

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

Теперь давайте познакомимся с данным языком подробнее. Для начала скачиваем среду разработки PDE (Processing Development Evironment) с официального сайта. Перейдя на сайт, нажимаем на кнопку Dowload Processing

Затем скачиваем, нажав на свою операционную систему

После того, как архив загрузился, распаковываем его в удобную папку. И из распакованной папки запускаем файл под названием processing.exe

Перед нами открывается вот такое окно:

Не правда ли знакомый интерфейс? А все потому, что среда для Arduino как раз основана на этой среде.

Также, как и в Arduino IDE, в Processing’е есть две основные функции:

Пример

Теперь давайте создадим простое устройство, чтобы понять сам принцип работы.

Нам нужны следующие компоненты:

Для начала собираем вот такую схему:

У меня получилось вот так:

Теперь открываем Arduino IDE и вставляем следующий скетч:

Подробно на этом останавливаться не будем, т.к. предполагается, что начав изучать графическую среду PDE, Вы уже изучили Arduino и понимаете смысл кода. Скажу только то, что в этом коде считывается значение с аналогового входа A0(potPin). И это значение записывается в цифровом диапазоне в переменную val. Которую затем мы отправляем в последовательный порт.

Теперь это значение нужно получить и обработать. Для этого заходим в PDE. И пишем следующий скетч:

Перед тем как запустить, давайте разберемся с кодом.

Теперь давайте запустим нашу программу. И посмотрим что у нас получилось.

Видео работы такого устройства:

Как Вы видите, все очень красиво и просто. Давайте же теперь перейдем к экспериментам.

Эксперимент 1

Давайте немного поэкспериментируем. Например, добавим еще два потенциометра, каждый из которых будет отвечать за свой цвет. А в окно программы добавим несколько квадратов, соответствующие потенциометрам, будем менять их цвет, изменяя значения сопротивлений резисторов. А также менять цвет фона.

Что нам нужно для эксперимента:

Собираем вот такую схему:

У меня получилось так:

Теперь надо изменить прошивку нашего Arduino. Для этого нужно вставить вот такой скетч в Arduino IDE:

Здесь, в принципе, все тоже самое что и в предыдущем скетче. Имеются три переменные, отвечающие за порт своего потенциометра (R,G,B). Мы считываем значение и отправляем. Но! На приемной стороне нам нужно понять, какое из значений соответствует какому цвету. Для этого разбиваем диапазон значений.

Например, для красного цвета, значения будут колебаться от 0 до 255. У зеленого цвета, от 256 до 511. И у синего от 512 до 767. Т.е на каждый цвет 256 значений.

Теперь открываем PDE и вставляем этот код:

Как Вы видите, в принципе все тоже самое. Но изменилось условие приема значений в функции serialEvent. Например. пришло значение. Записываем его в переменную val. Теперь, если это значение от 0 до 255, значит это пришло значение красного цвета. Записываем его в переменную R. Если приходят значения от 256 до 511, то программа понимает, что пришли значения зеленого цвета. Сопоставляет их с цифровым диапазоном, и записывает в переменную G. Тоже самое и с синим цветом.

Теперь, когда мы приняли значения красного, зеленого и синего цветов, нужно эти значения применить. Все это происходит в функции drow().

В общем весь принцип таков: имеются три квадрата, отвечающие за свой цвет. А фон окна зависит от суммы этих трех цветов.

Если запустить программу, то результат будет таков:

Эксперимент 2

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

Менять код Arduino мы не будем. Изменим только скетч Processing’a.

Как Вы видите, мы добавили 10 квадратов, разных размеров и цветов. Последний квадрат имеет самые маленькие размеры и его заливкой будет сумма всех цветов.

Давайте же посмотрим что у нас получилось:

Задание для самостоятельного выполнения

Заключение

Это был первый урок в разделе «Arduino и Processing». Надеемся, что урок был для Вас полезен и понятен. Также надеемся, что выполнение заданий не вызовет трудностей, и Вы справитесь самостоятельно. Если же возникнут вопросы или проблемы, задавайте их либо в комментариях, либо на форуме.

Если Вам понравился наш урок, поделитесь им с друзьями.

Источник

Поделиться с друзьями
admin
Оцените автора
( Пока оценок нет )
Как переводится?
Adblock
detector