ces-10 introduÇÃo À computaÇÃo aulas práticas – 2014 capítulo vi desenhos e animação

CES-10 INTRODUÇÃO CES-10 INTRODUÇÃO À COMPUTAÇÃOÀ COMPUTAÇÃO

Aulas Práticas – 2014Aulas Práticas – 2014

Capítulo VI Capítulo VI

Desenhos e AnimaçãoDesenhos e Animação

Arquivos fornecidos para a aulaArquivos fornecidos para a aula::

CES10 Prat 6 2014.ppt: CES10 Prat 6 2014.ppt: slides da aulaslides da aula

lab_6_ces10_2014.doc:lab_6_ces10_2014.doc: proposta do Lab 6 proposta do Lab 6

conio2.zip: conio2.zip: arquivos para a biblioteca arquivos para a biblioteca conio2conio2 a ser utilizada no a ser utilizada no CodeBlocks CodeBlocks (Aba (Aba CódigosCódigos da página do prof); contém:da página do prof); contém:

– conio2.hconio2.h e e libconio.alibconio.a

winbgi.zip:winbgi.zip: arquivos com rotinas gráficas a arquivos com rotinas gráficas a serem utilizadas no serem utilizadas no CodeBlocks CodeBlocks (Aba (Aba CódigosCódigos da página do prof); contém:da página do prof); contém:

– winbgi.cwinbgi.c e e winbgi.hwinbgi.h

Instruções para usar o conio2 no Instruções para usar o conio2 no CodeBlocks:CodeBlocks:

Adaptação de documento do Prof. Paulo André Adaptação de documento do Prof. Paulo André Lima de CastroLima de Castro

1.1.Copiar o arquivo Copiar o arquivo conio2.hconio2.h para para C:\Arquivos C:\Arquivos de Programas (x86) \CodeBlocks\MingW\de Programas (x86) \CodeBlocks\MingW\includeinclude

2.2.Copiar o arquivo Copiar o arquivo libconio.alibconio.a para para C:\ Arquivos C:\ Arquivos de Programas (x86) \CodeBlocks\MingW \de Programas (x86) \CodeBlocks\MingW \liblib

3.3.Abrir o Abrir o CodeBlocksCodeBlocks e entrar no menu e entrar no menu Settings → CompilerSettings → Compiler

Instruções para usar o conio2 no Instruções para usar o conio2 no CodeBlocks:CodeBlocks:

4.4.Clicar no botão Clicar no botão “Linker Settings”“Linker Settings”

5.5.Abaixo do quadro Abaixo do quadro “Link libraries”“Link libraries”, clicar no , clicar no botão botão “Add”“Add”

6.6.Escrever na janelinha Escrever na janelinha “Add library”“Add library” o o seguinte: seguinte: libconio.alibconio.a

7.7.No programa, colocar: No programa, colocar: #include <conio2.h>#include <conio2.h>textbackground () – Seta a cor de fundotextcolor () – Seta a cor do textoclrscr () – Limpa a telagotoxy () – Coloca o cursor em uma posição da tela

Algumas funções do conio2:

Programa 6.1: Posicionamento do cursor no Programa 6.1: Posicionamento do cursor no vídeo-textovídeo-texto

#include <stdio.h>#include <stdio.h>

#include <conio.h>#include <conio.h>

#include <conio2.h>#include <conio2.h>

int main () {int main () {

int col, lin; char c;int col, lin; char c;

printf ("Maximize a tela e digite algo: "); printf ("Maximize a tela e digite algo: ");

getche (); clrscr ();getche (); clrscr ();

printf ("Posicionar cursor? (s/n): "); printf ("Posicionar cursor? (s/n): ");

c = getche();c = getche();

while (c == 's' || c == 'S') {while (c == 's' || c == 'S') {

printf ("\rDigite a coluna e a linha: ");printf ("\rDigite a coluna e a linha: ");

scanf ("%d%d", &col, &lin);scanf ("%d%d", &col, &lin);

gotoxy (col, lin); getche ();gotoxy (col, lin); getche ();

gotoxy (1, 1);gotoxy (1, 1);

printf (" ");printf (" ");

printf ("\rPosicionar cursor? (s/n): "); c = getche();}printf ("\rPosicionar cursor? (s/n): "); c = getche();}

return 0;return 0;

}}

