O documento discute arrays, programação orientada a objetos e bibliotecas em Processing. Explica que arrays armazenam dados do mesmo tipo e cada elemento tem um índice. Apresenta exemplos de uso de arrays simples e múltiplos. Em seguida, define classes, atributos, métodos e instâncias de objetos na programação orientada a objetos. Por fim, lista bibliotecas incluídas em Processing para áudio, vídeo e comunicação.

1. Introdução à Programação Gráfica
com Processing
Aula 02 – Técnicas de Programação

2. Arrays
Arrays são listas de dados, utilizados para armazenar e manipular grandes
quantidades de dados do mesmo tipo de forma automatizada. Cada pedaço de
dados em um array é identificado por um número de índice que representa a
sua posição no array. Os índices começam pelo 0, o que significa que o primeiro
elemento do array é [0], o segundo elemento é [1], e assim por diante.

3. Arrays
Exemplo
int num[] = new int[10]; //declaração de um array de 10 inteiros
void setup() {
size(800, 600);
smooth();
background(255);
for (int i = 0; i < num.length; i++) { //laço para varrer o vetor
num[i] = i*10; //incializa o elemento do indice i com valores de 0 até 90
fill(num[i]); //0 até 90
stroke(255-num[i]); //255 até 165;
ellipse(50*i + 100, height/2, num[i], num[i]);
}
}

4. Arrays
Exemplo com múltiplos arrays: siga o mestre
int s = 100; //elementos no array
float v = 5; //velocidade das ellipses
int[] ds = new int[s]; //diametros
float[] xs = new float[s]; //posições x
float[] ys = new float[s]; //posições y
void setup () {
size(800, 600);
background(255);
smooth();
noStroke();
fill(0);
for (int i = 0; i < ds.length; i++) { //inicializa os elementos dos arrays
ds[i] = i; //inicializa os diametros com os valores dos indices
xs[i] = width/2; //incializa as posições x e y no centro da tela
ys[i] = height/2;
}
}
void draw() {
background(255);
if (keyPressed) { //recebe entradas do teclado
if (key == 'z') { //tecla z faz as bolas moverem-se mais rápido
v -= 0.1;
v = constrain(v, 1, 5); //limita os valores de v para no minimo 1
} // e no máximo 5
if (key == 'x') { //tecla x faz as bolas moverem-se mais devagar
v += 0.1;
v = constrain(v, 1, 5);
}
}
xs[0] = mouseX; //primeiros elementos de posição x e y recebem a posição
//do mouse
ys[0] = mouseY;
ellipse(xs[0], ys[0], ds[0], ds[0]);
for (int i = 1; i < ds.length; i++) { //cada elemento dos arrays de posição
//recebe um incremento em direção a posição do elemento anterior
xs[i] += (xs[i-1] - xs[i])/v;
ys[i] += (ys[i-1] - ys[i])/v;
ellipse(xs[i], ys[i], ds[i], ds[i]);
}
}

5. Arrays
Exemplo com múltiplos arrays: siga o mestre

6. Programação Orientada a Objetos
Conceito
A orientação a objetos é um paradigma de análise, projeto e programação
de sistemas de software baseada na composição e interação entre diversas
unidades de software chamadas de objetos.
Na programação orientada a objetos, implementa-se um conjunto de
classes que definem os objetos presentes no sistema de software. Cada
classe determina o comportamento (definido nos métodos) e estados
possíveis (atributos) de seus objetos, assim como o relacionamento com
outros objetos.

7. Programação Orientada a Objetos
Classes
Uma classe é uma representação abstrata de objetos com características
afins. A classe define o comportamento dos objetos através de seus
métodos, e quais estados ele é capaz de manter através de seus atributos.
Objetos/ Instâncias de classe
Uma classe pode criar várias instâncias de si mesma com diferentes valores
para seus atributos. Esses objetos que atuam efetivamente no sistema.

