Библиотека радиолюбителя

Курс Arduino — Processing

Processing

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

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

Что такое Processing? 

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

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

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

Поехали!

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

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

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

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

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

  • Arduino UNO – для считывания показаний с джойстика и передачи их в Processing через Serial port.
  • Модуль Джойстик – для управления платформой.
  • Компьютер с установленными Arduino IDE и Processing .

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

  • Vcc – подключается к выводу в 5V
  • VER или X – подключается к A0
  • HOR или Y – подключается к А1
  • SEL или SW – подключается к 2
  • Gnd – подключается к земле

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

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

Алгоритм

  • Джойстик – пишем код на Arduino IDE, с помощью которого считываем показания с джойстика.
  • Serial – отправляем показания джойстика в Processing с помощью Serial.
  • Processing – обрабатываем поступившие показания и пишем код игры на Processing.

Джойстик и Serial

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

 #define axisX A0 //Ось Х джойстика, отвечающая за движение вверх и вниз #define axisY A1 //Ось Y джойстика, отвечающая за движение влево и вправо #define buttion 2 //Кнопка на джойстике  void setup()  {   //Обозначим оси как выходы...   pinMode(axisX, INPUT);   pinMode(axisY, INPUT);   //... а кнопку как выход с подтягивающим резистором   pinMode(buttion, INPUT_PULLUP);   //Установим соединение с Serial портом   Serial.begin(9600); }  void loop() {  //Переменные для передачи данных  int Y = analogRead(axisY);  int X = analogRead(axisX);  int B = digitalRead(buttion);   //Протокол передачи данных  Serial.print(Y);  Serial.print(",");  Serial.print(X);  Serial.print(",");  Serial.println(B); }

Протокол?

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

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

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

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

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

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

Processing

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

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

Код

 //Импортируем библиотеку для работы с Serial monitor  import processing.serial.*;  //Создаем объект класса Serial  Serial myPort;   //Создаем переменные для полученных показаний  int reset, axisX, axisY;  //Создаем переменную для размера шрифта  int fontSize = 36;  void setup() {   //Определяем размер окна      size(480, 480);      //Выводим список COM портов и берем тот,   //к которому подключен микроконтроллер   //У Windows обычно 1 порт, а у MAC - 0      println(Serial.list()) ;   String portName = Serial.list()[1];      //Открываем последовательный порт      myPort = new Serial(this, portName, 9600);      //Считываем приходящие данные, пока не дойдем до символа    //перевода строки      myPort.bufferUntil('n'); }  //Этот метод вызывается тогда, когда в буффер пришло  //значение перевода строки  void serialEvent(Serial myPort) {   //Считываем данные из буффера      String inputString = myPort.readStringUntil('n');      //Отбрасываем ненужные символы(возврат каретки и перевод строки)      inputString = trim(inputString);      //Разделяем полученную строку по запятым и задаем переменным   //нужные значения      int axises[] = int(split(inputString, ','));   if(axises.length == 3)   {     axisY = axises[0];     axisX = axises[1];     reset = axises[2];     } }  //Этот метод рисует показания датчиков на экране //В процессе дешифровки протокола участия не принимает  void draw() {   //Задаем цвет фона в кодировке rgb или html, если не задать - будет черный    background(#044f6f);     //Задаем цвет заполнения в кодировке rgb или html, если не задать - будт белый    fill (#ffffff);    //Создаем шрифт - его размер, стиль    PFont myFont = createFont(PFont.list () [2], fontSize);    //Задаем шрифт    textFont(myFont);    //Выводим показания датчиков на экран    text(axisY, width / 2, height/ 2);  text(axisX, width / 2, height / 2 + 40);  text(reset, width / 2, height / 2 - 40); }

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

Игра

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

Пояснения

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

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

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

Итог

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

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

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