Modelo de Presentaci

1
Modelo de Presentación
2
Contenidos

• Arquitectura frame-buffer
• Modelos de Output
• Representación de imágenes
• Sistemas de coordenadas
• Primitivas gráficas
• Textos
• Clipping
• Colores

3
Arquitectura Frame-Buffer

• Arquitectura comunmente utilizada

Pantalla
Controlador de Pantalla
CPU
Transforma cada pixel del buffer en acciones
físicas sobre el hardware gráfico (pantalla)
Sistema gráfico (Scan Conversion)
Repositorio de la imagen presentada
4
Scan conversion

• Proceso de conversión de una forma geométrica en
  un conjunto de pixels que la representen en el
  dispositivo de salida
• Ej. conversión de una línea (x1,y1, x2,y2) en el
  conjunto de pixels correspondiente
• Efectuado por el sistema gráfico
• Transparente para el programador
• Debe ser muy rápido

5
Double Buffering

• Guardado de una imagen adicional de la
  presentación
• Beneficios
• Animaciones más suaves
• Permite guardar las partes ocultas de las
  ventanas
• Utiliza dos buffers para efectos especiales
• Actualización de presentaciones (refresh) más
  rápidos

Pantalla
CPU
Controlador de Pantalla
6
Modelo de Output

• Conjunto de procedimientos provistos por el WS,
  para efectuar presentaciones en los dispositivos
  de salida
• Base para la interacción entre la aplicación y el
  WS
• Provee procedimientos para construcción de
  presentaciones
• La invocación de los procedimientos es
  interpretada como comandos al WS
• Estos comandos son dirigidos a través del WS para
  poder ser clipped

WM
Presentación
Comandos
Input
Output
Output
WS
7
Modelo de Output

• Primeros sistemas (SunTools) primitivas simples
• Dibujo de rectángulos, texto
• BitBlt (o RasterOp)
• Movimiento de regiones de la pantalla a memoria
• Fáciles de implementar
• Macintosh, X, etc. sistemas más sofisticados
• Polígonos rellenos, splines, colores,
  clipping
• Objetos 2D
• Imágenes más elaboradas
• Más sencillo para la aplicación

8
Modelo de Output

• En general, los modelos de output constan de
• Un modelo para la representación de imágenes
• Técnicas para administrar las coordenadas
• Un conjunto de primitivas gráficas para realizar
  las presentaciones
• Figuras geométricas
• Texto
• Propiedades de los dibujos
• Manipulación de ventanas
• Un modelo para la representación de colores
• Operaciones y control del clipping de
  presentaciones

9
Modelos de imágenes

• Formas básicas de representar imágenes
• Primitivas stroke
• plotters, primitivas gáficas
• ej. Line ((4,5) (9,7) thick 1)
• Modelos basados en pixels
• operaciones para manipulación de regiones de
  pantalla (ej. scrolling)
• ej. BitBlt
• Modelos basados en regiones
• Primitivas stroke, con interiores rellenos
• ej. PostScript
• Los sistemas gráficos combinan las
  características de estas formas básicas para
  ofrecer una mejor funcionalidad

10
Sistemas de Coordenadas

• Definen la ubicación de los objetos
• Coordenadas del dibujo en pantalla
• Coordenadas de los objetos definidos en la
  aplicación
• Ambos sistemas de coordenadas pueden ser
  diferentes
• Se utilizan diversos sistemas de coordenadas
• Coordenadas de dispositivo
• Coordenadas físicas
• Coordenadas de la aplicación
• Coordenadas interactivas

11
Coordenadas de dispositivo

• Coordenas del dispositivo de dibujo
• Area de la ventana utilizada por la aplicación
  para efectuar sus presentaciones
• Generalmente expresadas en pixels
• Pueden ser necesarias conversiones entre las
  coordenadas del dispositivo y las coordenadas de
  la pantalla
• ej. ante eventos del mouse

12
Jerarquías de Ventanas

• La organización de las ventanas en una jerarquía
  permite expresar convenientemente algunas
  relaciones
• Restricciones en el layout
• Las ventanas hijas (subventanas) son
  posicionadas en una forma relativa la posición de
  su ventana padre.
• La localización de las subventanas es determinada
  de acuerdo a la posición de su ventana padre
• Una ventana hija oculta la porción de la ventana
  padre en la cual reside
• Las ventanas padre e hijas pueden ser desplazadas
  en forma conjunta
• Los hijos pueden ser movidos libremente dentro de
  su padre
• Una ventana hija es cortada (clipped) por su
  ventana padre

13
Jerarquías de Ventanas

• Propagación de eventos
• Los eventos del operador son enviados a la
  ventana activa.
