Processing 1.0.9

[Chip]

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

import processing.serial.*;  
Serial port; 
int x,y,x1,y1,w,h;
boolean stat0,stat1;
PImage bs,dw;

void setup()
{
  port = new Serial(this, "COM7", 115200); // Прописываем COM-порт на котором у вас сидит Carduino
  
  size(290, 200);           //размер окна
  background(60, 80, 90);   //цвет окна
  
  bs = loadImage("base.png"); //загрузить изображение кнопки
  dw = loadImage("down.png"); //загрузить изображение нажатой кнопки
  w = bs.width;           // Размер кнопки по горизонтали
  h = bs.height;         // Размер кнопки по вертикали
  x = 20;      // Х начальная координата кнопки 
  y = 20;     // y начальная координата кнопки
  x1= x;
  y1= h+40; 
  image(bs, x, y);      // Нарисовать в окне первую кнопку
  image(bs, x1, y1);      // Нарисовать в окне вторую кнопку
  
  port.write('1');
  port.write('0');
}

void draw()
{  
  if( mousePressed)
   {  
     if ( mouseX >= x && mouseX <= x + w && mouseY >= y && mouseY <= y + h) //отслеживаем область курсора 
     {  
      stat0=!stat0;              
      if (stat0) {port.write('1'); image(dw, x+1, y+1); } // послать =1 в Carduino нарисовать нажатую кноку  
      if (!stat0) {port.write('0'); image(bs, x, y);}      //   послать =0 в Carduino нарисовать кноку 
     }
      if (mouseX >= x1 && mouseX <= x1 + w && mouseY >= y1 && mouseY <= y1 + h) //отслеживаем область курсора
     {  
      stat1=!stat1;              
      if (stat1) {port.write('3'); image(dw, x1+1, y1+1); } // послать =1 в Carduino нарисовать нажатую кноку  
      if (!stat1) {port.write('2'); image(bs, x1, y1);}      //   послать =0 в Carduino нарисовать кноку 
     } 
     delay(200); 
   }  
}