CRAb Grupo de Computação Gráfica Departamento de Computação UFC

Transcrição

1 Computação Gráfica I CRAb Grupo de Computação Gráfica Departamento de Computação UFC

2 Objetivos Estudar equipamentos, técnicas de programação e conceitos matemáticos Para representação, manipulação e projeção de objetos bi- e tridimensionais aplicar a problemas específicos 2

3 Sumário do Curso Sistemas Gráficos e Modelos Programação Gráfica Input e Interação Objetos Geométricos e Transformações Visualização Pintura Técnicas Discretas Implementação de um Renderizador 3

4 3. Input e Interação

5 3.1 Interação Era da computação gráfica interativa Paradigma Usuário vê imagem na tela Reage à imagem através de um dispositivo de interação A imagem muda em resposta ao input OpenGL não dá suporte a interação Razões de portabilidade Utilizar um toolkit como o GLUT 5

6 3.2 Dispositivos de Entrada (A9) Introdução Dispositivos físicos Teclado Mouse Space ball Light pen Dispositivos lógicos Propriedades são especificadas por funcionalidade para o programa de aplicação 6

7 3.2 Dispositivos de Entrada (A9) Dispositivos físicos Dois tipos principais Pointing devices (Apontadores) Keyboard devices (Teclados) Apontadores Permite ao usuário indicar uma posição na tela Têm um ou mais botões para enviar sinais ao computador 7

8 3.2 Dispositivos de Entrada (A9) Keaboard Geralmente é o teclado físico Pode ser generalizado para qualquer dispositivo que retorne códigos de caracteres ao programa 8

9 3.2 Dispositivos de Entrada (A9) Mouse e Trackball Semelhantes em uso e em construção Mecânico Codificadores dentro do dispositivo Codificadores giram quando a bola se move Movimento da bola é convertido em sinais Sinais enviados ao computador por pares de codificadores Codificadores medem movimentos em duas direções ortogonais 9

10 3.2 Dispositivos de Entrada (A9) Mouse e Trackball Detectores Ópticos Medem distância percorrida, contando linhas em uma plaqueta especial (pad) Dois valores retornados podem ser vistos como duas posições independentes Convertidos em uma posição 2D em» Coordenadas do mundo ou» Coordenadas da tela Conversão é feita» Pelo sistema gráfico ou» Pelo programa de aplicação 10

11 3.2 Dispositivos de Entrada (A9) Mouse e Trackball Dois valores retornados podem ser vistos também como duas velocidades independentes Computador integra esses valores para obter posições Mudanças lentas pequenas distâncias Mudanças rápidas grandes distâncias v x v y x y 11

12 3.2 Dispositivos de Entrada (A9) Mouse e Trackball São dispositivos de posicionamento relativo Se a bola não girar, a coordenada não muda Posição absoluta da bola (ou do mouse) não é utilizada Não são adequados para traçados de diagramas 12

13 3.2 Dispositivos de Entrada (A9) Tablets Fornecem posicionamento absoluto Matriz de linhas e colunas de fios é embutida sob a superfícies do tablet Posição da caneta é detectada pela interação de sinais eletromagnéticos percorrendo os fios do tablet com os sensores da caneta 13

14 3.2 Dispositivos de Entrada (A9) Telas sensíveis ao toque Funcionamento parecido com o tablet Touchpads podem ser configurados como Posicionador absoluto ou Posicionador relativo 14

15 3.2 Dispositivos de Entrada (A9) Lightpen Contem um sensor luminoso (Célula fotoelétrica) Quando a luz emitida pelo fósforo excede um limiar, Sensor detecta a luz Caneta emite sinal ao computador Como o ciclo de retraçarmento do Frame buffer inicia em um tempo determinado, t 0, calcula-se t=t s -t o e pode-se determinar a posição na tela. Dispositivo de posicionamento direto Dificuldade de obter posição de regiões escuras 15

16 3.2 Dispositivos de Entrada (A9) Joystick Movimentos em 2 direções ortogonais são codificados (potenciômetro + capacitor) 16