• Si la ventana activa no trata el evento, lo
  redirecciona a su ventana padre, y así
  sucesivamente.
• El proceso cliente debiera ser responsable del
  mantenimiento y modificación de la jerarquía.
• Las ventanas pertenecientes a una misma jerarquía
  debieran ser administradas por un mismo cliente

14
Coordenadas en jerarquías de ventanas
15
Otros sistemas de coordenadas

• Coordenadas físicas
• Expresadas en términos de unidades físicas
  (centímetros, pulgadas)
• Debe considerarse la resolución del hardware
  gráfico utilizado
• Coordenadas de la aplicación
• Expresadas en términos de los conceptos manejados
  por la aplicación
• ej. diseños arquitectónicos metros, pies, etc
• Requiere una transformación de escalas entre las
  coordenadas de la aplicación y las coordenadas de
  dibujo
• Coordenadas interactivas
• Coordenadas de los eventos interactivos del
  usuario
• ej. mouse

16
Primitivas gráficas

• Tipos
• Objetos unidimensionales en un espacio 2D
• Líneas, círculos, elipses, arcos elípticos,
  splines
• Formas cerradas rellenadas
• Un borde define los límites de la región a
  dibujar
• Parámetros de dibujo
• Ventana en la que se dibuja
• Posiciones de dibujo (X1, Y1, X2, Y2, ...)
• Propiedades
• ej. ancho y estilo de linea
• Colores (background, foreground, ...)
• Máscaras de dibujo
• ....

17
Modelos básicos

• 1. El paquete gráfico almacena el estado
• Cada procedimiento de dibujo sólo especifica la
  información geométrica
• Macintosh, Display PostScript, etc.
• SetColor(Red)
• MoveTo(70, 30)
• DrawTo(70, 200)
• Menos parámetros en las invocaciones
• No tienen que colocarse las propiedades que no
  interesan
• Las interrupciones, multiprocesamiento, pueden
  producir configuraciones no deseadas
• El programador debe ser muy cuidadoso para evitar
  propiedades no deseadas.

18
Modelos básicos

• 2. Cada operación define completamente una forma
  geométrica
• DrawLine (70,30,70,200, Red, ......)
• X utiliza un graphics context para almacenar
  todos los parámetros
• Amulet utiliza objetos Am_Style

19
Manipulación de ventanas

• Algunas operaciones sobre ventanas
• Creación
• Redimensionamiento
• Destrucción
• Iconificación
• Maximización

20
Textos

• Uno de los aspectos más comunes y complejos de
  los sistemas gráficos
• Gran variedad de representaciones textuales.
• Fuentes (fonts) conjunto de caracteres
  tipográficos creados con un diseño consistente.
• Caracteres con generalmente la misma apariencia
  general, independientemente de su tamaño y estilo
• Identificadas por un nombre (ej. Geneva, Times).
• Información para la selección
• Familia (espaciado fijo o proporcional, serif)
• Estilo (negrita, cursiva, subrayado)
• Tamaño
• otras características
• ej. ancho y alto de los caracteres

21
Textos

• Representaciones de fuentes
• Basadas en pixels (bitmapped)
• Caracteres definidos como bitmaps o conjuntos de
  pixels
• Eficiencia
• Problemas con el redimensionamiento y el espacio
  requerido por las fuentes de tamaño grande
• Basadas en formas (outlined)
• Caracteres definidos por figuras cerradas
  (curvas, líneas), luego convertidos a bitmaps.
• ej. Fuentes PostScript, TrueType
• Mayor portabilidad
• Menor necesidad de espacio
• Fácil redimensionamiento
• Suele ser dificil leer los textos pequeños

22
Clipping

• Limitación del espacio de dibujo a un región
  particular de la pantalla.
• Caso más simple región rectángular
• Algunos sistemas de ventanas modernos permiten
  regiones rectilíneas
• Permiten acelerar la performance de las
  presentaciones
• Solamente se redibujan aquellas partes de la
  presentación que hayan sufrido modificaciones

23
Clipping Regiones

• La complejidad del clipping depende del tipo de
  regiones manipuladas.
• Tipos de regiones
• Rectangulares
• Muy simples
• Rectilíneas
• Simplicidad para calcular intersecciones
• Polígonos arbitrarios
• Aumenta mucho el costo de calcular intersecciones
• Formas complejas
• Requiere calculos significativos
• Máscaras de pixels
• Eficiencia y potencia, pero mucho consumo de
  espacio y dependencia de la resolución

24
Clipping Operaciones sobre regiones

• Operaciones requeridas sobre las regiones de
  clipping
