CAPÍTULO05

ProgramandocomoProcessing

1.Primeirosconceitos

ParaescreverumprogramaemlinguagemProcessingutilizamosapenasos

poucoscaracteresparaconstruçãodocódigoque,apósoprocessodecompilação,

produzaplicativosquesãocontroladoresdeprocessosindustriaisatésofisticados

sistemas multimídia. Da combinação de letras surgem as palavras reservadas,

identificadores, funções de biblioteca, etc.; os caracteres numéricos fornecem a

necessária representação de quantidades, tanto em um contexto interno

(formatação,parâmetrosdeinicialização,etc),quantoexterno(entradaesaídade

dadosnuméricos)equantoaossímbolos(*{}/%^$()[];#...)elestemusos

variados, seja para organizar o texto do programa para definir ao compilador a

prioridade de execução de uma rotina ou determinar o fim de uma linha de

comando.Algunssímbolossãoutilizadoscomooperadores.

2. AmbientedeProgramaçãodoProcessing

Para resolver problemas computacionais propomos utilizar o aplicativo

Processingquefoiescolhidoporquepossuiasseguintescaracterísticas:

a)éumsoftwarelivre;

b)ambienteintegrado(editorecompilador)amigáveleflexível;

c)extensabibliotecadefunções;

d)permitedesenvolveraplicativosemJavaeJavaScript;

e)permitedesenvolveraplicativosemformatodetexto;

f)éadequadoàiniciantequedesconhecemprogramação;

O ambiente permite utilizar todo o potencial da linguagem, inclusive a

exploração de aspectos complexos, porém neste texto abordaremos apenas

questõesessenciaisparaodesenvolvimentodeaplicativossimples.

Depoisdeseobteroprogramapormeiodeumdownloaddoaplicativono

endereço eletrônico https://www.processing.org/. Estão disponíveis as versões

Windows 64‐bits, Windows 32‐bits, Linux 64‐bits, Linux 32‐bits e Mac OS X,

conformeimagemaseguir.

Depoisdeinstalado,aoexecutaroambientedeprogramação,oProcessing

disponibilizaumeditordetextoparaaelaboraçãodaslinhasdecódigo.

O aplicativo possui duas linhas demenu na primeira temos os comandos

File, Edit, Sketch, Tools e Help e, na segunda, temos algumas operações que

desecreveremosaseguir.

Figura01–FunçõesdeGerenciamentode

ArquivosdePrograma(File)

Figura02–FunçõesdeEdição(Edit)

Figura03–FunçõesdeScketch(Edit)

Figura04–FunçõesdeFerramentas(Tools)

Figura05–FunçõesdeAjuda(Help)

Figura06–SegundoMenu

Osegundomenu(Fig.06)permitequeseexecuteumprogramaelaborado

em processing, finaliza a execução de um programa, permite criar um novo

programa,abrirumprogramarealizado,gravaroarquivodeprogramaelaborado

eexportararquivogerandoumaplicativo.

3.PalavrasChaveeElementosReservados

As palavras reservadas, em qualquer linguagem, representam tipos,

modificadores, especificadores, diretivas e caracterizam a sintaxe da linguagem.

Tendo um significado particular dentro da linguagem, as palavras reservadas

indicamao compilador ações específicas que o sistemadeverá executar. Como a

linguagem Processing é sensível à caixa alta ou baixa (maiúscula/minúscula)

todososcomandosdevemserescritosemcaixabaixaenãopodemserutilizadas

comoutrospropósitos.Todososcomandosda linguagemseresumemaalgumas

palavrasreservadas.

EXPRESSÕES

Comentários://,/**/

ExpressõeseAfirmações:“;”,“,”

ComandodeConsole:print(),println();

COORDENADASEPRIMITIVAS

TamanhodasTelas:size();

FigurasPrimitivas:point(),line(),triangle(),quad(),rect(),ellipse();

ParâmetrosdeDesenho:background(),fill(),stroke(),noFill(),

noStroke();

AtributosdeDesenho:smooth(),noSmooth(),strokeWeight(),

strokeCap(),strokeJoin();

ModosdeDesenho:ellipseMode(),rectMode();

VARIÁVEIS

Comasvariáveispodemosmanipulardados,numéricosoualfanuméricos,

desde a entrada, com sua transformação através do processamento, até a

saídadosdadostransformados,oqueéaessênciadoquedesejamosfazer.

Vejamoscommaisdetalhesessetipos:

boolean–1bitcomvalorlógicotrueoufalse;

byte‐8bits‐128to127;

char‐16bits0to65535;

int ‐ número inteiro na faixa de ‐2.147.483.648 a +2.147.483.647 32

bytes;

