Exercício 6: Botão

No seguinte código do Processing, é simulado um botão, como no Flash ou em outros ambientes que usam botões para interação.

Geralmente botões possuem três estados:

Não Apertado, Pra Cima(Up).
Não Apertado e Com Mouse Em Cima(Hover).
Apertado, Clicado(Click).

Nesse exemplo, um circulo representa o botão. Sua cor quando não esta pressionado e o mouse não está em cima, é branca. Quando não esta pressionado e o mouse esta sobre ele, sua cor é cinza. E quando pressionado o circulo muda pra preto.

Para saber se o mouse esta na área do circulo, é usada a função distancia2D, que retorna um valor inteiro, é passado a posição X e Y do Mouse e o Centrro X e Y do circulo, se o valor retornado for menor que o raio do circulo, o mouse esta dentro do circulo e sua cor é mudada pra  cinza, e se o mouse for pressionado quando o cursor estiver dentro do circulo este fica preto, simulando assim os três estados básicos de um botão.

Código-fonte:

 int r=50;
void setup()
{
  size(800,800);
}
int distancia2D(int X1, int Y1, int X2, int Y2)
{
  int resposta;
  resposta=(int)sqrt(pow(X2-X1,2)+pow(Y2-Y1,2));
  return resposta;
}
void draw()
{
  ellipse(width/2,height/2,2*r,2*r);
  if(distancia2D(mouseX,mouseY,width/2,height/2)<r)
  {
    fill(125);
    if(mousePressed){
        fill(0);
    }
  }
  else
  fill(255);
}