• Union
• Intersección
• Diferencia
• Las operaciones deben ser cerradas sobre el
  conjunto determinado por el tipo de regiones
  (Clausura)
• ej. las regiones rectangulares son cerradas bajo
  la intersección pero no lo son bajo la unión o
  diferencia.

25
Colores

• Modelos para la representación de colores
• RGB (Red-Green-Blue)
• Colores aditivos
• Coinciden con la tecnología actual
• HSV (Hue-Saturation-Value)
• Permiten especificar más facilmente un color dado
• CMY (Cyan-Magenta-Yellow)
• Colores sustractivos
• Basados en la metáfora de pintores profesionales
• El número de colores representable depende del
  número de bits utilizados
• 24 bits true color

26
Algunos modelos de output

• Macintosh
• Quickdraw provee GrafPorts como abstracciones de
  dibujo (clase View, en MacApp)
• PHIGS
• Presentación conformada por una colección
  jerárquica de estructuras.
• MS Windows Graphical Device Interface (GDI)
• Asocia los dispositivos gráficos con device
  contexts, que traducen los comandos de dibujo en
  la presentación apropiada.
• NeWS, NeXT
• Modelo PostScript

27
Ejemplos de modelos de output

• MS Windows
• Creación de ventanas
• CreateWindow (windowclassName, displayName,
  style, x,
• y, width, height, parentWindow, menu,
• instanceHandle, data)
• La clase establece distintas propiedades de la
  ventana (icono, cursor, procedimiento de
  tratamiento de eventos, colores, etc)
• Primitivas gráficas
• LineTo(current-hDC, x, y)
• Dibuja una línea desde la posición actual hasta
  (x,y), utilizando el lapiz (pen) indicado en
  current-hDC
• selectObject (current-hDC, backgroudBrush)
• Rectangle (current-hDC, left, top, right, bottom)
• asocia un estilo de dibujo para el fondo
  (backgroundBrush), al device context, y luego
  dibuja un rectangulo con ese estilo

28
Ejemplos de modelos de output

• Macintosh
• Clipping
• SetPort(aWindow)
• SetRect(r, x, y, w, h)
• ClipRect(r)
• asocia una región válida de dibujo con un port
  dado.
• Creación de ventanas
• GetNewWindow(resourceID, storagePointer, flag)
• Crea una ventana, de acuerdo a la especificación
  dada por el recurso dado

29
Ejemplos de modelos de output

• Macintosh
• Texto
• SetPort(aWindow)
• FontInfo fi
• GetFontInfo (fi)
• Recupera la fuente asociada actualmente con el
  port
• SetPort(aWindow)
• DrawString(string)
• Dibuja el texto string, con la fuente asociada al
  port actual.
• 0 systemFont (usually Chicago font)
• 1 applFont (usually Geneva font)
• 3 geneva
• 4 monaco
• 5 venice
• 20 times
• 21 helvetica
• SetFont(4)

30
Ejemplos de modelos de output

• X Windows
• Primitivas gráficas
• XDrawLine (Xdisplay,Xwindow,current-GC,x,y,dx,dy)
• Texto
• XDrawString (Xdisplay,Xwindow,current-GC,x,y,str,l
  en)
• Funciones provistas por Xlib
• disponibles en varios lenguajes

31
Modelos de output OO

• Generalmente provistos por una abstracción de una
  región de dibujo
• Implementada como una clase abstracta que define
  un modelo uniforme para dibujos bidimensionales
• ej. Canvas
• Las subclases implementan los distintos tipos de
  dispositivos ventanas, impresoras, imagenes en
  archivos, etc.
• Cada tipo de dispositivo contiene sus propias
  características (tamaño, cantidad de colores)
• La funcionalidad de dibujo está determinada por
  los métodos y propiedades provistas por el
  Canvas.

32
Ejemplo modelo de output OO

• Clase abstracta Canvas
• Dibujo de primitivas
• void CanvasRectangle(X1, Y1, X2, Y2)
• Atributos de las primitivas
• void CanvasSetLineWidth(lw)
• long CanvasGetLineWidth()
• void CanvasSetLineColor(lc)
• Texto
• void CanvasSetFont(family, style, size)
• void CanvasText(x, y, string)
• Colores
• void CanvasSetColor(long RGB)
• void CanvasSetRGB(red, green, blue)
• long CanvasGetRGB()

33
Ejemplo modelo de output OO

• Clipping
• Region RegionUnion(Region)
• Region RegionIntersection(Region)
• Region RegionBounds()
• Region CanvasBoundingRegion()
• void CanvasSetClipRegion(Region)
• Region CanvasGetClipRegion()
• long CanvasGetRGB()

34
(No Transcript)