CES-10 INTRODUÇÃO À COMPUTAÇÃO Aulas Práticas – 2014 Capítulo VI Desenhos e Animação.

Apresentação em tema: "CES-10 INTRODUÇÃO À COMPUTAÇÃO Aulas Práticas – 2014 Capítulo VI Desenhos e Animação."— Transcrição da apresentação:

1 CES-10 INTRODUÇÃO À COMPUTAÇÃO Aulas Práticas – 2014 Capítulo VI Desenhos e Animação

2 Arquivos fornecidos para a aula : CES10 Prat 6 2014.ppt: slides da aula CES10 Prat 6 2014.ppt: slides da aula lab_6_ces10_2014.doc: proposta do Lab 6 lab_6_ces10_2014.doc: proposta do Lab 6 conio2.zip: arquivos para a biblioteca conio2 a ser utilizada no CodeBlocks (Aba Códigos da página do prof); contém: conio2.zip: arquivos para a biblioteca conio2 a ser utilizada no CodeBlocks (Aba Códigos da página do prof); contém: – conio2.h e libconio.a winbgi.zip: arquivos com rotinas gráficas a serem utilizadas no CodeBlocks (Aba Códigos da página do prof); contém: winbgi.zip: arquivos com rotinas gráficas a serem utilizadas no CodeBlocks (Aba Códigos da página do prof); contém: – winbgi.c e winbgi.h

3 Instruções para usar o conio2 no CodeBlocks: Adaptação de documento do Prof. Paulo André Lima de Castro Adaptação de documento do Prof. Paulo André Lima de Castro 1.Copiar o arquivo conio2.h para C:\Arquivos de Programas (x86) \CodeBlocks\MingW\include 2.Copiar o arquivo libconio.a para C:\ Arquivos de Programas (x86) \CodeBlocks\MingW \lib 3.Abrir o CodeBlocks e entrar no menu Settings → Compiler

4 Instruções para usar o conio2 no CodeBlocks: 4.Clicar no botão “Linker Settings” 5.Abaixo do quadro “Link libraries”, clicar no botão “Add” 6.Escrever na janelinha “Add library” o seguinte: libconio.a 7.No programa, colocar: #include 7.No programa, colocar: #include textbackground () – Seta a cor de fundo textcolor () – Seta a cor do texto clrscr () – Limpa a tela gotoxy () – Coloca o cursor em uma posição da tela Algumas funções do conio2:

5 Programa 6.1: Posicionamento do cursor no vídeo-texto #include #include int main () { int col, lin; char c; printf ("Maximize a tela e digite algo: "); getche (); clrscr (); printf ("Posicionar cursor? (s/n): "); printf ("Posicionar cursor? (s/n): "); c = getche(); while (c == 's' || c == 'S') { 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; } Copiar, salvar e executar clrscr (conio2.h): limpa a tela \r: reescreve a 1ª linha da tela Posiciona o cursor nas coordenadas desejadas – digitar um caractere Posiciona o cursor na coluna e linha 1 Limpa a 1ª linha \r: reescreve a 1ª linha da tela

6 Programa 6.2: Determinação dos limites do gotoxy #include #include int main () { int i, n; printf ("TESTE DO LIMITE DE LINHAS DO GOTOXY"); printf ("\n\n\tDigite o numero de linhas: "); scanf ("%d", &n); printf ("\nMaximize a tela e digite algo!"); getche (); clrscr (); for (i=1; i<=n; i++) { gotoxy ((i-1)%80+1, i); printf ("%d", i%10); } printf ("\nDigite algo para encerrar: "); printf ("\nDigite algo para encerrar: "); getch (); return 0; } Copiar, salvar e executar 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?

7 Limites no Borland (n = 80): Coluna 80 Linha 44

8 Programa 6.3: Passeio do ‘*’ pelo vídeo-texto #include #include int main () { int i, j, demora = 20000000; printf ("Maximize a tela e digite algo: "); getche (); clrscr (); for (i = 10; i <= 60; i++) { gotoxy (i, 5); printf (" *"); for (j = 1; j <= demora; j++);} for (i = 6; i <= 40; i++) { gotoxy (61, i-1); printf (" "); gotoxy (61, i); printf ("*"); for (j = 1; j <= demora; j++); } printf ("\n\nDigite algo para encerrar: "); printf ("\n\nDigite algo para encerrar: "); getch (); return 0; } Copiar, salvar e executar

9 Programa 6.3: Passeio do ‘*’ pelo vídeo-texto #include #include int main () { int i, j, demora = 20000000; printf ("Maximize a tela e digite algo: "); getche (); clrscr (); for (i = 10; i <= 60; i++) { gotoxy (i, 5); printf (" *"); for (j = 1; j <= demora; j++);} for (i = 6; i <= 40; i++) { gotoxy (61, i-1); printf (" "); gotoxy (61, i); printf ("*"); for (j = 1; j <= demora; j++); } printf ("\n\nDigite algo para encerrar: "); printf ("\n\nDigite algo para encerrar: "); getch (); return 0; } 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

