16. Interface and application programming¶
This week I worked on Interface and Application Programming
Group Assignment¶
From the following link you can access the: Group Assignment
Individual Assignment¶
I was looking for the best software option to design interfaces but for beginners. I found Processing , a software that was also born as an alternative for teaching programming fundamentals in a visual context. It can be downloaded from the following link:
https://processing.org/
Then, my instructor recommended me to check this link from Arduino Education that presents several examples of Visualization with Arduino and Processing and to try all the examples to understand how the Processing software works.
https://www.arduino.cc/education/visualization-with-arduino-and-processing
This way I can create an interface for my PCB board from the INPUTS assignment.
https://fabacademy.org/2022/labs/esan/students/hugocesar-gomez/assignments/week11/
First I had to reprogram my PCB to be able to read the signals through the serial port. The code I used is the following:
#include <SoftwareSerial.h>
#define rxPin 1
#define txPin 2
#define sensor 2
SoftwareSerial mySerial(rxPin, txPin);
void setup() {
// put your setup code here, to run it once:
mySerial.begin(9600);
}
void loop() {
// put your main code here, to run repeatedly:
int value = analogRead(sensor);
mySerial.println(value);
}
I tried to modified the output range to increase the sensitivity, but I couldn’t. The range is too low because is a temperature sensor.
Well, then I burned my PCB, literally, so I had to change the ATtiny45.
After change the uC I programmed my PCB again.
From the examples I did my tests with the particle system and Interactive ellipse examples.
Particle System
int n = 1000; // number of points
float[] m = new float[n]; // make a new floating-point list
float[] x = new float[n];
float[] y = new float[n];
float[] vx = new float[n];
float[] vy = new float[n];
float[] redchannel = new float[n];
float[] bluechannel = new float[n];
float[] greenchannel = new float[n];
float[] shape = new float[n];
import processing.serial.*;
Serial myPort; // Creates an object of class Serial
static String val; // Data received from serial port
int sensorVal = 0;
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
void setup() {
fullScreen();
fill(0,10);
reset();// executing reset on click. 10000 random values are entered
String portName = "COM10";// Change the number (in this case ) to match the corresponding port number connected to your Arduino.
myPort = new Serial(this, portName, 1200);
}
//::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
void draw() {
if ( myPort.available() > 0) { // If the data is available,
val = myPort.readStringUntil('\n');
try {
sensorVal = Integer.valueOf(val.trim());
}
catch(Exception e) {
;
}
println(sensorVal); // read it and store it in vals!
}
noStroke();
fill(0,30);
rect(0, 0, width, height); // black background
for (int i = 0; i < n; i++) { // execute loop 10,000 times
float dx = mouseX - x[i]; // distance of the mouse
float dy = sensorVal - y[i];
float d = sqrt(dx*dx + dy*dy); // calculate the distance between the points and the mouse
if (d < 1) d = 1;
float f = cos(d * 0.06) * m[i] / d*2; //decide whether to move towards or away from the mouse
vx[i] = vx[i] * 0.4 - f * dx; //changing the velocity so that it moves toward the ring.
vy[i] = vy[i] * 0.2 - f * dy;
}
for (int i = 0; i < n; i++) {
x[i] += vx[i];
y[i] += vy[i];
if (x[i] < 0) x[i] = width;
else if (x[i] > width) x[i] = 0;
if (y[i] < 0) y[i] = height
else if (y[i] > height) y[i] = 0;
if (m[i] < 0) fill(bluechannel[i], greenchannel[i] , 255);
otherwise fill(255, bluechannel[i],redchannel[i]);
if (shape[i] > 2) fill(bluechannel[i], greenchannel[i] , 255);
otherwise, fill(255, bluechannel[i],redchannel[i]);
if (shape[i] > 2) rect(x[i], y[i],10,10);
else if (shape[i] > 1 && shape[i] <=2) rect
Then I tested The Interactive ellipse code
import processing.serial.*;
Serial myPort; // Create object from Serial class
static String val; // Data received from the serial port
int sensorVal = 0;
void setup()
{
size(720, 480);
noStroke();
noFill();
String portName = "COM10";// Change the number (in this case ) to match the corresponding port number connected to your Arduino.
myPort = new Serial(this, portName, 1200);
}
void draw()
{
if ( myPort.available() > 0) { // If data is available,
val = myPort.readStringUntil('\n');
try {
sensorVal = Integer.valueOf(val.trim());
}
catch(Exception e) {
;
}
println(sensorVal); // read it and store it in vals!
}
background(0);
// Scale the mouseX value from 0 to 640 to a range between 0 and 175
float c = map(sensorVal, 0, width, 0, 400);
// Scale the mouseX value from 0 to 640 to a range between 40 and 300
float d = map(sensorVal, 0, width, 40,500);
fill(255, c, 0);
ellipse(width/2, height/2, d, d);
}
In both cases I had to change the port Name for COM10 and the baud rate for 1200. I saw that my parter Lesly did the same.
https://fabacademy.org/2020/labs/esan/students/lesly-ramirez/assignments/week15/#programming