Avaliação do Usuário

Estrela inativaEstrela inativaEstrela inativaEstrela inativaEstrela inativa

 

Um dos grandes baratos do Processing é poder interagir com o Arduino e gerar gráficos a partir do que está sendo lido através de sensores ou usar os gráficos para fazer uma interface mais amigável com o equipamento.

 

Eis a proposta aqui: usaremos um potenciômetro de 10K ohm para simular um sensor qualquer e a partir das leituras obtidas com ele em um Arduino iremos criar gráficos com o Processing.

 

Primeiro vamos montar a experiência com o Arduino:

 

Ligue o potenciômetro ao Arduino, os dois pinos laterais são ligados ao 5V e a GND do Arduino. O lado do 5V e do GND mais ou menos tanto faz, apenas o lado do GND será o zero do potenciômetro e o lado onde estiver ligado do 5V será o 1024 (leitura máxima analógica).

 

Ligue o pino central do potenciômetro ao pino analógico 0 (A0) do Arduino.

 

 

 

 

 

Agora vamos escrever e carregar o seguinte código ao Arduino:

 

{code}

void setup() {

Serial.begin(9600);

}

 

void loop() {

Serial.println(analogRead(A0));

delay(10);

}

{/code}

 

Com esse código lemos o pino analógico 0 (A0) do Arduino e escrevemos os valores lidos na porta serial.

 

Verifique o funcionamento via Serial Monitor, movimente o potenciômetro e veja os valores lidos:

 

 

 

 

Antes de continuar recomendo uma olhada em Como realizar interação entre o Arduino e o Processing e em Processing: o que é e para que serve?.

 

 

Vamos então ao código do Processing:

 

{code}

import processing.serial.*;

 

Serial serial;

 

void setup () {

size(800, 600);

serial = new Serial(this, "COM3", 9600);

serial.bufferUntil('\n');

}

 

void draw () {

}

 

void serialEvent (Serial myPort) {

String leitura = serial.readStringUntil('\n');

float valor = float(trim(leitura));

background(color(255));

ellipse (width/2,height/2,valor,valor);

}

{/code}

 

Com esse código lemos a entrada de dados pela porta serial coletando os números enviados pelo Arduino e usamos esses números para determinar o tamanho do círculo a ser desenhado.

 

Com serial = new Serial(this, "COM3", 9600); determinamos que a porta serial a ser utilizada é a COM3 (verifique em qual seu Arduino está conectado) e a taxa de transmissão em 9600bps.

 

Com serial.bufferUntil('\n'); aguardamos que seja recebido um ENTER (caractere \n) para dar continuidade ao programa.

 

Nada é feito na função draw() tudo acontece na função predefinida serialEvent() que é chamada apenas quando há um evento pela interface serial, como parâmetro essa função recebe qual porta serial deve monitorar.

 

Em String leitura = serial.readStringUntil('\n'); concatenamos todos os caracteres recebidos pela porta serial na variável até que o caractere recebido seja um ENTER (próxima linha);

 

Com float valor = float(trim(leitura)); convertemos a string recebida pela porta serial em um número do tipo float.

 

Depois é só desenhar a elipse com o tamanho determinado pelo número enviado pelo Arduino. Usamos as constantes width que retorna o comprimento da janela e width que retorna a altura, com elas determinamos o meio da tela como centro para a elipse.

Execute e mova o potenciômetro ligado ao Arduino:

 

 

 

 

{youtube}h-4vNAJW6LE{/youtube}

Avaliação do Usuário

Estrela inativaEstrela inativaEstrela inativaEstrela inativaEstrela inativa

 

Para ter uma noção desde o início do que é Processing acesse o tutorial Processing: o que é e para que serve? e Como realizar interação entre o Arduino e o Processing.

 

Bom , vamos lá! A ideia é criar uma interface gráfica simples usando Processing para manipular o Arduino, no caso o LED do pino 13.

 

Com o Processing baixado e funcionando, faça download da biblioteca processing-arduino que pode ser encontrada em http://playground.arduino.cc/uploads/Interfacing/processing-arduino.zip e também uma cópia em http://www.seucurso.com.br/downloads/processing-arduino.zip

 

Descompacte o arquivo baixado, você terá uma pasta chamada arduino, copie-a (ou mova) para dentro da pasta libraries do Sketchbook do Processing, que normalmente fica dentro da pasta Meus Documentos sob o nome Processing.

 

 

 