10 Programa 6.3: Passeio do ‘*’ pelo vídeo-texto #include #include int main () { int i, j, demora = 20000000; printf ("Maximize a tela e digite algo: "); getche (); clrscr (); for (i = 10; i <= 60; i++) { gotoxy (i, 5); printf (" *"); for (j = 1; j <= demora; j++);} for (i = 6; i <= 40; i++) { gotoxy (61, i-1); printf (" "); gotoxy (61, i); printf ("*"); for (j = 1; j <= demora; j++); } printf ("\n\nDigite algo para encerrar: "); printf ("\n\nDigite algo para encerrar: "); getch (); return 0; } 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

11 Programa 6.3: Passeio do ‘*’ pelo vídeo-texto #include #include int main () { int i, j, demora = 20000000; printf ("Maximize a tela e digite algo: "); getche (); clrscr (); for (i = 10; i <= 60; i++) { gotoxy (i, 5); printf (" *"); for (j = 1; j <= demora; j++);} for (i = 6; i <= 40; i++) { gotoxy (61, i-1); printf (" "); gotoxy (61, i); printf ("*"); for (j = 1; j <= demora; j++); } printf ("\n\nDigite algo para encerrar: "); printf ("\n\nDigite algo para encerrar: "); getch (); return 0; } 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

12 Programa 6.3: Passeio do ‘*’ pelo vídeo-texto #include #include int main () { int i, j, demora = 20000000; printf ("Maximize a tela e digite algo: "); getche (); clrscr (); for (i = 10; i <= 60; i++) { gotoxy (i, 5); printf (" *"); for (j = 1; j <= demora; j++);} for (i = 6; i <= 40; i++) { gotoxy (61, i-1); printf (" "); gotoxy (61, i); printf ("*"); for (j = 1; j <= demora; j++); } printf ("\n\nDigite algo para encerrar: "); printf ("\n\nDigite algo para encerrar: "); getch (); return 0; } Também faz ‘*’ permanecer numa posição durante um  t perceptível

13 Rotinas gráficas: Rotinas gráficas são necessárias para vários programas profissionais Rotinas gráficas são necessárias para vários programas profissionais A Linguagem C padrão não define rotinas gráficas A Linguagem C padrão não define rotinas gráficas Foram criados independentemente vários conjuntos de rotinas gráficas, tais como o Microsoft C/C++ para DOS e o Borland Graphics Interface (BGI) Foram criados independentemente vários conjuntos de rotinas gráficas, tais como o Microsoft C/C++ para DOS e o Borland Graphics Interface (BGI) Nestas aulas será utilizado um conjunto de rotinas, elaborado pelo Prof. Carlos Henrique Quartucci Forster, conjunto esse que é uma imitação da BGI Nestas aulas será utilizado um conjunto de rotinas, elaborado pelo Prof. Carlos Henrique Quartucci Forster, conjunto esse que é uma imitação da BGI

14 Instalação das rotinas gráficas no CodeBlocks: Arquivos necessários (compactados em winbgi.zip): Arquivos necessários (compactados em winbgi.zip):  winbgi.h: copiá-lo em CodeBlocks\MingW\include  winbgi.c: guardá-lo em alguma pasta de sua biblioteca, para depois adicioná-lo ao projeto do programa Uso de projetos: Uso de projetos:  Para trabalhar em modo gráfico será necessário utilizar o conceito de projeto  Projeto é um container que armazena todos os elementos (arquivos) que compõem um programa

15 Criando um novo projeto no ambiente CodeBlocks: Clicar no menu "File" e selecionar "New", "Project... " Clicar no menu "File" e selecionar "New", "Project... " Escolher “Win32 GUI project" e clicar em “Go”, “Next”, “Next” Escolher “Win32 GUI project" e clicar em “Go”, “Next”, “Next” Escolher um título para o projeto Escolher um título para o projeto  Pode-se dar qualquer nome válido para um arquivo, por exemplo, “FigurasGeometricas”

16 Criando um novo projeto no ambiente CodeBlocks: Escolher uma pasta onde salvar o projeto clicar em “OK” Escolher uma pasta onde salvar o projeto clicar em “OK” – Dentro dessa pasta será criada uma pasta com o nome do projeto (por exemplo, FigurasGeometricas) – Dentro dessa última será criado um arquivo com o nome do projeto, com extensão.cbp (por exemplo, FigurasGeometricas.cbp) Em seguida, clicar em “Next”, “Finish” Em seguida, clicar em “Next”, “Finish”