17 3.2 Dispositivos de Entrada (A9) Dispositivos lógicos Dispositivos de entrada classificados pela ótica do programa aplicativo Duas características comportamentais dos dispositivos de entrada A medida que o dispositivo retorna ao programa O tempo em que o dispositivo retorna a medida 17

18 3.2 Dispositivos de Entrada (A9) Classes de dispositivos lógicos (PHIGS e GKS) String Locator Pick Choice Dial Stroke OpenGL não adota essa classificação 18

19 3.2 Dispositivos de Entrada (A9) String Fornece ASCII strings ao programa aplicativo Implementado pelo Teclado físico ou Teclado virtual 19

20 3.2 Dispositivos de Entrada (A9) Locator Fornece posição em coordenadas do mundo ao programa de aplicação Implementado por dispositivos apontadores como Mouse Trackball No OpenGL conversão de coordenadas do dispositivo para coordenadas do mundo é feita pelo programa aplicativo 20

21 3.2 Dispositivos de Entrada (A9) Pick Retorna o identificador de um objeto ao programa aplicativo Implementado pelos mesmos dispositivos físicos que implementam locator Mouse Trackball Interface de software é diferente da do locator No OpenGL pode-se usar um processo chamado selection para o picking 21

22 3.2 Dispositivos de Entrada (A9) Choice Permite que o usuário selecione uma dentre um número discreto de opções No OpenGL podem ser usadas widgets fornecidas pelo sistema de janelas Widgets são dispositivos de interface gráfica Menus Scrollbars Botões gráficos Teclas de funções 22

23 3.2 Dispositivos de Entrada (A9) Dial ou valuators Provê entrada analógica ao programa aplicativo Usar widgets Slidebars Limitados: controle de volume em rádio 23

24 3.2 Dispositivos de Entrada (A9) Stroke Retorna um array de posições Pressionar um botão do mouse Inicia transferência de posições ao array Liberar o botão do mouse Encerra a transferência 24

25 3.2 Dispositivos de Entrada (A9) Medida e disparo Entidades que descrevem a maneira como um dispositivo de entrada (físico ou lógico) fornece input para o programa aplicativo Medida O que o dispositivo retorna ao programa Disparo É um input físico no dispositivo com o qual o usuário pode enviar sinal ao computador 25

26 3.2 Dispositivos de Entrada (A9) Exemplos: Teclado Medida: string Disparo: Tecla de return ou Enter Locator Medida: posição Disparo: Botão do mouse ou da trackball Medida pode incluir informação de status Ajuda a identificar quando houve um disparo indevido 26

27 3.2 Dispositivos de Entrada (A9) Modos de entrada Pode-se obter a medida em 3 modos Cada modo é definido pela relação entre Processo de medida e Disparo Inicialização de um dispositivo de entrada Inicia o processo de medida Pode necessitar uma chamada explícita a uma função da API Medidas são colocadas em um buffer 27

28 3.2 Dispositivos de Entrada (A9) Request Mode (Solicitação) Medida só retorna ao programa após um disparo Processo de disparo Disparo Processo de medida Request Medida Programa 28

29 3.2 Dispositivos de Entrada (A9) Request Mode Exemplo 1: comando scanf Programa pára nesse comando Usuário pressiona as teclas, escrevendo a string Pode demorar o tempo que quiser Os caracteres são colocados em um keyboard buffer Conteúdo do buffer retorna ao programa após a tecla return ou enter é pressionada 29

30 3.2 Dispositivos de Entrada (A9) Request Mode Exemplo 2: Locator Mover o dispositivo apontador para a posição desejada Disparar pressionando um botão do dispositivo Posição retorna ao programa aplicativo 30

31 3.2 Dispositivos de Entrada (A9) Sample Mode (amostragem) Medida retorna imediatamente após a chamada da função Não necessita disparo Usuário deve posicionar o dispositivo apontador antes da chamada da função Processo de medida Sample Medida Programa 31

32 3.2 Dispositivos de Entrada (A9) Request Mode e Sample Mode em APIs Usuário deve identificar qual o dispositivo que fornece o input Interfaces do tipo request_locator(device_id, &measure); sample_locator(device_id, &measure);» device_id identifica o dispositivo» measure guarda a medida do dispositivo Esses modos são úteis em situações em que o programa guia o usuário Não são adequados para simuladores de vôo Vários dispositivos de entrada podem ser usados pelo piloto em um dado instante sem ordem predefinida 32

