16. Interface and application programming

In this week we have to build an application that interfaces with an output or an input attached to our microcontroller. So for this job I chose to work with processing and Arduino IDE.

Processing App.

Processing is a flexible software sketchbook and a language for learning how to code within the context of the visual arts.

and to learn how to use it, I gave gone through this tutorial to understands the different aspects of the app. we connect the processing use interface with the Arduino IDE to be able to control the inputs and outputs with a graphic User Interface.

To start using processing I had to add ControlP5 Library. which is used to build a graphical user interface on top of your processing sketch include Sliders, Buttons, Toggles, Knobs, Textfields, RadioButtons, Checkboxes amongst others and can be easily added to a processing sketch.

Processing Code.

I started by creating a canvas with 200*300 size and with Red Background with this code:

import controlP5.*;
ControlP5 cp5;
void setup(){

size(200, 300);}

void draw(){
background(150,0,0);
}

then I added a title to my graphic controller.

text("Abdallah LED Controller",40,30);

then I added two buttons.

cp5 = new ControlP5(this);

cp5.addButton("green").setPosition(80,100).setSize(50,50);
cp5.addButton("blue").setPosition(80,200).setSize(50,50);

and now I have to build the communication between the application and the Atmega328p, this is performed when any button is pressed. a specific character will be sent through the serial com to the Atmega328p after that the atmega328p will perform a specific task,

to do so I have to add two additional lines where a character will be sent once a button is pressed

void green (){
port.write('1');

}

void blue(){
port.write('2');

}

then I added the code to connect the processing app with Arduino app.

and the combined code is:

import controlP5.*;
import processing.serial.*;

Serial port;
ControlP5 cp5;

void setup(){

size(200, 300);


  printArray(Serial.list());

  port= new Serial(this,"com4",9600);


 cp5 = new ControlP5(this);

 cp5.addButton("green").setPosition(80,100).setSize(50,50);
 cp5.addButton("blue").setPosition(80,200).setSize(50,50);


}  
void draw(){
background(150,0,0);
text("Abdallah LED Controller",40,30);

}

void green (){
port.write('1');

}

void blue(){
port.write('2');

}

Arduino Code.

My RGB is connected to pins 3,5,6. So I had to program accordingly. and the code is:

void setup (){


  pinMode(3,OUTPUT);
  pinMode(5,OUTPUT);

 digitalWrite(5,HIGH);
       digitalWrite(3,HIGH);

  Serial.begin(9600);
  }


void loop(){

  if(Serial.available()){
     char val = Serial.read();
     Serial.println(val);


     if(val =='1'){
      digitalWrite(5,HIGH);
       digitalWrite(3,LOW);
         }
      if(val =='2'){
      digitalWrite(3,HIGH);
             digitalWrite(5,LOW);


      }
   }
 }

Result Video.

Group assignment:

link

Processing :

Brief: ​

Processing is a flexible software sketchbook and a language for learning how to code within the context of the visual arts. ​

Advantages: ​

Free to download and open source. ​ - For GNU/Linux, Mac OS X, Windows, Android, and ARM.

​ - Interactive programs with 2D, 3D, PDF, or SVG output. ​

Well documented, with many books and tutorials available. ​ - Used easily with Arduino and Attiny44 from our experience.

Able to create complex shapes and art using lines of codes. ​ Disadvantages ? ​

It is a programming language, meaning that it is low level.

Experience.

the interface was easy to use for a beginner and easy to connect to the Arduino code. I used JAVASCRIPT before it was easy for me to understand the processing code. the visual arts seem to need to be more development I the software. but I can give them a high rate of the east to use software.