Introdução à programação
com PROCESSING
Pontos, linhas, formas e cor.
Guilherme Martins - gmartins@artica.cc
André Almeida...
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...
background( , , );R G B
background define a cor do fundo

quando utilizado três valores, estamos a trabalhar no modelo de ...
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 utiliz...
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 point, colocar dois valores nos parâmetros: 
x (coorde...
Representar linhas no processing:
comandoline, precisamosdecolocarquatrovaloresnosparâmetros,
osdoisprimeirosvalorescorres...
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 rect, colocar quatro valores nos parâ...
x y w h
R e p r e s e n t a r c ir c u n f e r ê n c ia s e e lip s e s n o p r o c e s s in g : 
comando ellipse, colocar...
um rectângulo começa a ser
desenhado pelo seu canto
superior esquerdo
uma elipse começa a ser
desenhada pelo seu centro
Di...
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 defini...
O comando fill() serve para pintar o interior
dos objectos: rect, ellipse e triangle.

Utilizando apenas um parâmetro esta...
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 entr...
Introdução às Linguagens de Programação com Processing
Introdução às Linguagens de Programação com Processing
Introdução às Linguagens de Programação com Processing
Upcoming SlideShare
Loading in...5
×

Introdução às Linguagens de Programação com Processing

542

Published on

Introdução às Linguagens de Programação com Processing
http://processing.org
http://artica.cc

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
542
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
28
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Introdução às Linguagens de Programação com Processing

  1. 1. 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
  2. 2. width = 600 height = 400 size define o tamanho da janela com os parâmetros de largura (width) e altura (height)
  3. 3. 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
  4. 4. 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 Selector Color Selector permite-nos escolher uma cor com a tonalidade pretendida.
  5. 5. 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
  6. 6. 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 point, colocar dois valores nos parâmetros: x (coordenada horizontal) e y (coordenada vertical) x y
  7. 7. Representar linhas no processing: comandoline, precisamosdecolocarquatrovaloresnosparâmetros, osdoisprimeirosvalorescorrespondemàcoordenada(x,y)doprimeiroponto eosdoisúltimosvalorescorrespondemàcoordenada(x,y)dosegundoponto. line (x1, y1, x2, y2);
  8. 8. 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 rect, colocar quatro valores nos parâmetros: x (coord. horizontal) , y (coord. vertical) , w (largura) , h (altura)
  9. 9. x y w h R e p r e s e n t a r c ir c u n f e r ê n c ia s e e lip s e s n o p r o c e s s in g : comando ellipse, colocar quatro valores nos parâmetros: x (coord. horizontal) , y (coord. vertical) , w (largura) , h (altura)
  10. 10. 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:
  11. 11. Podemos mudar esta maneira de desenhar utilizando o comando rectMode()
  12. 12. 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.
  13. 13. 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.
  14. 14. O comando noFill() faz com que o interior dos objectos não seja preenchido.
  15. 15. O comando stroke() serve para atribuir uma cor à linha dos objectos.
  16. 16. 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
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×