33 3.2 Dispositivos de Entrada (A9) Event Mode (Evento) Possibilidade 1 Cada vez que um dispositivo é disparado um evento é gerado A medida e o identificador do dispositivo que gerou o evento são colocados na fila de evento Processo de disparo Programa examina evento na frente da fila Se a fila estiver vazia, espera por um evento Se houver um evento, programa decide o que fazer Espera Disparo Processo de medida Medida Fila de Evento Evento Programa 33

34 3.2 Dispositivos de Entrada (A9) Event Mode (Evento) Possibilidade 2 Cada vez que um dispositivo é disparado um evento é gerado Cada tipo de evento é associado a uma função chamada callback Fução é chamada quando seu evento ocorre 34

35 3.3 Cliente-Servidor (A9) Computação gráfica deve funcionar em Ambiente de computação distribuída e redes Servidores executam tarefas para Clientes Cliente e servidores podem estar Distribuídos em uma rede ou Contidos na mesma unidade computacional Exemplos Servidores de impressão Servidores de arquivos Servidores gráficos 35

36 3.3 Cliente-Servidor (A9) Servidor de impressão Estação Estação Laptop imac Servidor Servidor de arquivos Gráfico 36

37 3.3 Cliente-Servidor (A9) Servidor Gráfico Estação de trabalho com monitor raster Keyboard Dispositivo apontador (mouse, trackball, etc.) Programa OpenGL é um cliente que usa o servidor gráfico 37

38 3.4.0 Introdução 3.4 Display Lists (A9) Idéia herdada do display processor dos anos 1960 Host Programa processado no host Display Processor Display File Lista compilada de instruções enviada ao DPU Lista armazenada como display file (display list) na display memory Host liberado Display processor executa, repetidamente, a display list 38

39 3.4 Display Lists (A9) Hoje O antigo display processor tornou-se um servidor gráfico O programa do usuário tornou-se um cliente O gargalo é a quantidade de dados que trafega entre o cliente e o servidor gráfico Modos de enviar uma entidade gráfica do cliente para o servidor gráfico Immediate mode Retained mode 39

40 3.4 Display Lists (A9) Immediate mode Envia a descrição completa dos objetos Vertices Atributos Tipos de primitivas Transformações de visualização Envia assim que o programa executa um comando que define a primitiva Primitiva deve ser enviada toda vez que a tela for limpa ou quando a entidade mudar de posição 40

41 3.4 Display Lists (A9) Retained mode Define o objeto uma vez Põe objeto em uma display list Há um overhead para isso Armazena a display list no servidor Servidor precisa de memória para isso Cliente envia uma chamada ao servidor solicitando que a display list seja desenhada Diminui o tráfego na rede Cliente tira vantagem de hardware gráfico especializado disponível no servidor 41

42 3.4 Display Lists (A9) Definição e execução de display lists Análise de um exemplo em OpenGL #define BOX 1 /* qualquer inteiro não utilizado */ glnewlist(box, GL_COMPILE); glbegin(gl_polygon); Comentário BOX: Identificador único glcolor3f(1.0, 0.0, 0.0); da display list glvertex2f(-1.0, -1.0); GL_COMPILE: indica que o glvertex2f( 1.0, -1.0); sistema deve enviar a glvertex2f( 1.0, 1.0); lista ao servidor mas glvertex2f(-1.0, 1.0); não deve mostrar o glend(); conteúdo glendlist(); GL_COMPILE_AND_EXECUTE 42

43 3.4 Display Lists (A9) Quando quiser desenhar a box (caixa) chame a função glcalllist(box); Exemplo glmatrixmode(gl_projection); for (i=1; i < 5; i++) { } glloadidentity(); gluortho2d(-2.0*i, 2.0*i, -2.0*i, 2.0*i); glcalllist(box); Comentário Cuidado com mudanças de estado causadas pela display list Por exemplo: dentro da display list BOX, a cor é alterada para vermelho 43