float ‐ um número racional na faixa de 32 bits 3.40282347E+38 até

3.40282347E+38;

true:verdadeiro;

false:falso;

color:32bits16,777,216colores. EXPRESSÕESARITMÉTICASEFUNÇÕES

+(soma),‐(subtração),*(multiplicação),/(divisão),%(módulo);

()(parenteses),++(incrementar),‐‐(decrementar),+=(adicionare

atribuir),

‐=(subtraireatribuir);*=(multiplicareatribuir),/=(dividireatribuir),

‐(negação),round()(arredondamento),min()(mínimoentrenúmeros)e

max()(máximoentrenúmeros).

TRANSFORMAÇÕES

Funçãotranslate()‐Afunçãotranslate()moveaorigemdafiguradocanto

superior esquerdo da tela para outro ponto. Ela tem dois parâmetros. O

primeiro é a coordenada x e o segundo é a coordenada y. A sintaxe da

função translate é translate(x, y). Os valores dos parâmetros x e y são

adicionadosaquaisquerformasdesenhadasapósafunçãoserexecutada.Se

10éutilizadocomoparâmetroparaxe30éutilizadocomoparâmetropara

y, um ponto desenhado em coordenadas (0,5), será desenhado em

coordenadas(10,35).

Funçãorotate()‐Afunçãorotate()giraosistemadecoordenadasdemodo

queformaspodemserdesenhadasnatelaemumdeterminadoângulo.Ele

temumparâmetroquedefineaquantidadederotaçãoconformeumângulo.

A função rotação assume que o ângulo é especificado em radianos. As

formas são sempre giradas em tornoda suaposição em relação à origem

(0,0)sendoqueopositivoésentidohorário.Talcomoacontececomtodas

as transformações,osefeitosderotaçãosãoacumulativos.Sehouveruma

rotaçãodeπ/4radianoseoutradeπ/4radianos,oobjetoserádesenhado

comumarotaçãodeπ/2radianos.

4.UsodasCores–CMYKeRGB

AscoresnoProcessingsãodefinidasporparâmetrosnuméricosassociados

às respectivas sintaxes. Por exemplo: background(), fill() e stroke() são funções

específicas.Assim,aousarascorescomestesparâmetros,elesficamdefinidosda

seguinte forma: background(valor1, valor2, valor3), fill(valor1, valor2, valor3),

fill(valor1, valor2, valor3, alpha), stroke(valor1, valor2, valor3), stroke(valor1,

valor2, valor3, alpha), onde os elementos valor1, valor2 e valor3 são parâmetro

quevariamde0a255eovalordealphavariade0a100%detransparência.

5.Operadores

Quandoqueremosqueumavariávelassumaumvalordentrodeumarotina

utilizamos a seguinte sintaxe: nome_da_variável = expressão, onde a expressão

podeserdescritaporumvalorconstantesimplesouutilizaroperadores,variáveis

econstantes.

Exemplos: A=30;

r1=(‐b+sqrt(b*b‐4*a*c))/(2*a);

Os operadores aritméticos da linguagem C++ trabalham de forma seme‐

lhante ao que ocorre em outras linguagens e podem ser utilizados em qualquer

dado numérico de tipos já mencionados. O que pode surpreender é o tipo do

resultado que retorna, dependendo tanto do tipo dos operandos quanto da va‐

riável que poderá receber o resultado da expressão, o que nos obriga a ter um

cuidadomaior pois, ao contrário de outras linguagens, a linguagemC++ não faz

verificaçãodecompatibilidadedetiposnomomentodacompilaçãoeumprograma

executável pode gerar resultados errôneos que, em muitas ocasiões, somente

poderão ser detectados após exaustivos testes. Vejamos os seguintes trechos de

programaparailustrarassituações:

Exemplo1: {inta;a=2.3+3.5;cout<<“valor=”<<a<<endl;}

Aprimeiraimpressãoéqueocompilador irádetectarumerropoisava‐

riávelaédetipointeosvaloressãodetipofloat,masocompiladorignoraeste

fatoetomaapenasaparteinteiradoresultadodaexpressão(5,8),armazenan‐do

ovalor5ema.

Exemplo2:

{floata;a=3/2;cout<<“valor=”<<a<<endl;}

Podemosteraimpressãodeque3/2iráproduzirovalor1,5poisavariá‐

vel a éde tipo float,masovalor armazenadoema será1, quociente inteiroda

divisãode3por2.

Observação:seaexpressãofosse3.0/2.0,oresultadoseria1,5.

Relaçãodosoperadoresaritméticos

Os operadores estão em ordem de precedência.

+ respectivamente incrementoedecrementodeuma