Copiar, salvar e executar

clrscr (conio2.h): limpa a tela\r: reescreve a 1ª linha da telaPosiciona o cursor nas coordenadas desejadas – digitar um caractere

Posiciona o cursor na coluna e linha 1Limpa a 1ª linha\r: reescreve a 1ª linha da tela

Programa 6.2: Determinação dos limites do Programa 6.2: Determinação dos limites do gotoxygotoxy





int i, n;int i, n;

printf ("TESTE DO LIMITE DE LINHAS DO GOTOXY");printf ("TESTE DO LIMITE DE LINHAS DO GOTOXY");

printf ("\n\n\tDigite o numero de linhas: ");printf ("\n\n\tDigite o numero de linhas: ");

scanf ("%d", &n);scanf ("%d", &n);

printf ("\nMaximize a tela e digite algo!");printf ("\nMaximize a tela e digite algo!");


for (i=1; i<=n; i++) {for (i=1; i<=n; i++) {

gotoxy ((i-1)%80+1, i); printf ("%d", i%10);gotoxy ((i-1)%80+1, i); printf ("%d", i%10);

}}

printf ("\nDigite algo para encerrar: ");printf ("\nDigite algo para encerrar: ");

getch ();getch ();

return 0;return 0;

}}


Experimentar os seguintes valores para n:40, 53, 60, 80, 200, 300, 400

Colunas variam de 1 a 80

Valores escritos variam de 0 a 9

Qual o limite de linhas atingidas pelo gotoxy?Qual o número de linhas da tela maximizada?

Limites no Borland (n = 80):

Coluna 80Linha 44

Programa 6.3: Passeio do ‘*’ pelo vídeo-textoPrograma 6.3: Passeio do ‘*’ pelo vídeo-texto





int i, j, demora = 20000000;int i, j, demora = 20000000;



for (i = 10; i <= 60; i++) {for (i = 10; i <= 60; i++) {

gotoxy (i, 5); printf (" *");gotoxy (i, 5); printf (" *");

for (j = 1; j <= demora; j++);}for (j = 1; j <= demora; j++);}

for (i = 6; i <= 40; i++) {for (i = 6; i <= 40; i++) {

gotoxy (61, i-1); printf (" ");gotoxy (61, i-1); printf (" ");

gotoxy (61, i); printf ("*");gotoxy (61, i); printf ("*");

for (j = 1; j <= demora; j++);for (j = 1; j <= demora; j++);

}}

printf ("\n\nDigite algo para encerrar: ");printf ("\n\nDigite algo para encerrar: ");

getch (); return 0;getch (); return 0;

}}










for (i = 10; i <= 60; i++) {for (i = 10; i <= 60; i++) {



for (i = 6; i <= 40; i++) {for (i = 6; i <= 40; i++) {




}}



}}

Para i = 10, na linha 5:

Escreve ‘ ’ na coluna 10 e ‘*’ na coluna 11

Para i = 11, na linha 5:

Escreve ‘ ’ na coluna 11, apagando ‘*’

Escreve ‘*’ na coluna 12

Dá a impressão de movimento do ‘*’ uma posição p/direita

Para i = 60, ‘*’ vai para a coluna 61









for (i = 10; i <= 60; i++) {for (i = 10; i <= 60; i++) {


for (j = 1; j <= demora; j++);for (j = 1; j <= demora; j++);}}

for (i = 6; i <= 40; i++) {for (i = 6; i <= 40; i++) {




}}



}}

Faz ‘*’ permanecer numa posição durante um t perceptível

O valor 20.000.000 para ‘demora’ é experimental

Esse valor pode variar com o computador









for (i = 10; i <= 60; i++) {for (i = 10; i <= 60; i++) {



for (i = 6; i <= 40; i++) {for (i = 6; i <= 40; i++) {




}}



}}