44 3.4 Display Lists (A9) Texto e display lists Ponha cada letra e símbolo do fonte (raster ou stroke) em uma display list Armazene os fontes no servidor usando as display lists Exemplo de como criar seu próprio fonte com 256 caracteres Usar a função OurFont() 44

45 3.4 Display Lists (A9) base = glgenlists(256); for (i=0; i < 256; i++) { glnewlist(base+i, GL_COMPILE); OurFont(i); glendlist(); } Comentário glgenlists(number): retorna o primeiro inteiro de uma seqüência de números inteiros consecutivos não utilizados como label. 45

46 3.4 Display Lists (A9) void OurFont(char c) { switch(c) { case a : break; case A : break; } } Comentário Cada case deve conter os comando OpenGL para desenhar a letra correspondente. 46

47 3.4 Display Lists (A9) Desenhar letra O dentro de um quadrado unitário case O : break; gltranslatef(0.5, 0.5, 0.0); glbegin(gl_quad_strip); for(i=0; i<=12; i++) { angle = 3.14/6.0 * I; } glend(); glvertex2f(0.4*cos(angle), 0.4*sin(angle)); glvertex2f(0.5*cos(angle), 0.5*sin(angle)); gltranslatef(0.5, -0.5, 0.0); 47

48 3.4 Display Lists (A9) Como escrever as letras do font armazenado Recuperar o identificador base das display lists do font gllistbase(base); Desenhar a string char *text_string; glcalllists((glint) strlen(text_string), GL_BYTE, text_string); 48

49 3.4 Display Lists (A9) Fonts na GLUT Alguns fonts Raster e Stroke Não fazem uso de display lists Acesso a um caracter ou a um conjunto de carecteres uniformemente espaçados glutstrokecharacter(glut_stroke_mono_roman, int character) 49

50 3.4 Display Lists (A9) Exemplo glpushmatrix(); gltranslatef(150.0, 190.0, 0.0); glscalef(0.38, 0.4, 1.0); glutstrokecharacter(glut_stroke_mono_roman, 'C'); glutstrokecharacter(glut_stroke_mono_roman, 'r'); glutstrokecharacter(glut_stroke_mono_roman, 'e'); glutstrokecharacter(glut_stroke_mono_roman, 't'); glutstrokecharacter(glut_stroke_mono_roman, 'o'); glpopmatrix(); 50

51 3.4 Display Lists (A9) Acesso a caracteres raster glutbitmapcharacter( GLUT_BITMAP_8_BY_13, int character); São copiados diretamente no frame buffer Não são afetados por transformações geométricas Usa a variável de estado raster position Cada vez que o comando é executado OpenGL move raster position um caracter para a direita 51

52 3.4 Display Lists (A9) Exemplo glrasterpos2(rx, ry); glutbitmapcharacter(glut_bitmap_8_by_13, 'C'); glutbitmapcharacter(glut_bitmap_8_by_13, 'r'); glutbitmapcharacter(glut_bitmap_8_by_13, 'e'); glutbitmapcharacter(glut_bitmap_8_by_13, 't'); glutbitmapcharacter(glut_bitmap_8_by_13, 'o'); 52

53 3.5 Programando Input Dirigido a Eventos (A10) Usando o dispositivo apontador Dois tipos de eventos move event: mouse movido com um botão pressionado medida (posição do mouse) enviada ao programa mouse event: botão pressionado ou liberado medida retornada inclui» botão que gerou o evento» estado do botão após o evento (up ou down)» Posição do cursor que acompanha o mouse, em coordenadas de tela 53

54 3.5 Programando Input Dirigido a Eventos (A10) Usar função GLUT glutmousefunc(mouse) Função Callback void mouse (int button, int state, int x, int y) { if (button == GLUT_LEFT_BUTTON && state == GLUT_DOWN) exit(); } Código Fonte Código Exec 54

55 3.5 Programando Input Dirigido a Eventos (A10) Desenhando quadrados em uma janela Código Fonte Código Exec 55

