Atividade 18

- incluir ajuste do brilho da imagem original de acordo com uma
determinada variável, que varia de -0.5 a +0.5, e postar em seu
blog a tela resultante da aplicação, apresentando a imagem original e simultaneamente todos os filtros desenvolvidos.

código:

Durante a aula na sala, nós desenvolvemos os filtros RGB e os de tons de cinza

agora basta apresentar os outros filtros que podem ser utilizados: que são CMY, Negativo, Tons de cinza e a nova imagem que receberá o ajuste de brilho. 

Explicando o código um pouco, primeiramente são criadas todas as variáveis que vão receber a imagem , as de RGB e uma variável que irá receber um valor aleatório e irá mudar o brilho da imagem de acordo com o valor.

De acordo que a imagem se aproxima do seu limite negativo ela vai ficando mais brilhosa, e do seu limite positivo ela vai escurecendo.

Atividade 17

- desenvolver uma aplicação que exibe um relógio, com horas e
minutos, e discutir em seu blog as alterações realizadas.

código:

No setup() define-se o tamanho da tela.

No draw(), define-se duas variáveis, uma para pegar a hora do sistema e uma para pegar os minutos.

Então a função numero é chamada de acordo com sua utilidade, pra mostrar as horas e os minutos.

void draw(){
int hora = hour();
int minuto = minute();

numero(hora, 0);
numero(minuto,140);
}

Dentro da função numero para conseguir exibir os dígitos separadamente, utiliza-se um conceito simples de divisão (dividir o número por 10), assim obtém-se o seu quociente e o resto da divisão, nessa ordem, o primeiro e o segundo número que devem ser informados.

void numero(int num, int pos) {
  
int unidade = num%10;
int dezena = num/10;

depois é só chamar as Imagens e definir a posição delas. 

PImage img1;
img1 = loadImage("n(" + dezena + ").png");
image (img1, pos, 0);

PImage img2;
img2 = loadImage("n(" + unidade + ").png");
image (img2, pos + 70, 0);
}

Resultado:

Atividade 16

- Criar um olho (círculo preto pequeno no interior de círculo branco grande) que se encontra sempre voltado para o cursor do mouse.

código:

Essa tarefa não teve muita diferença do que foi visto em sala, em fazer uma linha girar partindo do centro da tela, a diferença é que agora a linha será uma ellipse que precisa estar dentro de outra ellipse, então será necessário utilizar distância entre dois pontos para que a ellipse interna não ultrapasse a ellipse externa.

então são necessárias algumas comparações pra saber que valor a tangente inversa vai receber.

  if (mouseX !=0) {
    dx = mouseX - 400 ;
    dy = mouseY - 300 ;
    tg = dy/dx;
  }

  a = atan(tg);

se a posição do mouse em x for menor que o centro da ellipse, a variável a recebe o valor de PI incrementado de a.

  if (mouseX<400) {
    a += PI;
  }

se a posição do mouse em x e em y for maior que o centro da ellipse e menor que o centro da ellipse em y, a variável recebe o valor de PI*2 incrementando de a.

  if (mouseX>400 && mouseY<300) {
    a += TWO_PI;
  }

depois estabelece-se os valores de X e Y, usando as funções cos e sin.

  X=cos(a)*(raio - 70);
  Y=sin(a)*(raio - 70);

a variável dist, recebe os valores da função distancia, que é a função para achar a distância entre dois pontos. No caso, a distância entre o centro da ellipse maior e do mouse, assim, um novo círculo será sempre criado de acordo com a posição do mouse.

  dist =distancia(400, mouseX, 300, mouseY);
  fill(0);
  if (dist>=(raio-70)) {
    ellipse(400+X, 300+Y, 100, 100);
  } else {
    ellipse(mouseX, mouseY, 100, 100);
  }
}

int distancia(float X1, float X2, float Y1, float Y2) {
  int resposta;
  resposta = (int)sqrt(((X1-X2)*(X1-X2)) + ((Y1-Y2)*(Y1-Y2)));
  return resposta;
}

Resultado:

Atividade 15

- Com a função, fazer um algoritmo usando a função millis() do processing para simular um cronômetro, apenas com o ponteiro dos segundos

código:

primeiro declara-se as variáveis que serão utilizadas e o tamanho da tela.

float x;
float y;
float sec;