Antes de continuar será necessário enviar para o Arduino um firmware que permita a comunicação entre o Processing e o hardware Arduino. Ao firmware que faz essa tarefa é dado o nome Firmata.

 

Para fazermos nosso primeiro teste abra o ambiente Arduino e abra o exemplo StandardFirmata que está no menu File > Examples > Firmata > StandardFirmata

 

 

 

 

Faça upload desse Firmata para o Arduino:

 

 

 

 

 

Isso fará com que seja carregado no Arduino um Firmata genérico que permitirá que controlemos o Arduino através do Processing. Com um pouco de estudo é possível criar Firmata personalizados para aplicações específicas.

 

Ok, o Arduino está preparado para lidar com o Processing a partir do Firmata padrão fornecido com o próprio ambiente, agora abra o Processing e vamos tentar o seguinte código:

 

{code}

import processing.serial.*;

import cc.arduino.*;

 

color selecionado = color(0);

color n_selecionado = color(255);

int ledPin = 13;

boolean ledOn = false;

 

Arduino arduino;

 

void setup() {

size(300,100);

println(Arduino.list());

arduino = new Arduino(this, Arduino.list()[1], 57600);

arduino.pinMode(ledPin, Arduino.OUTPUT);

textSize(26);

}

 

void draw() {

if(mouseX >= 10 && mouseX <= 100 &&

mouseY >= 10 && mouseY <= 50) {

fill(selecionado);

rect(10,10,100,50);

fill(n_selecionado);

text("ON",10,10,100,50);

} else {

fill(n_selecionado);

rect(10,10,100,50);

fill(selecionado);

text("ON",10,10,100,50);

}

 

if(mouseX >= 160 && mouseX <= 260 &&

mouseY >= 10 && mouseY <= 50) {

fill(selecionado);

rect(160,10,100,50);

fill(n_selecionado);

text("OFF",160,10,260,50);

} else {

fill(n_selecionado);

rect(160,10,100,50);

fill(selecionado);

text("OFF",160,10,260,50);

}

 

if(ledOn) arduino.digitalWrite(ledPin,Arduino.HIGH);

else arduino.digitalWrite(ledPin,Arduino.LOW);

}

 

void mousePressed() {

if (mouseX >= 10 && mouseX <= 100 &&

mouseY >= 10 && mouseY <= 50) {

ledOn = true;

}

if (mouseX >= 160 && mouseX <= 260 &&

mouseY >= 10 && mouseY <= 50) {

ledOn = false;

}

}

{/code}

 

Executando, com o Arduino conectado, temos a seguinte tela inciado:

 

 

 

 

Quando passar o mouse sobre o botão ON:

 

 

 

 

Quando passar o mouse sobre o botão OFF:

 

 

 

 

Se você clicar sobre o botão ON o LED do pino 13 do Arduino acenderá, quando clicar sobre o botão OFF ele apagará.

 

O que fizemos:

 

Com arduino = new Arduino(this, Arduino.list()[1], 57600); iniciamos a comunicação com o Arduino com velocidade de 57.600bps.

 

Com arduino.pinMode(ledPin, Arduino.OUTPUT); ajustamos que o pino ledPin (13) será utilizado para saída (OUTPUT).

 

Com fill(selecionado); e rect(10,10,100,50); criamos um retângulo nas coordenadas X,Y 10,10 com comprimento de 100 pixeis e a altura de 50 pixeis. O retângulo será preenchido com a cor determinada na função fill, onde a variável selecionado carrega a cor branca (255).

Com fill(n_selecionado); e  text("ON",10,10,100,50); escrevemos o texto ON na cor da variável n_selecionado (preto – 0) fixando que a área máxima a ser ocupada pelo texto é a mesma do retângulo que forma o botão.

 

As constantes mouseX e mouseY são predeterminadas e retorna a posição X e Y do mouse. Dessa forma fazemos condições IF que expressam: se o ponteiro do mouse estiver dentro do retângulo pinte-o de preto, caso contrário, pinte-o de branco.

 

A função void mousePressed() também é predeterminada pela linguagem e é executada apenas quando há um clique do mouse. Dessa forma fazemos condições IF que expressam: se ao clicar o mouse dentro da área dos retângulos deve-se setar a variável que determinará se o LED do Arduino deve estar ligado ou não.

 

 

Avaliação do Usuário