56 3.5 Programando Input Dirigido a Eventos Eventos de janelas Redimensionamento da janela reshape event Se a janela mudar de dimensões Desenhar objetos que estavam na janela? Precisa de uma função display O que fazer se o aspect ratio mudar? Para evitar distorção corrigir a viewport Os atributos e tamanhos dos objetos devem ser mudados? Depende da aplicação Código Fonte Código Exec 56

57 3.5 Programando Input Dirigido a Eventos Eventos de teclado Ocorrem quando o mouse está dentro de uma janela e uma tecla é pressionada 57

58 3.5 Programando Input Dirigido a Eventos Eventos de teclado Função GLUT glutkeyboardfunc(keyboard); Medidas Código ASCII tha tecla pressionada Posição do mouse Função callback Código Fonte Código Exec void keyboard(unsigned char key, int x, int y) { if (key == q key == Q ) exit(0); } 58

59 3.5 Programando Input Dirigido a Eventos Os Callbacks Display e Idle Usar glutdisplayfunc(display); Quando GLUT determina que a window deve ser redesenhada Janela aberta pela primeira vez Janela muda de posição Nova cena em uma animação Usar glutpostredisplay(); Função display vai ser executada no máximo uma vez cada vez que o programa entrar no main loop 59

60 3.5 Programando Input Dirigido a Eventos Idle Callback é chamado quando não acontecer nenhum evento 60

61 3.5 Programando Input Dirigido a Eventos Gerenciamento de janelas GLUT suporta Múltiplas janelas Subjanela de uma dada janela Exemplo de uma janela do primeiro nível Id = glutcreatewindow( Second window ); Código Fonte Código Exec 61

62 3.6 Menus (A11) Utilizar widgets de window toolkits Rapidez de desenvolvimento Estética da interface gráfica GLUT oferece pop-up menus Passos para definição de um menu Definir as entradas Associar o menu a um determinado botão do mouse Definir uma função callback associada a cada entrada do menu 62

63 3.6 Menus (A11) // Defining the callback functions glutdisplayfunc(display); // Creating a pop-up menu glutcreatemenu(demo_menu); glutaddmenuentry("quit",1); glutaddmenuentry("increase square size",2); glutaddmenuentry("decrease square size",3); glutattachmenu(glut_right_button); // Entering the main event loop glutmainloop(); 63

64 3.6 Menus (A11) void demo_menu(int id) { if (id == 1) exit(0); else if (id == 2) size = size*2; else if (id == 3) size = size/2; glutpostredisplay(); } Código Fonte Código Exec 64

65 3.7 Picking (A11) Operação lógica de entrada Permite identificar um objeto desenhado Três modos Verificar qual o objeto que intercepta o quadrado em torno do cursor Verificar qual o objeto cujo retângulo limite contém a posição do cursor Consulta a cor do pixel e uma tabela de cor objeto 65

66 3.7 Picking (A11) Picking com retângulo limite (bounding box) Definir um ponto de picking na tela Obter as coordenadas do mundo desse ponto Determinar qual o retângulo limite que contém o ponto Retornar o identificador do objeto associado àquele retângulo limite Útil para selecionar itens de menu 66

67 3.7 Picking (A11) Picking com back buffer Imagem renderizada no back buffer não é exibida Desenhar objetos com as cores de picking Obter posição com o mouse callback Usar glreadpixels() para obter cor do pixel apontado pelo mouse Procurar na tabela objetos cores o identificador do objeto cuja cor é igual à do pixel selecionado 67

68 3.7 Picking (A11) Modo de picking e de seleção Como identificar primitivas cujas projeções estão próximas a um ponto selecionado na tela OpenGL provê um modo de renderização chamado selection mode Objetos não são renderizados no buffer de cores (frame buffer) GLint glrendermode(glenum mode); 68

69 3.7 Picking (A11) GLint glrendermode(glenum mode); mode: GL_RENDER (default) mode: GL_SELECT mode: GL_FEEDBACK Modo GL_SELECT Antes de chamar glrendermode(gl_select); Chamar glselectbuffer(glsizei size, GLuint *buffer) Especifica o array de seleção buffer[size] Valor de retorno de glrendermode usado para indicar o número de hits (número de objetos selecionados) 69

