Introdução à Programação Gráfica
usando Processing
ANIMAÇÃO
+ - Modo contínuo no Processing
+ - Permite que o programador
Baseada em duas funções
O que se repete: a função draw
Todo código é repetido indefinidamente
Quando o bloco draw termina, ele é executado novamente
void draw() {
// Coloque aqui o código que deve rodar indefinidamente
}
+ - Exemplo
void draw() { println("Olá, Processing"); }
+ - Cuidados
Um programa só pode ter um bloco draw
Configuração do modo contínuo
função setup
void setup() {
// Coloque aqui o código que será executado apenas uma vez
}
A função size só pode ser colocada aqui
Controle da taxa de repetição
Variável frameRate
Por padrão, o bloco draw se repete um máximo de 60 vezes em cada segundo
A taxa de repetição é chamada de frameRate
A variável frameRate indica o número de frames por segundo (fps) que o draw é executado
+ - Exemplo
void draw() { println(frameRate); }
Valor do frameRate não é exato
Número de repetições
Variável frameCount
+ - Exemplo
void draw() { print("O valor de frameRate: "); println(frameRate); print("O valor de frameCount: "); println(frameCount); }
Alterar a taxa de repetição
Função frameRate
Quanto maior o valor, mais rápida a atualização
Quanto menor o valor, mais lenta a atualização
+ - Exemplo
void draw() { frameRate(3); textFont(createFont("Arial", 20)); text("frameCount é:", 10, 50); text(frameCount, 10, 70); print("O valor de frameCount é:"); println(frameCount); }
+ - Exemplo corrigido
void draw() { frameRate(3); background(0); textFont(createFont("Arial", 20)); text("frameCount é:", 10, 50); text(frameCount, 10, 70); print("O valor de frameCount é:"); println(frameCount); }
Implementando uma animação simples no Processing
Expressões Relacionais
+ - ==
Igualdade
Devolve verdadeiro quando dois operandos são iguais
3==3 é igual a verdadeiro
3==4 é igual a falso
+ - !=
+ - >
+ - <
+ - >=
+ - <=
+ - Exemplo
Conversão de boolean para inteiro
Usar a função int
+ - Documentação
+ - Exemplo
+ - Expressões lógicas
&&
Verdadeiro se todas as condições forem verdadeiras
~ Analogia com válvulas conectadas
||
Verdadeiro se qualquer uma das duas condições forem verdadeiras
~ Analogia com dois canos diferentes
!
Inverte um valor
+ - Estrutura de Seleção (if, else)
Até agora o código que executamos foi linha a linha
Estrutura de Seleção ou Condicional permite a escolha de um grupo de ações a ser executado apenas quando certas condições são satisfeitas
+ - Condição
Pode ser verdadeira (true) ou falsa (false)
+ - Formada por
&&
Verdadeiro se todas as condições forem verdadeiras
~ Analogia com válvulas conectadas
||
Verdadeiro se qualquer uma das duas condições forem verdadeiras
~ Analogia com dois canos diferentes
!
Inverte um valor
Estrutura de seleção simples
if (condição)
instrução a ser executada se a condição for verdadeira
Significa: a ação só pode ser executada se a condição for verdadeira
if(px==100)
println("Chegou na reta final!");
Instruções podem ser agrupadas com { e }
if(condição) {
primeira instrução a ser executada...
segunda instrução a ser executada...
...
}
if(px==200) {
println("Voltando para o início");
px = 0;
}
Estrutura de seleção composta
Permite considerar um fluxo alternativo ao fluxo principal
Palavra-chave else
Nunca o fluxo alternativo é executado após o principal
if(condição)
comando
else
comando alternativo
if(condição) {
comando 1
comando 2
}
else
comando alternativo
if(condição)
comando
else {
comando alternativo 1
comando alternativo 2
}
if(condição) {
comando 1
comando 2
} else {
comando alternativo 1
comando alternativo 2
}
Função com parâmetros e sem retorno
Relembrando como definir uma função
void nome() {
instruções;
}
Para chamar a função, dentro do setup, coloque o nome da função
void nome() {
instruções;
}
void setup() {
instruções;
nome();
}
Funções podem ter parâmetros para alterar seu comportamento
+ -Definindo uma função com parâmetros
void nome(tipo parâmetro, tipo parâmetro) {
instruções;
}
+ - Exemplo
void desenharCabeca(float diametro) {
noFill();
ellipse(40,20,diametro/4,diametro/4);
ellipse(60,20,diametro/4,diametro/4);
ellipse(50,30,diametro,diametro);
}
void setup() {
desenharCabeca(60);
}
+ - Switch e Máquinas de Estados
+ - O que é
Técnica para simular comportamentos complexos
Separa comportamento em estados distintos
Permite que unifiquemos diferentes programas em um só
+ -Mudança de estado
+ - Características
+ - Técnica mais usada em gameai
+ - Composta por
FSM demonstra como um objeto varia em relação ao tempo
+ - Tipos
FSM de Moore
FSM de Mealy
+ - Exemplos
+ - Projeto
Passar da Representação Gráfica para código
Estados (gerundio)
Transições (eventos)
Ação realizada (a cada estado)
Implementação da FSM
Codificada via switch
Legível, se pequena
Difícil de descobrir erros, se grande
Lógica redundante em diversos estados
+ -Não há como representar claramente que um estado foi executado pela 1a vez
+ - Difícil de representar ações de saída de estado
+ - Exemplo
switch (estado)
{
case stVagando:
Vagar();
if (ViuInimigo() ) estado=stAtacando;
if (Morreu () ) estado=stMorrendo;
break;
case stAtacando:
Atacar();
estado=stVagando;
if (Morreu () ) estado=stMorrendo;
break;
case stMorrendo:
ApodrecerLentamente();
break;
}// end switch