Estrela inativaEstrela inativaEstrela inativaEstrela inativaEstrela inativa

Processing é um ambiente e uma linguagem de programação open-source para pessoas que querem criar imagens, animações e interações. Inicialmente desenvolvida para servir como livro de esboços (sketchbook) e para ensinar fundamentos de programação de computadores em um contexto visual, Processing pode vir a ser também uma ferramenta para criar trabalhos profissionais.

 

 

Atualmente, existem inúmeros estudantes, artistas, designers, pesquisadores e hobistas que usam Processing para aprender, prototipar e produzir.

 

 

7 motivos para se interessar e aprender Processing:

 

 

1. Livre para download e de código aberto (open-source);

2. Gera programas interativos para saída em 2D, 3D ou PDF;

3. Utiliza a biblioteca OpenGL para acelerar gráficos 3D;

4. Disponível sob licença GNU para Linux, Mac OS X e Windows;

5. Roda projetos online ou off-line;

6. Possui mais de 100 bibliotecas de extensão de software para som, vídeo, visão computacional e etc.

7. Bem documentado e com vários livros, tutoriais, artigos e etc. disponíveis;

 

 

Bom, para começar vamos ao que interessa:

 

 

Para encontrar e instalar o Processing vá até www.processing.org, clique no link Download e baixe a versão correta para seu sistema operacional.

 

 

Existem versões para Windows 64-bit e 32-bit, Mac OS X e Linux 32-bit e 64-bit.

 

 

Um arquivo com extensão ZIP (compactado) será baixado e o primeiro passo é descompactar esse arquivo em algum lugar fácil de encontra-lo depois, por exemplo, no Meus Documentos no Windows ou no diretório home no caso do Linux.

 

 

Na pasta que será gerada pela descompressão do arquivo baixado você encontrará um arquivo chamado processing.exe, basta executá-lo com um duplo clique para ter acesso ao ambiente de programação.

 

 

No caso do Mac OS X não é preciso descompactá-lo, basta clicar duas vezes sobre o arquivo para executar o ambiente de programação.

 

 

 

 

 

 

A programação em Processing é feita com uma linguagem com as mesmas estruturas e conceitos da linguagem C, mas adaptada para o contexto de uso do Processing.

 

 

Todo programa em Processing é composto por duas funções, uma chamada setup onde fazemos todos os ajustes para o programa, como leitura de bibliotecas, declaração de variáveis e qualquer outra coisa que necessita ser executado apenas única vez e da função draw que é um loop infinito executando dos comandos desejados para o funcionamento do projeto.

 

 

Estrutura de um programa em Processing:

 

 

{code}

void setup() {

...

}

 

void draw() {

...

}

{/code}

 

 

Com o ambiente aberto e pronto para receber programação vamos tentar o seguinte exemplo:

 

 

{code}

void setup() {

size(480,120);

}

 

void draw() {

ellipse(50,50,80,80);

}

{/code}

 

 

 

 

 

 

Clicando no botão Run (executar) que se parece com um play e fica na parte superior esquerda da tela:

 

 

 

 

 

 

Teremos o seguinte resultado:

 

 

 

 

 

O que fizemos:

 

 

Na função setup determinamos o tamanho da janela de saída, que será de 480 de largura por 120 pixeis de altura.

 

 

Na função draw executamos o comando elipse que recebe quatro parâmetros do tipo inteiro, sendo os dois primeiro o centro da imagem em x,y e os dois últimos o raio da elipse também em x,y.

 

 

Se alterarmos o programa para:

 

 

{code}

void setup() {

size(480,120);

}

 

void draw() {

ellipse(50,50,70,90);

}

{/code}

 

 

Teremos a seguinte saída:

 

 

 

 

 

 

Simples né?! Agora saiba que a linguagem tem milhares de comandos diferentes e milhares de bibliotecas para os mais diversos fins.

 

 

O céu é o limite! O pontapé inicial foi dado!

 

 

Para encontrar mais exemplos e tutoriais acesse www.processing.org/learning. Exemplos online totalmente funcionais podem ser encontrados em www.processing.org/learning/basics

 

 

Avaliação do Usuário

Estrela inativaEstrela inativaEstrela inativaEstrela inativaEstrela inativa

 

Processing é uma linguagem e um ambiente de desenvolvimento open-source que permite escrever programas para representação gráfica, basicamente. Você pode ter uma ideia melhor do que é o Processing em http://seucurso.com.br/index.php?option=com_content&view=article&id=261:processing-o-que-e-e-para-que-serve&catid=906:diversos&Itemid=70

 