70 3.7 Picking (A11) Entrar modo de seleção Renderizar a cena Cada primitiva renderizada dentro do volume de clipping gera uma mensagem (hit) Cada hit é armazenado em um buffer (name stack) Funções relacionadas ao name stack Inicialização Pushing informação na pilha Poping informação da pilha Manipulação dos dados no topo da pilha 70

71 3.7 Picking (A11) Informações geradas na name stack chamada de hit list hit list é examinada após a renderização Para obter informação de picking 71

72 3.7 Picking (A11) Funções utilizadas void glselectbuffer(glsizei n, GLunint *buff) Define buff[size] para armazenar dados selecionados void glinitnames() Inicializa a pilha de nomes (name stack) void glpushname(glunint name) Push name na pilha de nomes void glpopname() Pop o name do topo da pilha de nomes void glloadname(gluint name) Troca o nome do topo da pilha de nomes por name 72

73 3.7 Picking (A11) Observações Cada objeto a ser identificado é um conjunto de primitivas ao qual atribui-se um identificador (name) Antes de renderizar o objeto, coloca-se seu identificador na pilha de nomes Não se pode carregar um identificador em uma pilha vazia glinitnames(); glpushname(0); // 0 é um nome não utilizado Geralmente usa-se o mouse callback para entrar no modo de seleção Sair do modo de seleção antes do fim do callback 73

74 3.7 Picking (A11)... Observações Quando retorna-se ao modo GL_RENDER glrendermode(gl_render) retorna o número de hits processados Dentro do mouse callback Muda-se o volume de clipping para se obter hits na região desejada (próxima à posição do mouse) Usar glupickmatrix(x, y, w, h, *vp)» (x, y): posição do cursor em coordenadas da OpenGL window (origem no canto inferior esquerdo)» w x h: retângulo de picking centrado em (x, y)» vp: vp[0] = vp_xmin, vp[1] = vp_xmax, vp[2] = vp_ymin, vp[3] = vp_ymax 74

75 3.7 Picking (A11) Objetos que são renderizados dentro do 75

76 3.7 Picking (A11) Objetos que são renderizados dentro do Código Fonte Código Exec 76

77 3.8 Um Programa Simples de Pintura (A11) Ilustra o uso de Callbacks Display lists Projeto de um programa interativo Características Código Fonte Código Exec Trabalhar com objetos geométricos Manipular pixels Oferecer atributos de controle Incluir menus Permitir mover e redimensionar janela 77

78 3.8 Um Programa Simples de Esse programa tem uma área de menu que é parte do canvas. Coordenadas do mouse são testadas para identificar qual o menu selecionado Botão direito do mouse ativa pulldown menu quit ou clear Pintura (A11) 78

79 3.9 Animando Programas Interativos (A12) Rotacionar um quadrado com single buffer Modificar o programa para double buffering Analisar outros tipos de buffers 79

80 3.9 Animando Programas Interativos (A12) O quadrado giratório Função display: limpa frame buffer e Desenha quadrado (-sin θ, cos θ) (-cos θ, -sin θ) vértices no círculo trigonométrico Usar a função idle que incrementa o ângulo θ (cos θ, sin θ) (sin θ, -cos θ) Usar a função mouse que chama a função idle com um click no botão esquerdo Código Fonte Código Exec 80

81 3.9 Animando Programas Interativos (A12) Função display void display() { glclear(gl_color_buffer_bit); } glbegin(gl_polygon); thetar = theta/((2*3.14)/360.); glvertex2f( cos(thetar), sin(thetar)); glvertex2f( -sin(thetar), cos (thetar)); glvertex2f( -cos(thetar), -sin(thetar)); glvertex2f( sin(thetar), -cos(thetar)); glend(); 81

82 3.9 Animando Programas Interativos (A12) Função idle void idle() { theta+= 2; if(theta >= 360.) theta -= 360; glutpostredisplay(); } Chamada pela glutidlefunc(idle); 82

83 3.9 Animando Programas Função mouse Interativos (A12) void mouse(int button, int state, int x, int y) { } if(button==glut_left&&state==glut_down) glutidlefunc(idle); if(button==glut_middle_button&&state==g LUT_DOWN) glutidlefunc(null); Chamada pela glutmousefunc(mouse); 83