Para i = 6, na coluna 61:

Escreve ‘ ’ na linha 5, apagando ‘*’

Escreve ‘*’ na linha 6

Dá a impressão de movimento do ‘*’ uma posição p/baixo

Para i = 40, ‘*’ vai para a linha 40









for (i = 10; i <= 60; i++) {for (i = 10; i <= 60; i++) {



for (i = 6; i <= 40; i++) {for (i = 6; i <= 40; i++) {




}}



}}

Também faz ‘*’ permanecer numa posição durante um t perceptível

Rotinas gráficas:Rotinas gráficas:

Rotinas gráficasRotinas gráficas são necessárias para vários são necessárias para vários programas profissionaisprogramas profissionais

A A Linguagem CLinguagem C padrão não define rotinas padrão não define rotinas gráficasgráficas

Foram criados independentemente vários Foram criados independentemente vários conjuntos de rotinas gráficas, tais como o conjuntos de rotinas gráficas, tais como o Microsoft C/C++Microsoft C/C++ para DOS e o para DOS e o Borland Borland Graphics InterfaceGraphics Interface ( (BGIBGI))

Nestas aulas será utilizado um Nestas aulas será utilizado um conjunto de conjunto de rotinasrotinas, elaborado pelo Prof. Carlos Henrique , elaborado pelo Prof. Carlos Henrique Quartucci Forster, conjunto esse que é uma Quartucci Forster, conjunto esse que é uma imitação da imitação da BGIBGI

Instalação das rotinas gráficas no CodeBlocks:Instalação das rotinas gráficas no CodeBlocks:

Arquivos necessários Arquivos necessários (compactados em (compactados em winbgi.zipwinbgi.zip)): :

winbgi.h: winbgi.h: copiá-lo em copiá-lo em CodeBlocks\MingW\CodeBlocks\MingW\include include

winbgi.c: winbgi.c: guardá-lo em alguma pasta de sua guardá-lo em alguma pasta de sua biblioteca, para depois adicioná-lo ao projeto do biblioteca, para depois adicioná-lo ao projeto do programaprograma

Uso de projetos:Uso de projetos:

Para trabalhar em Para trabalhar em modo gráficomodo gráfico será necessário será necessário utilizar o conceito de utilizar o conceito de projeto projeto

ProjetoProjeto é um é um containercontainer que armazena todos os que armazena todos os elementos (elementos (arquivosarquivos) que compõem um programa) que compõem um programa

Criando um novo projeto no ambiente Criando um novo projeto no ambiente CodeBlocks:CodeBlocks:

Clicar no menu Clicar no menu "File""File" e selecionar e selecionar "New""New", , "Project... ""Project... "

Escolher Escolher “Win32 GUI project"“Win32 GUI project" e clicar em e clicar em “Go”“Go”, , “Next”“Next”, , “Next”“Next”

Escolher um Escolher um títulotítulo para o projeto para o projeto Pode-se dar qualquer nome válido para um Pode-se dar qualquer nome válido para um

arquivo, por exemplo, arquivo, por exemplo, “FigurasGeometricas”“FigurasGeometricas”


Escolher uma pasta Escolher uma pasta onde salvaronde salvar o projeto clicar o projeto clicar em em “OK”“OK”

– Dentro dessa pasta será criada uma pasta com Dentro dessa pasta será criada uma pasta com o nome do projeto (por exemplo, o nome do projeto (por exemplo, FigurasGeometricasFigurasGeometricas) )

– Dentro dessa última será criado um arquivo Dentro dessa última será criado um arquivo com o nome do projeto, com extensão com o nome do projeto, com extensão .cbp .cbp (por exemplo, (por exemplo, FigurasGeometricas.cbpFigurasGeometricas.cbp))

Em seguida, clicar em Em seguida, clicar em “Next”“Next”, , “Finish”“Finish”


Na coluna Na coluna “Management”“Management” do ambiente do ambiente aparecerá o projetoaparecerá o projeto