‐ menosunário

* ,

/ e %

respectivamente multiplicação, divisão e resto

de divisão (% trabalha apenas com operandos de tipo+ respectivamenteadiçãoesubtração

Vamos dar uma atenção especial aos operadores incremento e

decremento pois geralmente não são encontrados em outras linguagens. O

operador incremento (++) soma1 ao seu operando, demaneira semelhante a

“x=x+1”, istonãoéumaequação,significaqueonovoconteúdodexseráseu

conteúdoanterioracrescidodeumaunidade,supondoovalordexigualadois,x

receberá o valor 3; utilizando o operador incremento temos x++ e de forma

similarpodemosterdecremento,ouseja,x=x‐1quepodeserescritocomox‐‐.

Oqueaconteceriaseaoinvésdeescrevermosx++escrevêssemos++x?

Éamesmacoisa?Vamosilustrarasituação:

1º caso: 2º caso:

a = 5; a = 5;

b = a++; b = ++a;

Poderíamosdizerqueovalordebemambososcasosserá6?Não!Quando

ooperadordeincremento(oudecremento)éutilizadoantesdoope‐rando(++a),

aoperaçãoseráexecutadaantesdainstruçãodeatribuição,alte‐randoovalordo

operando(a)eassimbrecebeovalor6.Noprimeirocaso,brecebeprimeiroo

valor5(a=5)edepoisovalordearecebeoincremento.Cuidadoentãoquando

utilizar++ou‐‐.

Operadoresrelacionais

Quando desejamos comparar valores numéricos ou não‐numéricos, va‐

riáveisouexpressões,utilizamososoperadoresrelacionais,queretornamova‐

lor1 (true)seaexpressão forverdadeiraou0 (false)se falsa.Utilizamosesses

operadores principalmente na definição de estruturas de controle de seleção e

controlederepetição,queserãoapresentadosmaisadiantenoscapítulos2e3.

Comosoperadoresrelacionaiscriamosasexpressõesrelacionaisquesão

compostas, obrigatoriamente, por dois operandos de tipos compatíveis e um

operadorrelacional(=,<,>=,etc.)edevolveumvalorlógico:falsoouverda‐deiro

(falseoutrue),exemplo:x>2,onde“x”éoprimeirooperandona formadeuma

variável numérica, “>” (maior que) é o operador, que estabelece uma relação

entreoprimeirooperandoeo segundooperando,queéovalornumérico2na

formadeumaconstante.

Caso tenhamos uma expressão relacional matemática na forma: 2<x<7,

não podemos escrevê‐la desta mesma forma em C++, pois não podemos tra‐

balhar com trêsoperandos.Aexpressãomatemática transforma‐seemumaex‐

pressãológica,segundooseguinteraciocínio:comoxdevesermaiorquedoise,

simultaneamente, menor que sete, temos então a expressão lógica “(2<x) e

(x<7)”.Portanto,asexpressões lógicas sãoconstituídasapartirdosoperadores

lógicos e expressões relacionais. Observe o exemplo de declaração de uma

variáveldetipológico:

Estessãoosoperadoresrelacionais:

Operador Descrição== igualdade!= diferença> maior que>= maior ou igual a< menor que

<= menor ou igual a

Exemplos:

c<5resulta1seoconteúdodeafor4ouresultazeroseoconteúdode

afor7.

a!=5resulta1seoconteúdodeafor3ouresultazeroseoconteúdo deafor5.

a==5resulta1seoconteúdodeafor5ouresultazeroseoconteúdodeaforqualqueroutrovalor.

Operadoreslógicos

Existem determinadas situações em que uma expressão relacional sim‐

ples não atende às necessidade e aí temos que combinar expressões relacionais

para obtermos o resultado desejado, construímos então frases lógicas, combi‐

nandodiversasexpressõesrelacionais.Algunsoperadoreslógicos:

Denominação Símbolos SignificadoMatemático C++

Negação ~ ! não (not)Conjunção && eDisjunção || ou

Apresentaremos um resumo dos operadores lógicosmais utilizados dentro

de um contexto de Lógica Matemática. Neste âmbito, a palavra “proposição”éa

expressãodeumjuízo,quesecompõede:

umenunciado;

umvalorlógico(falsoouverdadeiro);umsignificado.

Enunciado é o registro da expressão em linguagem escrita, falada ousimbólica (esta última é a formade expressão da LógicaMatemática). O valorlógico é um atributo da proposição. O significado é a referência a um fato ouocorrência, é o próprio juízo. Emum sentidomais restrito, podemos conside‐rar uma proposição como uma combinação de expressões relacionais. Umaproposiçãopodesersimplesoucomposta.

Negação (~)

Anegaçãodeumaproposiçãopéumaproposição cujovalor lógico éver‐dadeiro(V)quandopéfalsae falso(F)quandopéverdadeira,eérepresentadapor“nãop”.Deoutraforma,“nãop”temvalorlógicoopostoaodep.

Vejamosatabela‐verdadedesteoperador:

Vejamosatabela‐verdadedesteoperador:

p ~V FF V

Exemplos: p:3 3=9(V) e ~p:3 3 9 q:8>10(F) e ~q:8 10(V)

Na linguagem corrente a negação é feita colocando‐se o advérbio “não”antes do verbo ou usando expressões do tipo “é falso que” ou “não é verdadeque” naproposiçãooriginal.Exemplo:

Sejaaproposiçãop:Ontemchoveu.Anegaçãodaproposiçãop(~p)po‐deráser:

1 ~p:Ontemnãochoveu2 ~p:Éfalsoqueontemchoveu3 ~p:Nãoéverdadequeontemchoveu.

Vamosaumpequenoexercíciomental:comoenunciaranegaçãodasse‐guintesproposições?

p:Todososalunossãoestudiososq:Nenhumalunoéestudioso

Conjunção()

Aconjunçãodeduasproposiçõessimplespeqéaproposiçãocompostacujovalorlógicoéverdadeiro(V)quandoasproposiçõespeq foremambasverdadeirasefalso(F)nosdemaiscasoseérepresentadaelidapor“peq”,sim‐bolicamente“p^q”.

Suatabela‐verdadeéaseguinte:

p q p^q

V V V

V F F

F V F

F F F

Exemplos:

2 p:Onúmero émaiorque3(V)q:Onúmero éirracional(V)

p^q:Onúmero émaiorque3eonúmero éirracional(V)

3 p:Onúmero émenorque3(F)q:Onúmero éirracional(V)p^q:Onúmero émenorque3eonúmero éirracional(F)

4 p:Onúmero émaiorque3(V)q:Onúmero éracional(F)p^q:Onúmero émaiorque3eOnúmero éracional(F)

5 p:Onúmero émenorque3(F)q:Onúmero éracional(F)

p^q:Onúmero émenorque3eOnúmero éracional(F)

Disjunção()Adisjunção de duas proposições simplespeqé a proposição composta

cujovalorlógicoéverdadeiro(V)quandopelomenosumadasproposiçõespeqfor verdadeira e falso(F) quando as proposiçõespeq forem ambas falsas e érepresentadaelidapor“pouq”,simbolicamente“pvq”,esuatabela‐verdadeé aseguinte:

p q p v q

V V V

V F V

F V V

F F F

Exemplos:

a) p:2 3 2 3 (V)

