Processing-introducao

175 visualizações

Publicada em

Processing Language

Publicada em: Tecnologia
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
175
No SlideShare
0
A partir de incorporações
0
Número de incorporações
2
Ações
Compartilhamentos
0
Downloads
3
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Processing-introducao

  1. 1. 13/10/2014 1 Processing http://www.processing.org Cláudio L. V. Oliveira prof.claudioluis@fatecjd.edu.br Outubro de 2014 • Processing é uma linguagem de programação gratuita e de código aberto construída para artes eletrônicas e projetos visuais; • Tem como principal objetivo ensinar noções básicas de programação de computador em um contexto visual; • Projeto iniciado em 2001 por Casey Reas e Ben Fry, ambos ex-membros do Grupo de Computação do MIT Media Lab. Processing
  2. 2. 13/10/2014 2 Processing • O IDE da Processing inclui um sketchbook, uma alternativa para organizar projetos sem adotar o padrão utilizado na maioria das IDEs. • Os sketches (programas) criados são uma subclasse do Java Papplet, classe que implementa a maioria das funcionalidades da Processing. • Ao compilar todo o código do sketch é traduzido para Java. Processing • IDE da Processing:
  3. 3. 13/10/2014 3 Processing • Um dos objetivos da Processing é atuar como uma ferramenta para não-programadores ou iniciantes em programação, através da satisfação imediata com um retorno visual, por exemplo: println("Olá Pessoal!"); Processing • Fácil e rápido retorno visual, por exemplo, desenho de uma elipse: size (200, 200); // Tamanho da tela ellipse (100, 100, 190, 190);
  4. 4. 13/10/2014 4 Processing • Definição de cores (método fill). Um único parâmetro entre 0 e 255 realizar o preenchimento em uma escala de tons de cinza: size (200, 200); fill (0); ellipse (100, 100, 190, 190); Processing • Definição de cores (método fill). Três parâmetros entre 0 e 255 realizar o preenchimento no padrão RGB: size (200, 200); fill(255, 255, 0); ellipse (100, 100, 190, 190);
  5. 5. 13/10/2014 5 Processing • Desenho de um retângulo: size (200, 200); rect (5, 5, 190, 190); Processing • Exibição de texto no contexto gráfico: size(200, 200); fill(0); text("Olá Pessoal!", 10, 20);
  6. 6. 13/10/2014 6 Processing • Estrutura básica de um sketch: void setup() { size(200, 200); noLoop(); } void draw() { fill (0); text("Olá Pessoal!", 10, 20); } Processing • Unindo os conceitos para desenvolver pequenos sketches: void setup() { size(200, 200); noLoop(); } void draw() { fill(0); rect (5, 5, 80, 20); fill (255); text("Olá Pessoal!", 10, 20); }
  7. 7. 13/10/2014 7 Processing • Animação simples: int i = 10; void setup() { size(200, 200); } void draw() { background(0); fill (255); text("Olá Pessoal!", 10, i); delay(150); i = i + 10; if (i > height) i = 10; } Processing • Fontes e alinhamento do texto: int i = 10; void setup() { size(200, 200); textFont(createFont("SansSerif",18)); textAlign(CENTER); } // Implementar o método draw() ...
  8. 8. 13/10/2014 8 Processing • Outra animação: int i = 10, p = 10; void setup() { size(200, 200); } void draw() { background(0); fill (0, 255, 0); ellipse (width/2, i, 25, 25); delay(100); i = i + p; if ((i > height) || (i < 0)) p = p * -1; } Processing • Utilização de imagens: PImage bola; int i = 10, p = 10; void setup() { size(200, 200); bola = loadImage("bola.gif"); } void draw() { background(0); fill (0, 255, 0); image (bola, width/2, i); delay(100); i = i + p; if ((i > (height - bola.height)) || (i < 0)) p = p * -1; }
  9. 9. 13/10/2014 9 Processing • Eventos do mouse: void setup() { frame.setTitle("UsoMouse"); size (360, 180); fill (255); // Cor branca } void draw() { if (mousePressed) { ellipse(mouseX, mouseY, 100, 100); } else { rect(mouseX, mouseY, 100, 100); } } Processing • Bibliotecas – Exemplo G4P (GUI for Processing):
  10. 10. 13/10/2014 10 Processing • Bibliotecas: import g4p_controls.*; GLabel lNome; GTextField tNome; String imagens[]; GImageButton botao; void setup() { frame.setTitle("Biblioteca G4P"); size (360, 180); background(245); lNome = new GLabel(this, 10, 20, 340, 20, "Digite o seu nome:"); tNome = new GTextField(this, 10, 40, 340, 20); imagens = new String[] {"botao-ok.png", "botao-ok.png", "botao-ok-press.png" }; botao = new GImageButton(this, 10, 70, imagens); } Processing • Bibliotecas: void draw() { } public void handleButtonEvents(GImageButton controle, GEvent evento) { if (controle == botao) { fill(0); textFont(createFont("SansSerif",18)); text ("Olá, " + tNome.getText(), 10, 160); } }

×