Expandir Expandir “Sources”“Sources”

Clicar com o botão direito doClicar com o botão direito do

mouse em mouse em “main.cpp” “main.cpp” e e

removê-loremovê-lo

Adicionando ao projeto arquivos existentes:Adicionando ao projeto arquivos existentes:

Duas formas:Duas formas:

Clicar no menu Clicar no menu "Project""Project" e selecionar e selecionar “Add “Add files...”files...”

Ou então, na coluna Ou então, na coluna “Management”“Management”, clicar com , clicar com o botão direito do mouse no nome do projeto e o botão direito do mouse no nome do projeto e clicar com o esquerdo em clicar com o esquerdo em “Add files...”“Add files...”

É só procurar os arquivos a serem adicionados e É só procurar os arquivos a serem adicionados e clicar nelesclicar neles

Para adicionar um novo arquivo contendo código Para adicionar um novo arquivo contendo código para o programa, deve-se para o programa, deve-se editá-loeditá-lo, , salvá-losalvá-lo e e adicioná-loadicioná-lo ao projeto ao projeto

Usando a biblioteca gráfica no projeto:Usando a biblioteca gráfica no projeto:

Criado o projeto, deve-se adicionar a ele o Criado o projeto, deve-se adicionar a ele o arquivo arquivo “winbgi.c” “winbgi.c”

Ao editar o programa colocar Ao editar o programa colocar “include “include <winbgi.h>”<winbgi.h>” e também uma função e também uma função int mainint main com chamadas para funções gráficascom chamadas para funções gráficas

Programa 6.4: Desenho simples no vídeo-Programa 6.4: Desenho simples no vídeo-gráficográfico


#include <winbgi.h>#include <winbgi.h>



int left, top, bottom, right, i, j;int left, top, bottom, right, i, j;

start_graphics (); getch ();start_graphics (); getch ();

setbkcolor (LIGHTBLUE);setbkcolor (LIGHTBLUE);

cleardevice (); getch ();cleardevice (); getch ();

left = 160; right = 400; top = 80; bottom = 320;left = 160; right = 400; top = 80; bottom = 320;

for (i = top; i <= bottom; i++)for (i = top; i <= bottom; i++)

for (j = left; j <= right; j++)for (j = left; j <= right; j++)

putpixel (j, i, RED);putpixel (j, i, RED);

getch ();getch ();

closegraph ( );closegraph ( );

return 0;return 0;

}}

- Criar projeto- Adicionar este arquivo ao projeto- Adicionar winbgi.c ao projeto- Salvar e executar

Pede o número de colunas e linhas da janela gráfica a ser aberta, abrindo a em seguida

Colore o pixel [j, i] com a cor RED

Limpa a janela criada, colorindo-a com a cor de fundo corrente (LIGHTBLUE)

Lista de cores disponíveis em winbgi.h:Lista de cores disponíveis em winbgi.h:

DARKGRAYDARKGRAY REDRED

GREENGREEN BLUEBLUE

MAGENTAMAGENTA YELLOWYELLOW

CYANCYAN LIGHTGRAYLIGHTGRAY

GRAYGRAY BLACKBLACK

WHITEWHITE LIGHTREDLIGHTRED

LIGHTGREENLIGHTGREEN LIGHTBLUELIGHTBLUE

LIGHTMAGENTALIGHTMAGENTA LIGHTYELLOWLIGHTYELLOW

LIGHTCYANLIGHTCYAN BROWNBROWN

LIGHTBROWNLIGHTBROWN DARKBROWNDARKBROWN

ORANGEORANGE LIGHTORANGELIGHTORANGE

Programa 6.5: Desenho de várias figurasPrograma 6.5: Desenho de várias figuras


#include <winbgi.h>#include <winbgi.h>



int left, top, bottom, right, i, j;int left, top, bottom, right, i, j;

/* Abrir janela grafica *//* Abrir janela grafica */

start_graphics(); getch ();start_graphics(); getch ();

