Introdução à programação com PROCESSING

Pontos, linhas, formas e cor.

Guilherme Martins - gmartins@artica.cc André Almeida - aalmeida@artica.cc

http://artica.cchttp://processing.org

width = 600

height = 400

size define o tamanho da janela com os parâmetros de largura (width) e altura (height)

background define a cor do fundo

quando utilizado apenas um valor entre 0 e 255, estamos a definir a cor na gama da escala de cinzentos

background( , , );R G B

background define a cor do fundo quando utilizado três valores, estamos a trabalhar no modelo de cores R, G, B. Desta maneira podemos escolher qualquer cor desejada. http://pt.wikipedia.org/wiki/RGB

Tools > Color SelectorColor Selector permite-nos escolher uma cor com a tonalidade pretendida.

x

y

x = 100 y = 50

x = 600 y = 200

x = 200 y = 400

x = 0 y = 0

Sistema de coordenadas ou plano cartesiano: sistema utilizado para localizar pontos num espaço definido por duas coordenadas X (horizontal) e Y (vertical) http://pt.wikipedia.org/wiki/Sistema_de_coordenadas_cartesiano

R e p r e s e n t a r p o n t o s n o p r o c e s s in g :

comando p o in t, colocar dois valores nos parâmetros: x (coordenada horizontal) e y (coordenada vertical)

x y

Representar linhas no processing: comando line, precisamos de colocar quatro valores nos parâmetros, os dois primeiros valores correspondem à coordenada (x, y) do primeiro ponto e os dois últimos valores correspondem à coordenada (x, y) do segundo ponto. line (x1, y1, x2, y2);

x y w h

R e p r e s e n t a r r e c t â n g u lo s n o p r o c e s s in g :

comando re c t, colocar quatro valores nos parâmetros: x (coord. horizontal) , y (coord. vertical) , w (largura) , h (altura)

x y w h

R e p r e s e n t a r c i r c u n f e r ê n c ia s e e l i p s e s n o p r o c e s s in g :

comando e ll ip s e , colocar quatro valores nos parâmetros: x (coord. horizontal) , y (coord. vertical) , w (largura) , h (altura)

um rectângulo começa a ser desenhado pelo seu canto superior esquerdo

uma elipse começa a ser desenhada pelo seu centro

Diferências entre rectângulos e elipses:

Podemos mudar esta maneira de desenhar utilizando o comando rectMode()

1

2

3

R e p r e s e n t a r t r i â n g u lo s n o p r o c e s s in g : Para cada vértice do triângulo é necessário definir em que coordenada (x, y) este se encontra.

O comando fill() serve para pintar o interior dos objectos: rect, ellipse e triangle. Utilizando apenas um parâmetro estamos a pintar na escala de cinzentos, e podemos utilizar qualquer valor entre 0 e 255. Utilizando três parâmetros estamos a pintar na gama de cores RGB.

O comando noFill() faz com que o interior dos objectos não seja preenchido.

O comando stroke() serve para atribuir uma cor à linha dos objectos.

T r a n s p a r ê n c ia s : A transparência é conhecida em programação como alpha. O alpha é definido por um valor entre 0 e 100, sendo o 0 para total transparência e 100 para total opacidade. O valor da transparência é definido a seguir ao valor da cor, nos comandos stroke() e fill().

Escala de Cinzentos R, G, B