84 3.9 Animando Programas Interativos (A12) Double Buffering Usa dois frame buffers para desenhar e mostrar a cena Front buffer é mostrado Back buffer é usado para desenhar a próxima seqüência Trocar os dois buffers usando o comando glutswapbuffers(); Gera um display callback Código Fonte Código Exec 84

85 3.10 Projeto de Programas Interativos (A12) Características de um bom programa interativo Imagem sem cintilação ou artefatos Variedade de dispositivos de interação Variedade de métodos para entrada e saída de informações Interface com o usuário intuitiva Feedback para o usuário Tolerância aos erros do usuário Projeto que leve em conta ergonomia 85

86 3.10 Projeto de Programas Interativos (A12) Área de pesquisa responsável por isso IHC (Interação Humano-Computador) HCI (Human-Computer Interaction) 86

87 3.10 Projeto de Programas Interativos (A12) Toolkits, Widgets e o Frame Buffer Toolkits GTK+/gtkmm ( Trolltech Qt ( FOX Toolkit ( FLTK ( wxwindows ( ) Tcl/Tk ( 87

88 3.10 Projeto de Programas Interativos (A12) Toolkits, Widgets e o Frame Buffer Widgets do wxwindows 88

89 3.10 Projeto de Programas Interativos (A12) Toolkits, Widgets e o Frame Buffer Frame Buffer Como menus e outros objetos podem aparecer sobre o canvas sem danificar o conteúdo Pop-up menus Rubberbanding Duas soluções Bit-block-transfer (bitblt) XOR operation 89

90 3.11 Operações Lógicas (A12) Exemplo de imagem danificada pelo pop-up menu Exit 90

91 3.11 Operações Lógicas (A12) Exemplo de imagem danificada por rubberbanding 91

92 3.11 Operações Lógicas (A12) Solução 1 Quando a scan conversion da área do pop-up menu ou da primitiva desenhada com rubberband for feita Salvar os bits do Frame-buffer que irão ser substituídos Copiá-los de volta quando o pop-up menu desaparecer ou quando uma nova primitiva temporária do rubberbanding for desenhada 92

93 3.11 Operações Lógicas (A12) Solução 2 Utilizar o XOR Pixel Fonte: Pixel da primitiva a ser desenhada Pixel Lido: Pixel a ser substituído Pixel Destino: Valor de substituição depois da operação lógica Pixel Fonte Pixel Lido Color Buffer Pixel Destino 93

94 3.11 Operações Lógicas (A12) Solução 2 Utilizar o XOR Pixel Fonte: Pixel Lido: Pixel Destino: Pixel Fonte: Pixel Destino: Pixel Fonte XOR XOR Pixel Lido Pixel Destino Pixel Lido Color Buffer 94

95 3.11 Operações Lógicas (A12) Solução 2 com OpenGL Sair do default Copy Mode: GL_COPY glenable(gl_color_logic_op); gllogicop(gl_xor); 95

96 3.11 Operações Lógicas (A12) Desenhando linhas deletáveis Habilitar o modo de operações lógicas glenable(gl_color_logic_op); Quando estiver desenhando objetos temporários, mude para o modo XOR gllogicop(gl_xor); 96

97 3.11 Operações Lógicas (A12) Desenhando linhas deletáveis No modo XOR Desenhe o objeto com a cor fonte A cor que aparece na tela é o resultado da operação XOR entre a cor fonte e a cor que estiver no frame buffer Para apagar o objeto, desenhe-o novamente com a cor fonte A cor que aparecerá na tela é a cor que estava no frame buffer antes do objeto ser desenhado a primeira vez Código Fonte Código Exec 97

98 3.11 Operações Lógicas (A12) XOR e Cor XOR

99 3.11 Operações Lógicas (A12) Cursor e planos sobrepostos (overlay) Desenhar cursor nos planos overlay Não interfere com a imagem RGB nos demais planos Red bit planes Green bit planes Blue bit planes Overlay bit planes 99

100 3.11 Operações Lógicas (A12) RGB Planes RGB Overlay Planes Display: Imagem Overlay parece copiada sobre of color buffer 100