setbkcolor(LIGHTBLUE);setbkcolor(LIGHTBLUE);

cleardevice();cleardevice();

/* Colorir uma area quadrada de pixels *//* Colorir uma area quadrada de pixels */

getch ();getch ();


for (i = top; i <= bottom; i++)for (i = top; i <= bottom; i++)

for (j = left; j <= right; j++)for (j = left; j <= right; j++)

putpixel (j, i, RED);putpixel (j, i, RED);

/* Desenhar as bordas de um quadrado *//* Desenhar as bordas de um quadrado */

getch ();getch ();


setcolor (YELLOW); setlinestyle(SOLID_LINE,0,1);setcolor (YELLOW); setlinestyle(SOLID_LINE,0,1);

rectangle (left, top, right, bottom);rectangle (left, top, right, bottom);

/* Preencher um circulo *//* Preencher um circulo */

getch (); setcolor (YELLOW);getch (); setcolor (YELLOW);

setfillstyle(SOLID_FILL,YELLOW);setfillstyle(SOLID_FILL,YELLOW);

fillcircle (280, 200, 120);fillcircle (280, 200, 120);

/* Desenhar as bordas de um circulo *//* Desenhar as bordas de um circulo */

getch (); setcolor (BLACK);getch (); setcolor (BLACK);

circle (280, 200, 120);circle (280, 200, 120);

/* Preencher uma elipse com eixos paralelos aos eixos /* Preencher uma elipse com eixos paralelos aos eixos coordenados */coordenados */

getch (); setcolor (LIGHTGRAY);getch (); setcolor (LIGHTGRAY);

setfillstyle(SOLID_FILL,LIGHTGRAY);setfillstyle(SOLID_FILL,LIGHTGRAY);

fillelipse (680, 400, 200, 150);fillelipse (680, 400, 200, 150);

/* Desenhar as bordas de uma elipse com eixos paralelos /* Desenhar as bordas de uma elipse com eixos paralelos aos eixos coordenados */aos eixos coordenados */

getch (); setcolor (RED);getch (); setcolor (RED);

elipse (680, 400, 200, 150);elipse (680, 400, 200, 150);

/* Desenhar um segmento de reta *//* Desenhar um segmento de reta */

getch ();getch ();

setcolor (WHITE);setcolor (WHITE);

line (40, 480, 640, 80);line (40, 480, 640, 80);

/* Preencher um retangulo com textura e cor *//* Preencher um retangulo com textura e cor */

getch ();getch ();


setcolor (DARKGRAY);setcolor (DARKGRAY);

setfillstyle(DOTTED_LINE, BROWN);setfillstyle(DOTTED_LINE, BROWN);

setlinestyle(DOTTED_LINE,0,1);setlinestyle(DOTTED_LINE,0,1);

bar (left, top, right, bottom);bar (left, top, right, bottom);

/* Preencher outro retangulo com textura e cor *//* Preencher outro retangulo com textura e cor */

getch ();getch ();


setcolor (BLACK);setcolor (BLACK);

setfillstyle(SOLID_FILL, BROWN);setfillstyle(SOLID_FILL, BROWN);

setlinestyle(SOLID_LINE,0,5);setlinestyle(SOLID_LINE,0,5);

bar (left, top, right, bottom);bar (left, top, right, bottom);

/* Escrever um texto *//* Escrever um texto */

getch ();getch ();

outtextxy(150, 515, "Teste");outtextxy(150, 515, "Teste");

/* Fechar janela grafica *//* Fechar janela grafica */

getch ();getch ();

closegraph ( );closegraph ( );

return 0;return 0;

}}

Mais detalhes sobre rotinas gráficas:

Abrir os arquivos winbgi.h e winbgi.c

Consultar a Internet

Estas rotinas têm alguns defeitos:

outtextxy só escreve junto com o próximo desenho ou com o fechamento da tela

setlinestyle só desenha linha pontilhada com espessura mínima

ces-10 introduÇÃo À computaÇÃo aulas práticas – 2014 capítulo vi desenhos e animação

Documents