domingo, 23 de janeiro de 2011

Processing - Básicos da Interface

Aqui veremos como começar uma aplicação no Processing, e os básicos para desenhar sua interface.

  • Començando...
O código Processing, assim como o Arduino, é dividido basicamente em dois blocos, setup() e um bloco loop() que no Processing é chamado de draw(), além disso, o Processing possui diversos eventos, que ajudam a programar nesta plataforma. A sintaxe é semelhante a linguagem C o que facilita ainda mais as coisas.
Como é uma linguagem voltada para programação visual, já vem com diversas funções para desenho, desde formas geométricas básicas a modelos em 3d. Este é o ambiente do Processing (bem parecido com o Arduino não?):
PDE
Acesse http://processing.org/download/ e faça o download para o SO desejado.

 RunRun - Compila e roda seu código.
StopStop - Para o código que esta sendo rodado(em caso de bug ou travamento é bem util)
SaveSave - Salva o Projeto atual
OpenAbre um projeto salvo




NewNew - Novo projeto
ExportExport - Exporta Aplicação para ser rodada em browser

Outro botão util esta em File>Export Aplication , que compila o seu programa em forma de executável.

  • Ferramentas
Para ajudar o trabalho o Processing vem com algumas ferramentas básicas como: => Auto Format - Formata o código para facilitar a leitura. - Aba: Tools
=> Create Font - Cria fontes em formato vlw para serem usados no seu programa. Aba: Tools
=> Color Selector - Paleta de cores, dá o código da cor desejada. Aba: Tools
=> Import Library - Importa bibliotecas para o seu projeto.
=> Add File - Importa arquivos que serão usados no projeto (imagens por exemplo).

  • Exemplo 



void setup() {
  size(480, 120); //Configura a tela para 480x120 pixels
  smooth(); // Habilita filtro Anti-Aliasing
}

void draw() {  //loop principal
  if (mousePressed) { //evento de pressionamento do mouse
    fill(0);          //seleciona cor do proximo objeto a ser desenhado
  } else {
    fill(255);
  }
  ellipse(mouseX, mouseY, 80, 80); //desenha elipse de 80px por 80px nas coordenadas do mouse.
}

Nenhum comentário:

Postar um comentário