1 / 60

2º Semestre 2009 > PUCPR > Design Digital

Bruno C. de Paula. Introdução à Programação usando Processing Programação Gráfica 2D Chamada a funções e variáveis Exercícios de Fixação. 2º Semestre 2009 > PUCPR > Design Digital. Revisão. Variáveis. int a=1; int b= 2; int c= 3; int d;.

seven
Download Presentation

2º Semestre 2009 > PUCPR > Design Digital

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Bruno C. de Paula Introdução à Programaçãousando ProcessingProgramação Gráfica 2DChamada a funções e variáveisExercícios de Fixação 2º Semestre 2009 > PUCPR > Design Digital

  2. Revisão

  3. Variáveis • int a=1; • int b= 2; • int c= 3; • int d;

  4. tiponome = valor;“Defina uma variável chamada nome do tipo inteiro, com valor inicial de 10”intminhaVar = 10;

  5. Chamada a funções

  6. Existem diferentes tipos de funções • Sem parâmetro: • noStroke(); • noFill(); • Com parâmetros: • rect(10,10,20,30); • Com retorno: • max(20,30); • Podem ter efeitos colaterais;

  7. rect(20,30,40,50); rect 20 rect: Desenha um retângulo 4 parâmetros Nenhum retorno Efeito colateral: desenha um retângulo 30 40 50

  8. max(40,50); max 40 50 50 max: Retorna o maior entre dois números 1 parâmetro 1 retorno

  9. max(floor(2.88), floor(3.88)); floor max 2.88 2 3 floor 3.88 3

  10. float d = dist(20,30,60,30); dist 20 30 d 40 40 60 60 dist: Calcula a distância entre 2 pontos. 4 Parâmetros 1 Retorno Sem efeitos colaterais

  11. Exercícios

  12. Exercício 01Identifique qual é o tipo, o nome, o valor inicial e o valor final para cada um dos fragmentos de código a seguir

  13. Objetivo do exercício • Revisar o conceito de variáveis; • Entender melhor como funcionam os operadores aritméticos; • Conhecer a técnica de teste de mesa que permite que possamos entender o passo a passo de nossos programas.

  14. Letra a) Variável perimetro • int largura = 30; • int altura = 40; • int perimetro = 0; • perimetro = largura*2; • perimetro = perimetro + altura*2;

  15. Letra a) RESPOSTA EXEMPLO • int largura = 30; • int altura = 40; • int perimetro = 0; • perimetro = largura*2; • perimetro = perimetro + altura*2; • Tipo de dado da variável: int • Nome da variável: perimetro • Valor inicial: 0; • Valor final: 140

  16. Raciocício da letra AComo você deve resolver? • Execute mentalmente o algorimo dado, passo a passo, ou seja, linha por linha. • OU • Crie uma tabela em que cada coluna representa o comportamento de uma variável; • Cada coluna indica uma variável; • Cada linha indica a modificação da variável. • Execute passo a passo o algoritmo.

  17. Raciocício da letra AComo você deve resolver? int largura = 30; int altura = 40; int perimetro = 0; perimetro = largura*2; perimetro = perimetro + altura*2;

  18. Raciocício da letra AComo você deve resolver? int largura = 30; int altura = 40; int perimetro = 0; perimetro = largura*2; perimetro = perimetro + altura*2;

  19. Raciocício da letra AComo você deve resolver? int largura = 30; int altura = 40; int perimetro = 0; perimetro = largura*2; perimetro = perimetro + altura*2;

  20. Raciocício da letra AComo você deve resolver? int largura = 30; int altura = 40; int perimetro = 0; perimetro = largura*2; perimetro = perimetro + altura*2;

  21. Raciocício da letra AComo você deve resolver? int largura = 30; int altura = 40; int perimetro = 0; perimetro = largura*2; perimetro = perimetro + altura*2;

  22. Raciocício da letra AComo você deve resolver? int largura = 30; int altura = 40; int perimetro = 0; perimetro = largura*2; perimetro = perimetro + altura*2;

  23. Letra a) RESPOSTA EXEMPLO • int largura = 30; • int altura = 40; • int perimetro = 0; • perimetro = largura*2; • perimetro = perimetro + altura*2; • Tipo de dado da variável: int • Nome da variável: perimetro • Valor inicial: 0; • Valor final: 140

  24. Letra b) Variável largura • float largura = 100.0; • rect(10,10,largura,10); • largura = largura * 2; • rect(10,10,largura,10); • largura = largura * 2; • rect(10,10,largura,10);

  25. Letra c) Variável largura e variável escala • float largura; • float altura = 50; • int escala = 2; • largura = (altura / 2) * escala; • escala = escala + 1; • largura = (altura / 2) * escala; • escala = escala + 1; • largura = (altura / 2) * escala;

  26. Letra d) Variáveis m e p • float m = 99; • float p= 3; • p = (m % 4) * 10; • m = m + 1; • p = (m % 4) * 10; • m = m + 1; • p = (m % 4) * 10; • m = m + 1; • p = (m % 4) * 10; • m = m + 1; • p = (m % 4) * 10; • m = m + 1; • p = (m % 4) * 10; • m = m + 1; • Veja a dica a seguir!

  27. Dica para resolver a letra d) • % = Resto inteiro da divisão; • 6 % 3 é igual a 0 • 6 dividido por 3 dá 2 • resto é 0. • 14 % 4 é igual a 2 • 14 dividido por 4 é igual a 3 • 4*3 = 12 • resto é 2.

  28. Dica para resolver a letra d) • 35 % 3 é igual a 2 • 35 dividido por 3 é igual a 11 • 3 * 11 = 33 • resto é 2. • 3 % 10 é igual a 3 • 3 dividido por 10 é igual a 0 • 3 * 0 = 0 • resto é 3.

  29. Comportamento periódico do operador %

  30. Exercício 02Utilizando a variável width e a variável height deixe o código a seguir dependente da largura e altura, ou seja, quando você alterar estes parâmetros com a função size as proporções devem ser mantidas.

  31. Letra a) • size(400,500); • rect(100,100,200,300);

  32. Letra a) RESPOSTA EXEMPLO • size(400,500); • rect(width/4,height/5,width/2,height/5*3);

  33. size(350,140); • size(400,500);

  34. Letra b) • size(500,600); • triangle(250,0,500,300,0,300);

  35. Letra c) • size(300,300); • ellipse(100,100, 40, 40); • ellipse(200,200, 40, 40);

  36. Letra d) • size(500,500); • quad(100,100, 250, 250, 400, 100, 250, 400);

  37. Exercício 03A partir do desenho fornecido e do esqueleto de código, complete o código que gera o desenho

  38. Objetivo do exercício • Conhecer novas funções do Processing, utilizando recursos da programação gráfica que você pode não ter utilizado em seus exercícios anteriores; • Treinar o uso de variáveis em seu código; • Estimular o uso da referência do Processing: • Português; • Inglês.

  39. Letra a • Dicas: • função arc desenha arcos; • rotate trabalha com ângulos em radianos.

  40. size(200,200); • background(0); • smooth(); • fill(236,237,41); • translate(??1??, ??2??); • arc(0,0,100,100, ??3??,??4??); • rotate(-PI/4); • translate(0,-width/8); • fill(0); • ellipse(??5??, ??6??,10,10);

  41. Resposta!

  42. size(200,200); • background(0); • smooth(); • fill(236,237,41); • translate(width/2,height/2); • arc(0,0,100,100,PI/5,TWO_PI-PI/5); • rotate(-PI/4); • translate(0,-width/8); • fill(0); • ellipse(0,0,10,10);

  43. Letra b • Dicas: • função strokeWeight altera o pincel.

  44. size(200,200); • background(255); • smooth(); • stroke(0,255,0); • strokeWeight(5); • fill(255,0,0); • arc(??1??,??2??,width/2,width/2,0,??3??);

  45. Letra c • Dicas: • função smooth elimina o serrilhado.

  46. size(300,200); • background(255); • smooth(); • translate(??1??,??2??); • ellipse(0,0,width/2,width/2); • fill(255,255,0); • ellipse(0,0,??3??,??4??); • rotate(PI/4); • translate(0,??5??); • fill(54,255,109); • ellipse(0,0,??6??,??7??);

  47. Letra d • Dicas: • função elipse desenha elipses.

  48. size(240,200); • background(255); • smooth(); • ellipse(width/2,30,??1??,??2??); • ellipse(width/2,60, ??3??,??4??); • ellipse(width/2,90, ??5??,??6??); • ellipse(width/2,120, ??7??,??8??); • ellipse(width/2,150, ??9??,??10??); • ellipse(width/2,180, ??11??,??12??);

  49. Letra e • Dicas: • função scale faz zoom em relação ao eixo cartesiano.

  50. size(300,300); • strokeWeight(5); • line(10,??1??,??2??, 0); • line(100,0,100,190); • line(90,??3??,??4??,190); • line(0,0, 0, 190); • translate(110,0); • scale(??5??); • line(10,??6??,??7??, 0); • line(100,??8??,??9??,190); • line(90,190,10,190); • line(0,0, 0, 190);

More Related