17 Criando um novo projeto no ambiente CodeBlocks: Na coluna “Management” do ambiente aparecerá o projeto Na coluna “Management” do ambiente aparecerá o projeto Expandir “Sources” Expandir “Sources” Clicar com o botão direito do Clicar com o botão direito do mouse em “main.cpp” e removê-lo

18 Adicionando ao projeto arquivos existentes: Duas formas: Duas formas:  Clicar no menu "Project" e selecionar “Add files...”  Ou então, na coluna “Management”, clicar com o botão direito do mouse no nome do projeto e clicar com o esquerdo em “Add files...” É só procurar os arquivos a serem adicionados e clicar neles É só procurar os arquivos a serem adicionados e clicar neles Para adicionar um novo arquivo contendo código para o programa, deve-se editá-lo, salvá-lo e adicioná-lo ao projeto Para adicionar um novo arquivo contendo código para o programa, deve-se editá-lo, salvá-lo e adicioná-lo ao projeto

19 Usando a biblioteca gráfica no projeto: Criado o projeto, deve-se adicionar a ele o arquivo “winbgi.c” Criado o projeto, deve-se adicionar a ele o arquivo “winbgi.c” Ao editar o programa colocar “include ” e também uma função int main com chamadas para funções gráficas Ao editar o programa colocar “include ” e também uma função int main com chamadas para funções gráficas

20 Programa 6.4: Desenho simples no vídeo-gráfico #include #include int main () { int left, top, bottom, right, i, j; int left, top, bottom, right, i, j; start_graphics (); getch (); setbkcolor (LIGHTBLUE); setbkcolor (LIGHTBLUE); cleardevice (); getch (); cleardevice (); getch (); left = 160; right = 400; top = 80; bottom = 320; for (i = top; i <= bottom; i++) for (j = left; j <= right; j++) putpixel (j, i, RED); 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)

21 Lista de cores disponíveis em winbgi.h: DARKGRAYRED GREENBLUE MAGENTAYELLOW CYANLIGHTGRAY GRAYBLACK WHITELIGHTRED LIGHTGREENLIGHTBLUE LIGHTMAGENTALIGHTYELLOW LIGHTCYANBROWN LIGHTBROWNDARKBROWN ORANGELIGHTORANGE

22 Programa 6.5: Desenho de várias figuras #include #include int main () { int left, top, bottom, right, i, j; int left, top, bottom, right, i, j; /* Abrir janela grafica */ start_graphics(); getch (); setbkcolor(LIGHTBLUE); cleardevice(); cleardevice();

23 /* Colorir uma area quadrada de pixels */ getch (); getch (); left = 160; right = 400; top = 80; bottom = 320; for (i = top; i <= bottom; i++) for (j = left; j <= right; j++) putpixel (j, i, RED); /* Desenhar as bordas de um quadrado */ getch (); left = 160; right = 400; top = 80; bottom = 320; setcolor (YELLOW); setlinestyle(SOLID_LINE,0,1); setcolor (YELLOW); setlinestyle(SOLID_LINE,0,1); rectangle (left, top, right, bottom); /* Preencher um circulo */ getch (); setcolor (YELLOW); setfillstyle(SOLID_FILL,YELLOW); setfillstyle(SOLID_FILL,YELLOW); fillcircle (280, 200, 120);

24 /* Desenhar as bordas de um circulo */ getch (); setcolor (BLACK); circle (280, 200, 120); /* Preencher uma elipse com eixos paralelos aos eixos coordenados */ getch (); setcolor (LIGHTGRAY); setfillstyle(SOLID_FILL,LIGHTGRAY); setfillstyle(SOLID_FILL,LIGHTGRAY); fillelipse (680, 400, 200, 150); /* Desenhar as bordas de uma elipse com eixos paralelos aos eixos coordenados */ getch (); setcolor (RED); elipse (680, 400, 200, 150);

25 /* Desenhar um segmento de reta */ getch (); setcolor (WHITE); setcolor (WHITE); line (40, 480, 640, 80); /* Preencher um retangulo com textura e cor */ getch (); getch (); left = 80; right = 560; top = 400; bottom = 450; setcolor (DARKGRAY); setfillstyle(DOTTED_LINE, BROWN); setlinestyle(DOTTED_LINE,0,1); setlinestyle(DOTTED_LINE,0,1); bar (left, top, right, bottom);

26 /* Preencher outro retangulo com textura e cor */ getch (); getch (); left = 100; right = 700; top = 500; bottom = 550; setcolor (BLACK); setfillstyle(SOLID_FILL, BROWN); setlinestyle(SOLID_LINE,0,5); setlinestyle(SOLID_LINE,0,5); bar (left, top, right, bottom); /* Escrever um texto */ getch (); outtextxy(150, 515, "Teste"); outtextxy(150, 515, "Teste"); /* Fechar janela grafica */ 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