I am a Graphic/Web Designer. I like building things. I am hands-on oriented, but will learn the book side if I can. I have made a few SNES Portables - http://aspecteleven.com/portables/
Hey, all. I am really new to Processing and the Arduino. I have looked around and founds some really neat examples.
I found one where you have a linear gradient and when you slide your mouse across it dims or brightens an LED attached to the Arduino.
I also found how to create a radial gradient. It is my desire to combine these two and make is so that there is mouseX and MouseY and the LED dims the closer the mouse is to the center of the ellipse and brightens the farther out the mouse is. The exact same thing is the linear, but converted to radial.
Here is the current Arduino Code:
const int ledPin = 9; // the pin that the LED is attached to
void setup() { // initialize the serial communication: Serial.begin(9600); // initialize the ledPin as an output: pinMode(ledPin, OUTPUT); }
void loop() { byte brightness;
// check if data has been sent from the computer: if (Serial.available()) { // read the most recent byte (which will be from 0 to 255): brightness = Serial.read(); // set the brightness of the LED: analogWrite(ledPin, brightness); } }
The linear gradient Processing Code:
//Processing code for this example // Dimmer - sends bytes over a serial port // by David A. Mellis //This example code is in the public domain.
import processing.serial.*; Serial port;
void setup() { size(256, 150);
println("Available serial ports:"); println(Serial.list());
// Uses the first port in this list (number 0). Change this to // select the port corresponding to your Arduino board. The last // parameter (e.g. 9600) is the speed of the communication. It // has to correspond to the value passed to Serial.begin() in your // Arduino sketch. port = new Serial(this, "COM4", 9600);
// If you know the name of the port used by the Arduino board, you // can specify it directly like this. //port = new Serial(this, "COM1", 9600); }
void draw() { // draw a gradient from black to white for (int i = 0; i < 256; i++) { stroke(i); line(i, 0, i, 150); }
// write the current X-position of the mouse to the serial port as // a single byte port.write(mouseX); }
And the radial gradient (slightly simplified version of the example by Ira Greenberg)
void setup(){
size(800, 800); background(200); smooth();
int radius = width/2; // create some gradients for (int i=radius; i< width; i+=width){ for (int j =radius; j< height; j+=width){ createGradient(i, j, radius, color(int(0), int(0), int(0)), color(int(255), int(255), int(255))); } } }
void createGradient (float x, float y, float radius, color c1, color c2){ float px = 0, py = 0, angle = 0;
// calculate differences between color components float deltaR = red(c2)-red(c1); float deltaG = green(c2)-green(c1); float deltaB = blue(c2)-blue(c1); // hack to ensure there are no holes in gradient // needs to be increased, as radius increases float gapFiller = 32.0;
for (int i=0; i< radius; i++){ for (float j=0; j<360; j+=1.0/gapFiller){ px = x+cos(radians(angle))*i; py = y+sin(radians(angle))*i; angle+=1.0/gapFiller; color c = color( (red(c1)+(i)*(deltaR/radius)), (green(c1)+(i)*(deltaG/radius)), (blue(c1)+(i)*(deltaB/radius)) ); set(int(px), int(py), c); } } // adds smooth edge // hack anti-aliasing noFill(); stroke(150); strokeWeight(2); ellipse(x, y, width, width); }
I'm not a coder by any means, so if anyone can either write up the code or show me how to figure it out, I would greatly appreciate it!