8. Programação Orientada a Objetos
Atributos
São características de um objeto.
Basicamente a estrutura de
dados que vai representar a
classe. São análogos às variáveis.
Métodos
Definem o comportamento dos
objetos. Um método em uma
classe é apenas uma definição. A
ação só ocorre quando o método
é invocado através do objeto.
Dentro do programa, a utilização
de um método deve afetar
apenas um objeto em particular.
Normalmente, uma classe possui
diversos métodos. São análogos
às funções.

9. Programação Orientada a Objetos
Exemplo
comparativo:

10. Programação Orientada a Objetos
Exemplo carro orientado a objeto:
Car myCar; //criação do objeto
void setup() {
size(300,200);
myCar = new Car(); //instanciação
}
void draw() {
background(255);
myCar.drive(); //chamada de métodos
myCar.display();
}
class Car{
color c ; //atributos
float x ;
float y ;
float speed ;
Car(){ //construtor
c = color(0);
x = width/2;
y = height/2;
speed = 1;
}
void drive() { //método
x = x + speed;
if (x > width) {
x = 0;
}
}
void display() {
fill(c);
rect(x,y,30,10);
}
}

11. Programação Orientada a Objetos
Método construtor
O método construtor é chamado quando um objeto é instanciado, inicializando os seus
atributos. Através dele é possível inicializar os atributos com diferentes valores em cada
instanciação através do comando new. O construtor não tem retorno.

12. Programação Orientada a Objetos
Exemplo carro com construtor:
Car myCar; //criação do objeto
void setup() {
size(300,200);
myCar = new Car(color(255,0,0),0,50,5);
//instanciação
}
void draw() {
background(255);
myCar.drive(); //chamada de métodos
myCar.display();
}
class Car{
color c ;
float x ;
float y ;
float speed ;
Car(color col, float ex, float why, float s){
c = col;
x = ex;
y = why;
speed = s;
}
void drive() {
x = x + speed;
if (x > width) {
x = 0;
}
}
void display() {
fill(c);
rect(x,y,30,10);
}
}

13. Programação Orientada a Objetos
Exemplo com array de objetos:
Car [] myCars = new Car[200]; //criação de array de objetos
void setup() {
size(600,400);
noStroke();
for(int i = 0; i < myCars.length; i++){
myCars[i] = new Car(color(random(255), random(255)),
random(width), random(height), random(1,3));
}
}
void draw() {
background(255);
for(int i = 0; i < myCars.length; i++){
myCars[i].drive(); //chamada de métodos
myCars[i].display();
}
}
class Car{
color c ;
float x ;
float y ;
float speed ;
Car(color col, float ex, float why, float s){
c = col;
x = ex;
y = why;
speed = s;
}
void drive() {
x = x + speed;
if (x > width) {
x = 0;
}
}
void display() {
fill(c);
rect(x,y,30,10);
}
}

14. Programação Orientada a Objetos
Exemplo com array de objetos:

15. Complexidade
Estudo de caso: movimento de particulas
Point[] ps = new Point[10];
void setup() {
size(800, 600);
smooth();
background(255);
for (int i = 0; i < ps.length; i++) {
ps[i] = new Point(width/2, height/2, 2, color(i),
cos(i),sin(i));
}
}
void draw() {
for (int i = 0; i < ps.length; i++) {
ps[i].display();
ps[i].update();
}
}
class Point {
float x, y;
float vx, vy;
float d;
float v;
color c;
Point(float ex, float why, float di, color col, float v1,
float v2) {
x = ex;
y = why;
d = di;
c = col;
vx = v1;
vy = v2;
}
void display() {
fill(c);
noStroke();
ellipse(x, y, d, d);
}
void update() {
x += vx;
y += vy;
if(x >= width || x <= 0){
vx *= -1;
}
if(y >= height || y <= 0){
vy *= -1;
}
}
}