void setup(){
  size(600,600);
 
}

dentro da função draw(), está a variável sec, que irá receber o valor milisegundos dado pelo processing, e divindo por 1000 irá retornar o valor em segundos.
e a função cronometro é chamada, os atributos dela são o valor do ângulo utilizado e o raio da circunferência.

a função cronometro recebe como atributo o valor do angulo e o raio da circunferência, o ponto inicial do ponteiro é o angulo de 1,5PI, que é 270º no processing.

void draw(){
   sec = (millis()/1000);
   println(sec);
   cronometro(PI+(PI/2),100);
}

a variável porce é utilizada para fazer a movimentação do ponteiro, para cada 15 segundos o ponteiro tem que percorrer 60º, ou seja, PI/2 radianos, se para cada meio segundo tenho PI/2, para 1 segundo tenho esse valor divido por 15, para cada 15% da ellipse deve-se percorrer o equivalente a PI/30 radianos.

depois estabelece-se as posições de x e y usando as funções cos e sin que irão receber o valor de ang + porcen, no caso ang é o valor do angulo inicial e porce é o angulo que ele vai percorrer, multiplicado pelo raio da circunferência.

cria-se uma ellipse e uma linha(ponteiro) para demonstrar o movimento.

void cronometro(float ang, float raio){
   float porce = sec*(PI/30);
   x = (cos(ang+porce)*raio);
   y = (sin(ang+porce)*raio);
   ellipse(width/2,height/2,raio*2,raio*2);
   line(width/2,height/2,x+width/2,y+(height/2));
}

Resultado (Clique para ver funcionando) :

Adicionar legenda

Atividade 14

- Criar o movimento de um barco no mar e discutir os resultados no blog

código:

Primeiro declara-se as variáveis que serão utilizadas, e dentro do setup() o tamanho da tela, e utilizo a função rectMode pra deixar o ponto inicial do retângulo centralizado junto com a ellipse q será criada.

float x=0;
float y;
float x1=0;
float y1=0;

void setup(){
  size(800,600);
  noStroke();
  rectMode(CENTER);
}

A função onda é a função principal que faz a linha da senoide, já foi visto em sala como ser feita, a única diferença é que agora eu preciso por um barco andando em cima dessa onda criada, e pra isso é criado uma nova função barco(), que desenha um barquinho na ellipse que faz a função onda, assim dar a impressão de que o barco está flutuando na onda.

void draw(){
  background(120);
  y = sin(x);
  x+=0.1;
  onda();
  barco();
 
 
}

void onda(){
  x1=0;
 for(int i=0; i<800; i++){
  y1 = sin(x1);
  x1+=0.1;
  ellipse(20*x1,20*y1+280,5,5);
  }  
}

void barco(){
  triangle(20*x,20*y + 280, 20*x + 25, 20*y + 230, 20*x, 20*y + 180);
  rect(20*x,20*y+280,50,20);
}

Resultado:

Atividade 13

- Criar uma aplicação que desenha um polígono
regular centralizado na tela com a quantidade de
lados informada no próprio código. Discutir a solução adotada em seu blog.

código:

O metódo que escolhi pra realizar essa tarefa foi utilizando cordenadas polares, então, primeiramente declara-se as variáveis, uma variável que irá receber o número de lados do polígono, e uma que irá receber o raio da circunferência.

int n = 6;
float raio = 100;

no setup(), define-se o tamanho da tela, e declara-se alguams variáveis que serão utilizadas na criação da forma, a variável ang recebe o valor em radianos do ângulo da nova forma, através da divisão de 360º pelo número de lados do novo polígono. A variável inc serve pra incrementar os valores de cos e seno no polígono. 

Eu utilizei a função vertex para criar a forma, ela recebe as posições iniciais e através de um contador verifica quantos lados serão necessários ser criados e desenha de acordo.

void setup(){
  noFill();
  size(800,600);
  float ang = 2*PI/n;
  float inc = 0; 
  float x;
  float y;
   x = raio*cos(inc);
   y = raio*sin(inc);
   beginShape();
   vertex(x + width/2,y + height/2);
   for (int i = 0; i < n; i++){
   inc += ang;
   x = raio*cos(inc);
   y = raio*sin(inc);
   strokeWeight(1);
   vertex(x + width/2, y + height/2);
   }
   endShape(CLOSE); 
}

Resultado: