6.7. Создаем компьютерное приложение

В конце концов, вам надоест "общение" с платой Arduino через монитор последовательного порта Arduino IDE. Гораздо удобнее работать с приложением, написанным на каком-либо языке программирования, имеющем библиотеки для обмена по последовательному порту. Вы можете использовать ваш любимый язык программирования для написания программы, которая посылает последовательные команды к плате Arduino и получает данные, передаваемые от Arduino к компьютеру.

В этой книге выбран язык программирования Processing, потому что он очень похож на язык Arduino, с которым вы уже знакомы. На самом деле, язык программирования Arduino основан на Processing! Другие популярные языки программирования, для которых существуют обширные библиотеки для работы с последовательным портом, - Python, РНР, Visual Basic, С и т. п. Сначала выясним, как читать передаваемые последовательные данные в Processing, а затем узнаем, как с его помощью создать простой графический интерфейс пользователя (GUI) для отправки команд на плату Arduino.

6.7.1. Интерфейс Processing

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

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

6.7.2. Установка Processing

Сначала необходимо установить Processing на вашей машине. Делается это так же, как и в главе 1, когда устанавливали Arduino IDE. Зайдите на страницу

http://processing.org/download/ (или найдите ссылку на скачивание на www.exploringarduino.com) и скачайте заархивированный пакет в соответствии с вашей операционной системой. Затем распакуйте его и программа будет готова к работе!

Запустите Processing, и вы должны увидеть окно программы, которое выглядит как на рис. 6.12.

6.7.3. Плата Arduino управляет приложением на Processing

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

- 137 -

Рис. 6.12. Графический интерфейс Processing. Узнаете?

Скопируйте код из листинга 6.6 и загрузите его на плату Arduino. Arduino посылает обновленное значение от потенциометра в последовательный порт компьютера каждые 50 мс. Если отправлять данные быстрее, приложение на Processing не будет успевать их обрабатывать и буфер последовательного порта на вашем компьютере переполнится.

Листинг 6.6. Программа для отправки даных в компьютер - pot_to_processing/arduino_read_pot

// Отправка данных от потенциометра на компьютер

const int POT=0;// Подключение потенциометра к выводу A0

int val;// Переменная для хранения значения потенциометра

void setup()

{

Serial.begin(9600); // Инициализация последовательного порта

// на скорости 9600

}

void loop()

{

- 138 -

val = map(analogRead(POT), 0, 1023, 0, 255);//Чтение значения потенциометра

Serial.println(val);//Отправка значения

delay(50);//Задержка 50 мс

}

Теперь напишем код для обработки входящих данных.

Программа из листинга 6.7 считывает данные из буфера последовательного порта и регулирует яркость цвета на экране вашего компьютера в зависимости от полученного значения. Скопируйте листинг 6.7 и внесите одно важное изменение. В программе на Processing должен быть указан конкретный последовательный порт получения данных. Замените "COM3" на номер вашего последовательного порта. Помните, что в Linux и Mac он будет выглядеть примерно как /dev/ttyUSBO. Если вы не уверены, скопируйте точное название порта из Arduino IDE.

Листинг 6.7. Код Processing для получения данных и изменения цвета экрана - pot_to_processing/processing_display_color

// Программа на Processing для чтения переменной и изменения цвета экрана

// Подключение и инициализация библиотеки Serial

import processing.serial.*;

Serial port;

float brightness = 0; // Переменная Для хранения значения потенциометра

void setup()

{

// Размер окна

size(500,500);

port = new Serial(this, "COM3", 9600); // Инициализация

// последовательного порта

port.bufferUntil(' ');// Символ конца строки

}

void draw()

{

background(0,0,brightness);

}

// Перерисовать окно

void serialEvent(Serial port)

{

brightness = float(port.readStringUntil(' ')); // Получить переменную

}

После загрузки кода в Processing IDE и правильной инициализации последовательного порта убедитесь, что монитор последовательного порта Arduino IDE не открыт. К конкретному последовательному порту может иметь доступ только одна программа на компьютере. В окне Processing-приложения нажмите кнопку Выпол

- 139 -

нить (кнопка с изображением треугольника в верхнем левом углу окна), при этом должно появиться небольшое окно. При повороте движка потенциометра цвет окна должен меняться от черного к синему (рис. 6.13).

Рис. 6.13. Изменение цвета окна Processing-приложения

Теперь, когда вы видели результат, для лучшего понимания рассмотрим, как это работает. В отличие от Arduino, библиотека serial не импортируется автоматически. Объявив import processing. serial. * и Serial port, вы импортируете библиотеку serial и создаете объект serial под названием port.

Как и в Arduino, в Processing тоже есть функция setup(), которая работает только в начале программы. В этом примере функция setup() задает последовательный порт и создает окно размером 500x500 пикселов командой size (500, 500). Команда port = new Serial (this, "COM3", 9600) сообщает Processing о создании экземпляра последовательного порта. Экземпляр (под названием port) будет работать и общаться на COM3 (или другом последовательном порту) со скоростью 9600 бод.

Скорость обмена данными между платой Arduino и программой на компьютере должна быть задана одинаковой, в противном случае возникнут ошибки. Команда port.bufferuntil ( ' ') сообщает Processing-приложению о буферизации последовательного ввода до получения символа новой строки (' ' ).

Вместо loop() в Processing есть другие специальные функции. В нашем примере использованы функции draw() и serialEvent(). Функция draw() похожа на loop() в Arduino, она работает непрерывно и обновляет экран. Функция background() задает цвет окна, имеет три аргумента для установки значений красного, зеленого и синего компонентов цвета. В нашем примере значение с потенциометра управляет интенсивностью синего компонента, а красный и зеленый установлены в нуль. При желании программу можно переделать, чтобы регулировать интенсивность других компонентов. Поскольку интенсивности RGB цветов являются 8-битовыми значениями от 0 до 255, значения потенциометра масштабируются функцией map() перед передачей.

Функция serialEvent() вызывается всякий раз, когда выполняется условие bufferuntil(), указанное в функции setup(). При каждом появлении символа пере

- 140 -

вода строки срабатывает функция serialEvent(). Передаваемые данные считываются в виде строки с помощью port. readStringUntil ( ' ' ). Строка представляет собой последовательность символов и ее необходимо преобразовать в число с плавающей точкой, вызвав функцию float(). Результат присваивается переменной brigthness, определяющей цвет фона окна приложения.

Чтобы остановить программу и закрыть последовательный порт, нажмите кнопку Стоп в окне Processing-приложения (это квадратик, расположенный рядом с кнопкой Выполнить).

ПРИМЕЧАНИЕ

SudoGlove - это перчатка-манипулятор для передачи команд на радиоуправляемый автомобиль и другую аппаратуру. Я разработал на Processing дисплей для графического отображения значений датчиков, удобный при отладке SudoGlove. Больше узнать об этом можно на www.sudoglove.com. Скачать исходный код приложения можно по адресу www.jeremyblum.com/2011/03/25/processing-based-sudoglove-visualdebugger/. Этот исходный код есть также на сайте издательства Wiley.

6.7.4. Отправка данных из Processing-приложения в Arduino

Следующий шаг - передать данные из Processing-приложения на плату Arduino.

Подсоедините RGB-светодиод к плате Arduino, как показано на рис. 6.11, и загрузите в нее программу считывания строки из трех значений, разделенных запятыми для установки красной, зеленой и синей интенсивности (см. листинг 6.5). Теперь сделаем так, чтобы вместо отправки трехсимвольной строки из последовательного монитора можно было выбрать цвет, используя палитру цветов.

Загрузите и запустите код из листинга 6.8 в Processing-приложении, не забыв установить свое значение для последовательного порта, как в предыдущем примере.

Сопутствующие файлы из папки данных ( data) будут загружены автоматически.

Файл hsv.jpg (изображение для выбора цвета) есть среди электронных ресурсов к этой главе. Скачайте и поместите его в папку data в том же каталоге, что и программа. Processing-приложение по умолчанию сохраняет файлы проекта в папке Мои документы. Структура папки проекта показана на рис. 6.14.

Листинг 6.8. Processing-приложение для установки цвета RGB-светодиода - processing_control_rgb/processing_control_RGB

import processing.serial.*;// Подключение библиотеки serial

PImage img;

Serial port;

void setup()

{

size(640,256);

img = loadimage("hsv.jpg");// Загрузка фоновой картинки

- 141 -

port=new Serial(this, "СОМ9", 9600); // Открыть последовательный

// порт

}

void draw()

{

background(0);// Цвет фона

image(img,0,0);// Изображение

}

void mousePressed()

{

color с=get(mouseX, mouseY); // Получить RGB-цвет по позиции

// курсора мыши

String colors=int(red(c))+","+int(green(c))+","+int(blue(c))+" ";

// Сформировать строку значений цвета

print(colors);// Вывод для отладки

port.write(colors);// Отправка переменной в Arduino

}

Рис. 6.14. Структура папки проекта

При запуске программы вы увидите всплывающее окно, показанное на рис. 6.15.

Укажите желаемый оттенок, и его значения RGB будут переданы в плату Arduino для управления цветом RGB-светодиода. Команды, отправляемые в Arduino, выводятся также в монитор последовательного порта, чтобы облегчить отладку приложения.

- 142 -

Рис. 6.15. Экран выбора цвета в Processing

Теперь посмотрим на код программы и проанализируем, как он работает. Как и раньше, импортируется библиотека serial и создается объект port. Создается также объект Pimage с именем img. Он будет формировать фоновое изображение.

В процедуре setup() инициализируется последовательный порт, создается окно в размер изображения, а само изображение импортируется в объект img вызовом функции img=LoadImage ( "hsv. jpg").

В функции draw() изображение загружается в окно командой image ( img, о, о) с двумя аргументами: Img - само изображение, а о, о - координаты для размещения изображения (верхний левый угол окна приложения).

При нажатии кнопки мыши вызывается функция mousePressed(). Цвет пиксела, где вы щелкнули мышью, сохраняется в объекте color с именем с. Метод get() сообщает приложению, откуда можно получить цвет (в данном случае из координат курсора мыши). Затем преобразуем значение в строку, состоящую из целых значений красного, зеленого и синего компонентов цвета. Эти значения также выводятся в монитор последовательного порта.

Включите плату Arduino и загрузите в нее код из листинга 6.5. Запустите Processing-приложение и настройте цвет светодиода, подключенного к Arduino, выбирая цвет из палитры.

- 143 -