16. Complexidade
A função random
Gera números aleatórios. Cada vez que a função random () é chamada, ela
retorna um valor inesperado dentro do intervalo especificado.
//Sintaxe//
random(high);
random(low, high);

17. Complexidade
Estudo de caso: movimento browniano
Point[] ps = new Point[1000];
float big_d = 200;
void setup() {
size(800, 600);
smooth();
background(255);
for (int i = 0; i < ps.length; i++) {
ps[i] = new Point(width/2, height/2, 1,
color(random(255)), random(5),random(5));
}
}
void draw() {
//background(255);
for (int i = 0; i < ps.length; i++) {
ps[i].display();
ps[i].update();
}
}
class Point {
float x, y;
float vx, vy;
float d;
float vxc,vyc;
color c;
Point(float ex, float why, float di, color col, float v1,
float v2) {
x = ex;
y = why;
d = di;
c = col;
vxc = v1;
vyc = v2;
vx = random(-1,1)*vxc;
vy = random(-1,1)*vyc;
}
void display() {
fill(c);
noStroke();
ellipse(x, y, d, d);
}
void update() {
x += vx;
y += vy;
vx = random(-1,1)*vxc;
vy = random(-1,1)*vyc;
}
}

18. Complexidade
Estudo de caso: movimento browniano

19. Complexidade
Estudo de caso: conexões de
partículas
Point[] ps = new Point[50];
float big_d = 200;
void setup() {
size(800, 600);
smooth();
background(255);
for (int i = 0; i < ps.length; i++) {
ps[i] = new Point(random(width),
random(height), 20, color(0),
random(-1, 1)*2, random(-1, 1)*2,
50);
}
}
void draw() {
background(255);
for (int i = 0; i < ps.length; i++) {
ps[i].display();
ps[i].update();
}
}
class Point {
float x, y;
float vx, vy;
float d;
color c;
float rad;
Point(float ex, float why, float di,
color col, float v1, float v2, float cr) {
x = ex;
y = why;
d = di;
c = col;
vx = v1;
vy = v2;
rad = cr;
}
void display() {
fill(c);
noStroke();
ellipse(x, y, d, d);
stroke(0);
strokeWeight(3);
traceLines();
}
void update() {
x += vx;
y += vy;
if (x >= width || x <= 0) {
vx *= -1;
}
if (y >= height || y <= 0) {
vy *= -1;
}
}
void traceLines() {
for (int i = 0; i < ps.length; i++) {
//percorre um array de partículas,
testando se elas se tocam
float distance = dist(x, y, ps[i].x,
ps[i].y);
//se a soma dos raios de duas
partículas for maior que a distancia
entre seus centros, elas se tocam
if (ps[i].rad + rad >= distance) {
line(x, y, ps[i].x, ps[i].y);
}
}
}
}

20. Complexidade
Estudo de caso: conexões de partículas

21. Bibliotecas
Estendem Processing para além de gráficos e imagens, permitindo trabalhar com
áudio, vídeo e comunicação com outros dispositivos. As seguintes bibliotecas
estão incluídas com o software de Processing. Para incluir uma biblioteca,
selecione o nome dela através da opção “Import Library“ no menu Sketch. Essas
bibliotecas são de código aberto; o código é distribuído com o Processing.
Video
Lê imagens de uma camera, reproduz e cria arquivos de filme.
DXF Export
Cria arquivos DXF para exportar geometrias para outros programas. Funciona com gráficos
baseados em triângulos, incluindo polígonos, caixas e esferas.
Serial
Envia dados entre Processing e um hardware externo através da comunicação serial (RS-
232).
PDF Export
Cria arquivos PDF vetorizados, que podem ser escalados para qualquer tamanho e
impressos em alta resolução.
Network
Envia e recebe dados pela Internet através de clientes e servidores.
Minim
Usa JavaSound para provir uma biblioteca de áudio de fácil uso, ao mesmo tempo que
permite flexibilidade para usuários avançados.