Tiposdedadosnãonuméricos:charestring

O tipo char é utilizado quando desejamos trabalhar com um único carac‐tereexistentenatabelaASCIIcompleta(0ao255).Otipostringfoiincorpora‐ dopara facilitar o trabalho do programador quando da necessidade de se mani‐pularpalavras,fraseseparágrafos.

Vejamosalgunsexemplosdedeclarações:

charcod;stringidprod;cod=‘T’;

idprod=“pp12t11”

SintaxedaTeladeProgramação

Apartirdeagoraapresentaremosalgumas

‐Especificaçãodacoordenadadopixel.

‐Formasbásicas:ponto,linha,retângulo,elipse.

Estelivrovailheensinarcomoprogramarnocontextodamídia

computacional,evaiutilizaroambientededesenvolvimentoProcessing

(http://www.processing.org)comobaseparatodasasdiscussõeseexemplos.Mas

antesdetudoissosetornarelevanteouinteressante,primeirotemosquecanalizar

nossoseusdaoitavasérie,retirarumpedaçodepapelmilimetrado,edesenhar

umalinha.!emenordistânciaentredoispontoséumalinhaboamodaantiga,eé

aíquecomeçamos,comdoispontossobrequepapelmilimetrado.

AFigura1.1mostraumalinhaentreopontoA(1,0)edopontoB(4,5).Se

vocêqueriadirigirumamigoseuparatiraressamesmalinha,vocêiriadar‐lhes

umamensagemedizer"desenharumalinhaapartirdopontodeumzeroaoponto

4‐5,porfavor."Bem,paraomomento,imagineoseuamigoeraumcomputadore

vocêqueriainstruirestepaldigitalparaexibiressamesmalinhaemsuatela.!e

mesmocomandoseaplica(sóquedestavezvocêpodeignorarasbrincadeirase

vocêseráobrigadoaempregarumaformataçãoprecisa).Aqui,ainstruçãoserá

parecidocomeste:

line(1,0,4,5);