É possível integrar o Arduino com o Processing, ou seja, para que possamos desenvolver no Processing aplicações, especialmente com saídas gráficas, capazes de controlar o comportamento do Arduino e ler dados por ele gerados através de sensores. Para que tudo isso seja possível é preciso seguir alguns passos na criação do projeto, que são mostrados abaixo.

 

Antes de qualquer coisa, para que as funcionalidades de comunicação serial funcionem é necessário, mesmo em sistemas operacionais 64-bit, o uso do ambiente do Processing na versão 32-bit. Caso esteja usando a versão 64-bit a comunicação serial não funcionará e você terá sempre o erro “processing serial does not run in 64-bit mode”. Lembre-se ainda de utilizar sempre a última versão estável do Processing e não versões betas.

 

Mãos-a-obra!

 

Faça download da biblioteca processing-arduino que pode ser encontrada em http://playground.arduino.cc/uploads/Interfacing/processing-arduino.zip e também uma cópia em http://www.seucurso.com.br/downloads/processing-arduino.zip

 

Descompacte o arquivo baixado, você terá uma pasta chamada arduino, copie-a (ou mova) para dentro da pasta libraries do Sketchbook do Processing, que normalmente fica dentro da pasta Meus Documentos sob o nome Processing.

 

 

 

Antes de continuar será necessário enviar para o Arduino um firmware que permita a comunicação entre o Processing e o hardware Arduino. Ao firmware que faz essa tarefa é dado o nome Firmata.

 

Para fazermos nosso primeiro teste abra o ambiente Arduino e abra o exemplo StandardFirmata que está no menu File > Examples > Firmata > StandardFirmata

 

 

 

 

Faça upload desse Firmata para o Arduino:

 

 

 

 

 

Isso fará com que seja carregado no Arduino um Firmata genérico que permitirá que controlemos o Arduino através do Processing. Com um pouco de estudo é possível criar Firmata personalizados para aplicações específicas.

 

Ok, o Arduino está preparado para lidar com o Processing a partir do Firmata padrão fornecido com o próprio ambiente, agora abra o Processing e vamos tentar o seguinte código:

 

{code}

import processing.serial.*;

import cc.arduino.*;

 

Arduino arduino;

int ledPin = 13;

 

void setup()

{

println(Arduino.list());

arduino = new Arduino(this, Arduino.list()[1], 57600);

arduino.pinMode(ledPin, Arduino.OUTPUT);

}

 

void draw()

{

arduino.digitalWrite(ledPin, Arduino.HIGH);

delay(1000);

arduino.digitalWrite(ledPin, Arduino.LOW);

delay(1000);

}

{/code}

 

Esse programa acenderá o LED do pino 13 por um segundo, em seguida fará com que ele fique desligado por mais um segundo, repetindo isso infinitamente.

 

O que fizemos:

 

Com Arduino arduino; criamos um objeto do tipo Arduino chamado arduino. Esse objeto contém todos os métodos de manipulação do hardware Arduino.

 

Com println(Arduino.list()); fazemos com que o programa mostre as portas seriais disponíveis e qual índice usar no próximo comando.

 

Com arduino = new Arduino(this, Arduino.list()[1], 57600); inicializamos o objeto arduino com comunicação serial na velocidade de 57.600bps.

 

Os parâmetros são:

{code}

Arduino(parent, name, rate);

{/code}

 

Onde, parent é o programa de onde está sendo chamado, normalmente é a palavra this. name é o nome do dispositivo serial a ser utilizado, você pode usar Arduino.list() para mostrar todos, caso haja mais de um. Por fim, rate é a velocidade de comunicação serial.

 

Com arduino.pinMode(ledPin, Arduino.OUTPUT); setamos o ledPin (13) como output.

 

Com arduino.digitalWrite(ledPin, Arduino.HIGH); escrevemos HIGH para o ledPin (13).

 

Executando teremos a janela do Processing abaixo e o LED do pino 13 piscando infinitamente:

 

 

 

 

{youtube}6cx-W-z02Fw{/youtube}

 

 

Com esse exemplo básico é possível ter uma noção da integração do Arduino e o Processing, mas saiba que isso é só a primeira gota nesse oceano, logo postarei mais tutoriais.