{"id":42,"date":"2022-03-23T22:08:49","date_gmt":"2022-03-23T22:08:49","guid":{"rendered":"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/"},"modified":"2022-03-23T22:08:49","modified_gmt":"2022-03-23T22:08:49","slug":"animacao-2d","status":"publish","type":"page","link":"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/","title":{"rendered":"Anima\u00e7\u00e3o 2D"},"content":{"rendered":"

<\/p>\n

<\/p>\n <\/p>\n <\/p>\n <\/p>\n <\/p>\n
Introdu\u00e7\u00e3o \u00e0 computa\u00e7\u00e3o gr\u00e1fica com
\nOpenGL<\/th>\n<\/tr>\n

<\/p>\n

Prev<\/a><\/td>\n

<\/p>\n

 <\/p>\nNext<\/a><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

<\/p>\n

\n<\/div>\n

<\/p>\n

<\/p>\n

Cap\u00edtulo 7. Anima\u00e7\u00e3o 2D<\/a><\/h1>\n

<\/p>\n

<\/p>\n
<\/p>\n
\u00cdndice<\/b> <\/p>\n
7.1. Descri\u00e7\u00e3o
\n do programa anima_telejogo.c<\/tt><\/a> <\/p>\n
7.2. Outros programas relacionados<\/a> <\/p>\n
7.3. Exerc\u00edcios<\/a><\/dt>\n<\/dt>\n<\/dt>\n<\/dt>\n<\/dl>\n<\/div>\n

<\/p>\n

O prop\u00f3sito desta li\u00e7\u00e3o \u00e9 ilustrar os conceitos
\nenvolvidos na gera\u00e7\u00e3o de uma anima\u00e7\u00e3o no OpenGL. Neste caso, anima\u00e7\u00e3o \u00e9 feita em
\n2D e trata-se de um antigo jogo da d\u00e9cada de 80, chamado de Telejogo, como ilustrado
\nna Figura 7-1<\/a>. <\/p>\n

<\/p>\n

O jogo consiste em um campo de futebol com dois jogadores, uma bola e duas traves (esses
\nelementos n\u00e3o est\u00e3o todos presentes na figura abaixo). Os jogadores movimentam-se na
\nhorizontal e vertical; a bola movimenta-se em diversas
\ndire\u00e7\u00f5es (n\u00e3o implementados). O objetivo do jogo, logicamente, \u00e9 marcar gol.<\/p>\n

<\/p>\n

<\/p>\n

Figura 7-1. Um frame do Telejogo.<\/a><\/b><\/p>\n

<\/p>\n

<\/p>\n<\/div>\n

<\/p>\n

O programa usado para modelar esta cena \u00e9 mostrado no Exemplo
\n7-1<\/a>. A \u00fanica tecla habilitada \u00e9 a ESC<\/b>, utilizada para
\nfinalizar o programa. <\/p>\n

<\/p>\n

<\/p>\n

Exemplo 7-1. programa <\/a>anima_telejogo.c<\/tt><\/a><\/b><\/p>\n

<\/p>\n <\/p>\n <\/p>\n <\/p>\n
\n

\n\/* programa TELEJOGO *\/
\n\/* Prof. Marco Antonio G. de Carvalho, UNICAMP-2006 *\/
\n\/* EXEMPLO DE ANIMACAO *\/
\n
\n#include <stdlib.h>
\n#include <GL\/glut.h>
\n
\nGLint movebola=0;
\nGLint direcao=1;
\n
\nvoid init(void);
\nvoid display(void);
\nvoid bola(int passo);
\nvoid keyboard(unsigned char key, int x, int y);
\n
\nint main(int argc, char** argv){
\n  glutInit(&argc, argv);
\n\/\/  glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB);
\n  glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB);
\n  glutInitWindowSize (600, 400);
\n  glutInitWindowPosition (100, 100); 
\n  glutCreateWindow (\"TELEJOGO\");
\n  init();
\n  glutDisplayFunc(display);
\n  glutTimerFunc(10,bola,1);
\n  glutKeyboardFunc(keyboard);
\n  \/\/glutMouseFunc(mouse);
\n  glutMainLoop();
\n  return 0;
\n}
\n
\nvoid init(void){
\n  glClearColor(0.0, 0.0, 0.0, 0.0);
\n  glOrtho (0, 600, 0, 400, -1 ,1);
\n}
\n
\nvoid display(void){
\n  glClear(GL_COLOR_BUFFER_BIT);
\n
\n \/\/ glPolygonMode(GL_BACK, GL_LINE);
\n  glColor3f(1.0, 1.0, 1.0);
\n  glLineWidth(15.0);
\n  glBegin(GL_LINE_LOOP);
\n  glVertex2i(2,2);  glVertex2i(599,2);
\n  glVertex2i(599,399); glVertex2i(2,399);
\n  glEnd();
\n
\n  glBegin(GL_LINES);
\n  glVertex2i(100,190);  glVertex2i(100,240);
\n  glVertex2i(500,190);  glVertex2i(500,240);
\n  glEnd();
\n
\n  glPointSize(15.0);
\n  glBegin(GL_POINTS);
\n  glVertex2i(movebola+200,210);
\n  glEnd();
\n
\n\/\/  glFlush();
\n  glutSwapBuffers();
\n }
\n
\nvoid keyboard(unsigned char key, int x, int y){
\n  switch (key) {
\n  case 27:
\n\texit(0);
\n\tbreak;
\n  }
\n}
\n
\nvoid bola(int passo)
\n{
\nif(direcao==1)
\n{
\nmovebola += 1;
\nif(movebola==290) direcao = 0;
\n}
\n
\nelse
\n{
\nmovebola -= 1;
\nif(movebola==-90) direcao = 1;
\n}
\nglutPostRedisplay();
\nglutTimerFunc(10,bola, 1);
\n
\n}<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n

<\/p>\n
Para compilar e executar o programa anima_telejogo.c<\/tt><\/a>, salve-o juntamente com o 
\narquivo Makefile<\/a> em um diret\u00f3rio e execute a seguinte seq\u00fc\u00eancia de 
\ncomandos:<\/p>\n

<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n
\n
$<\/tt> make<\/b> iluminacao<\/span>
\n$<\/tt> .\/anima_telejogo<\/b><\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

<\/p>\n

<\/p>\n
7.1. Descri\u00e7\u00e3o do programa 
\nanima_telejogo.c<\/tt><\/a><\/h1>\n

\n
<\/p>\n

<\/p>\n
A id\u00e9ia central da anima\u00e7\u00e3o neste programa consiste em criar um la\u00e7o que altere as 
\ntransforma\u00e7\u00f5es geom\u00e9tricas presentes na fun\u00e7\u00e3o display<\/tt> . Para isso, \u00e9 utilizada a fun\u00e7\u00e3o
\nglutTimerFunc()<\/tt> , cuja sintaxe \u00e9 dada a seguir.<\/p>\n

<\/p>\n
glutTimerFunc(unsigned int msecs, void (*func)(int value), int value)<\/tt>
\nAssocia uma fun\u00e7\u00e3o de callback<\/i> que deve ser executada de tempos em tempos, definido pelo
\nprimeiro par\u00e2metro msecs<\/i>; o par\u00e2metro func<\/i> corresponde ao nome da fun\u00e7\u00e3o que deve ser 
\nchamada e o par\u00e2metro value<\/i> consiste em um valor inteiro definido pelo usu\u00e1rio, passado
\npara a fun\u00e7\u00e3o func<\/i> e que pode ou n\u00e3o ser utilizado por esta.<\/p>\n

<\/p>\n
A linha de programa<\/p>\n

\n
<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n
\n
  glutTimerFunc(10,bola,1);
\n<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

<\/p>\n
<\/div>\n

<\/p>\n
Define o per\u00edodo entre a execu\u00e7\u00e3o da chamada da fun\u00e7\u00e3o bola<\/tt> de 10msecs e passa
\npara a fun\u00e7\u00e3o o valor inteiro 1. Esse valor poder\u00e1 (ou n\u00e3o) ser utilizado como o 
\nincremento (passo) na posi\u00e7\u00e3o da bola do jogo.<\/p>\n

<\/p>\n

<\/p>\n

<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n
\n
if(direcao==1)
\n{
\nmovebola += 1;
\nif(movebola==290) direcao = 0;
\n}<\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

<\/p>\n
<\/div>\n

<\/p>\n
A vari\u00e1vel movebola<\/i> controla at\u00e9 que posi\u00e7\u00e3o mais a esquerda ou mais a direita a bola 
\npode se locomover, enquanto que a vari\u00e1vel direcao<\/i> controla a mudan\u00e7a de dire\u00e7\u00e3o quando
\na bola atinge esses limites laterais, incrementando ou decrementado a vari\u00e1vel movebola<\/i>.<\/p>\n

<\/p>\n

<\/p>\n

\n
<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n
Prev<\/a><\/td>\n

<\/p>\n
Home<\/a><\/td>\n

<\/p>\n
Next<\/a><\/td>\n<\/tr>\n

<\/p>\n
Exerc\u00edcios<\/td>\n

<\/p>\n
\u00a0<\/td>\n

<\/p>\n
Outros Programas relacionados<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

 
 
 
 
 Introdu\u00e7\u00e3o \u00e0 computa\u00e7\u00e3o gr\u00e1fica com 
 OpenGL 
 
 Prev 
 
 Next 
 
 
 
 Cap\u00edtulo 7. Anima\u00e7\u00e3o 2D 
 
 
 \u00cdndice
 7.1. Descri\u00e7\u00e3o 
 do programa anima_telejogo.c
 7.2. Outros programas relacionados
 7.3. Exerc\u00edcios 
 O prop\u00f3sito desta li\u00e7\u00e3o \u00e9 ilustrar os conceitos 
 envolvidos na gera\u00e7\u00e3o … Continuar lendo Anima\u00e7\u00e3o 2D<\/span><\/a><\/p>\n","protected":false},"author":48,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-42","page","type-page","status-publish","hentry"],"yoast_head":"\nAnima\u00e7\u00e3o 2D - Marco Antonio Garcia de Carvalho, PhD<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Anima\u00e7\u00e3o 2D - Marco Antonio Garcia de Carvalho, PhD\" \/>\n<meta property=\"og:description\" content=\"
 
 
 
 
 Introdu\u00e7\u00e3o \u00e0 computa\u00e7\u00e3o gr\u00e1fica com 
 OpenGL 
 
 Prev 
 
 Next 
 
 
 
 Cap\u00edtulo 7. Anima\u00e7\u00e3o 2D 
 
 
 \u00cdndice
 7.1. Descri\u00e7\u00e3o 
 do programa anima_telejogo.c
 7.2. Outros programas relacionados
 7.3. Exerc\u00edcios 
 O prop\u00f3sito desta li\u00e7\u00e3o \u00e9 ilustrar os conceitos 
 envolvidos na gera\u00e7\u00e3o … Continuar lendo Anima\u00e7\u00e3o 2D\" \/>\n<meta property=\"og:url\" content=\"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/\" \/>\n<meta property=\"og:site_name\" content=\"Marco Antonio Garcia de Carvalho, PhD\" \/>\n<meta property=\"og:image\" content=\"http:\/\/telejogo.jpg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/animacao-2d\\\/\",\"url\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/animacao-2d\\\/\",\"name\":\"Anima\u00e7\u00e3o 2D - Marco Antonio Garcia de Carvalho, PhD\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/#website\"},\"datePublished\":\"2022-03-23T22:08:49+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/animacao-2d\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/animacao-2d\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/animacao-2d\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Anima\u00e7\u00e3o 2D\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/#website\",\"url\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/\",\"name\":\"Marco Antonio Garcia de Carvalho, PhD\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/wordpress.ft.unicamp.br\\\/magic\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Anima\u00e7\u00e3o 2D - Marco Antonio Garcia de Carvalho, PhD","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/","og_locale":"pt_BR","og_type":"article","og_title":"Anima\u00e7\u00e3o 2D - Marco Antonio Garcia de Carvalho, PhD","og_description":"
 
 
 
 
 Introdu\u00e7\u00e3o \u00e0 computa\u00e7\u00e3o gr\u00e1fica com 
 OpenGL 
 
 Prev 
 
 Next 
 
 
 
 Cap\u00edtulo 7. Anima\u00e7\u00e3o 2D 
 
 
 \u00cdndice
 7.1. Descri\u00e7\u00e3o 
 do programa anima_telejogo.c
 7.2. Outros programas relacionados
 7.3. Exerc\u00edcios 
 O prop\u00f3sito desta li\u00e7\u00e3o \u00e9 ilustrar os conceitos 
 envolvidos na gera\u00e7\u00e3o … Continuar lendo Anima\u00e7\u00e3o 2D","og_url":"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/","og_site_name":"Marco Antonio Garcia de Carvalho, PhD","og_image":[{"url":"telejogo.jpg","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. tempo de leitura":"3 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/","url":"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/","name":"Anima\u00e7\u00e3o 2D - Marco Antonio Garcia de Carvalho, PhD","isPartOf":{"@id":"https:\/\/wordpress.ft.unicamp.br\/magic\/#website"},"datePublished":"2022-03-23T22:08:49+00:00","breadcrumb":{"@id":"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/wordpress.ft.unicamp.br\/magic\/animacao-2d\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wordpress.ft.unicamp.br\/magic\/"},{"@type":"ListItem","position":2,"name":"Anima\u00e7\u00e3o 2D"}]},{"@type":"WebSite","@id":"https:\/\/wordpress.ft.unicamp.br\/magic\/#website","url":"https:\/\/wordpress.ft.unicamp.br\/magic\/","name":"Marco Antonio Garcia de Carvalho, PhD","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wordpress.ft.unicamp.br\/magic\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"}]}},"_links":{"self":[{"href":"https:\/\/wordpress.ft.unicamp.br\/magic\/wp-json\/wp\/v2\/pages\/42","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.ft.unicamp.br\/magic\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wordpress.ft.unicamp.br\/magic\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.ft.unicamp.br\/magic\/wp-json\/wp\/v2\/users\/48"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.ft.unicamp.br\/magic\/wp-json\/wp\/v2\/comments?post=42"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.ft.unicamp.br\/magic\/wp-json\/wp\/v2\/pages\/42\/revisions"}],"wp:attachment":[{"href":"https:\/\/wordpress.ft.unicamp.br\/magic\/wp-json\/wp\/v2\/media?parent=42"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}