Servicio Comun de Informatica Grafica

C A P I T U L O 19 Colores e Imágenes

Este capítulo describe los atributos de los colores en widgets Tk, y las imágenes y bitmaps que pueden ser mostrados en los diferentes widgets. Se describen también los comandos que permiten crear y manipular estas imágenes.

Colores en Tk

Existen numerosos atributos para el color. El color foreground se refiere al color del elemento, mientras que el color background es el color del fondo detras del elemento.

La tabla 19-1 refleja los posibles atributos, indicando además qué widgets aceptan dichos atributos.

Tabla 19-1. Atributos de los colores.

background (también bg)	Color del fondo. button canvas checkbutton entry frame label listbox menu menubutton radiobutton scale scrollbar text toplevel.
foreground (también fg)	Color del elemento. button checkbutton entry label listbox menu menubutton radiobutton scale text
activebackground	El color del fondo cuando se pulsa sobre él el botón del ratón. button checkbutton menu menubutton radiobutton scale scrollbar
activeforeground	El color del elemento cuando el botón del ratón se pulsa sobre él. button checkbutton menu menubutton radiobutton.
disableforeground	El color del fondo cuando el widget está desactivado. button checkbutton menu menubutton radiobutton.
highlightcolor	Color del elemento cuando tiene el foco. button canvas checkbutton entry frame label menubutton radiobutton scale scrollbar text toplevel.
insertbackground	Color del área cubierta por el cursor de inserción. canvas entry text.
selecbackground	El color del fondo del item seleccionado. canvas entry listbox text.
selectcolor	El color del indicador de selección. checkbutton radiobutton.
selectforeground	El color del item seleccionado. canvas entry listbox text
troughcolor	Color de ciertas partes de las escalas y barras de scroll. scale scrollbar.

El color se puede especificar de dos formas diferentes:

Simbólicamente: En este caso se especifica su nombre en inglés. Por ejemplo, red.

Hexadecimal: El color viene dado por un número hexadecimal. Por ejemplo, #ff0000. (# indica que es un número hexadecimal).

La primera forma no tiene más inconveniente que conocer los nombres simbólicos de los colores que coinciden con los de UNIX. Para obtener información sobre estos nombres puede ejecutarse el Widget Tour que acompaña a Tcl/Tk. En uno de los ejemplos aparece una listbox con un enorme número de nombres de colores,

La segunda es algo más compleja. El número hexadecimal está dividido en tres campos de igual tamaño, que son los campos correspondientes al rojo, verde y azul (rgb). Estos tres campos pueden especificarse mediante 4, 8, 12 o 16 bits.

#RGB 4 bits por color (Por ejemplo: #f00)

#RRGGBB 8 bits por color (Por ejemplo: #ff0022)

#RRRGGGBBB 12 bits por color (Por ejemplo: #fff000111)

#RRRRGGGGBBBB 16 bits por color (Por ejemplo: #1111ffff0000)

Es posible obtener los valores rgb de un color a partir de su nombre simbólico. Para ello se utiliza el comando winfo rgb. Este comando obtiene los valores rgb a partir del nombre simbólico de un color y devuelve una lista de tres elemntos.

En el siguiente ejemplo, se puede ver cómo se utiliza este comando.

Ejemplo 19-1.

proc Oscurece_Color { color }

# Captura los valores rgb del color.

set rgb [winfo rgb $color]

# Devuelve el color resultante de haber reducido en un 5% cada componente con

# lo que el color resultará más oscuro que el original

return [format "#%03x%03x%03x" \

[expr round([lindex $rgb 0] * 0.95] \

[expr round([lindex $rgb 1] * 0.95] \

[expr round([lindex $rgb 2] * 0.95] ] }

Este procedimiento permite oscurecer un color mediante la técnica de reducir cada uno de sus componentes. El último paso consiste en reconstruir el nuevo color mediante el comando format.

Mapas de colores y clases visuales

Cada pixel de la pantalla es representado por uno o más bits en memoria. Existen varios métodos de trasladar el valor almacenado en un pixel a un color que aparezca en la pantalla como tal pixel. Esta traslación es función del número de bits de cada pixel (denominado profundidad del color), y del estilo de la interpretación (denominado clase visual).

Las 6 clases visuales de Tk se presentan en la tabla 19-1. Algunas de estas clases visuales usan mapas de colores que permiten la traslación entre el valor almacenado en el pixel a un valor utilizado por el hardware para generar dicho color. Un mapa de colores es capaz de codificar una mayor información de la que aparentemente pudiera contener. Por ejemplo, un mapa de colores de 256 entradas puede ser indexado mediante 8 bits, pero puede contener información 24 bits de profundidad de color.

Tabla 19-1. Clases visuales. Valores para el atributo visual.

staticgray	Escala de grises con un mapa de color fijo.
greyscale	Escala de grises con un mapa de color no fijo.
staticcolor	Utiliza un mapa de color definido.
pseudocolor	Colores definidos por un mapa de color.
directcolor	Colores definidos por tres mapas de color independientes.
truecolor	Colores definidos por mapas de color independientes, sólo de lectura.

Los widgets frame y toplevel soportan los atributos colormap y visual que proporcionan un control sobre dichos elementos.

El valor del atributo visual tiene dos partes, un tipo visual, y la profundidad de color deseada. El siguiente ejemplo indica la forma de utilizar este atributo.

Se especifica a la toplevel denominada .t un atributo visual de escala de grises y una profundidad de color de 4 bits por pixel.

toplevel .t -visual "greyscale 4"

Por defecto un widget hereda el mapa de color y el tipo visual de su widget padre.

El valor del atributo colormap puede ser new, en tal caso la frame o toplevel toma un nuevo mapa de colores, o puede ser el nombre de otro widget, en este caso la frame o toplevel toma el mapa de color de dicho widget.

Bitmaps e imágenes

Un buen número de widgets poseen el atributo image que especifica la imagen que va a ser mostrada en el widget. El uso de una imagen tiene dos pasos. En el primero la imagen es creada mediante el comando image create. Este comando devuelve un identificador para la imagen. En el segundo paso, este identificador se le pasará al widget dentro del atributo image.

Existen dos tipos de imágenes soportados por Tk: bitmap y photo.

Es importante saber que hay tres cosas que pueden ser mostradas en labels y botones: text, bitmaps, e images. Si más de uno de estos atributos ha sido especificado, la image tiene prioridad sobre el bitmap, y el bitmap sobre el text.

El comando image

La tabla 19-2 resume las operaciones posibles con el comando image.

Tabla 19-2. Operaciones con el comando image.

image create tipo ?nombre? ?opciones?	Crea una imagen del tipo especificado. El tipo puede ser bitmap o photo.
image delete nombre	Borra la imagen nombre.
image height nombre	Devuelve el alto de la imagen en pixels.
image names	Devuelve la lista de imágenes definidas.
image type nombre	Devuelve el tipo de la imagen nombre.
image types	Devuelve la lista de los posibles tipos de imágenes.
image width nombre	Devuelve el ancho de la imagen en pixels.

Imágenes bitmap

Una imagen bitmap se compone de una imagen pricipal y de una máscara. La imagen principal se dibuja con el color denominado foreground. La máscara se dibuja con el color llamado background. Es decir, si se utiliza bitmap en lugar de image, sólo se podrán utilizar imágenes en dos colores.

Por otro lado, la imagen a utilizar sólo podrá estar en formato XBM (X bitmap), formato que no todos los editores de imágenes para Windows soportan. (Sí es soportado por el programa Graphics WorkShop para Windows 95, que es shareware)

Un ejemplo de utilización de este comando sería el siguiente:

Ejemplo 19-4.

label .logo.hc -bitmap @c:/usr/vergara/images/hc.b -fg red

pack .logo.hc -side left -padx 2m

Esto insertará una imagen bitmap en un label.

Tabla 19-3. Opciones más comunes de bitmap image.

background color	Color del fondo. No es equivalente a bg.
data cadena	El contenido de un bitmap como cadena.
file nombre	Nombre del fichero que contiene el bitmap.
foreground color	Color del bitmap.

Imágenes photo

Las imágenes photo pueden mostrar en pantalla imágenes a todo color, además de hacer dithering y corrección gamma. Tk sólo soporta los formatos GIF y PPM, como ya se comentó, aunque utilizando el interface con C pueden ser definido el soporte para nuevos formatos gráficos.

La tabla 19-4 muestra los atributos para las photo images. Estos deberán ser especificados en el comando image create photo.

Tabla 19-4. Atributos más comunes de las photo images.

format formato	Especifica el formato de datos para el fichero o la cadena.
data cadena	El contenido de la foto como una cadena.
file nombre	El nombre del fichero de imagen.
gamma valor	El factor de corrección gamma, que debe ser mayor que cero.
height valor	El alto de la imagen en unidades de pantalla.
palette paleta	Un número especifica el número de niveles de gris. Tres números separados por "/" determinan el número de rojo, azul y verde. Ejemplo: 5/5/4
width valor	Ancho de la imagen en unidades de pantalla.

Ejemplo 19-2.

set img [image create photo -file c:/usr/vergara/aviones/phantom.gif]

label .lb1 -image $img

pack .lb1 -side top

Otra forma de crear imágenes es esta:

Ejemplo 19-3.

image create photo img_phantom -file c:/usr/vergara/aviones/phantom.gif]

label .lb1 -image img_phantom

pack .lb1 -side top

En cualquiera de los casos, el resultado será este:

Después de haber creado la imagen, es posible manipularla mediante una serie de operacones, de las cuales las más habituales son las siguientes (En la siguiente tabla $p es el handle devuelto en la creación de una imagen):

Tabla 19-5. Operaciones con el comando photo image.

$p clear	Borra la imagen. La vuelve transparente.
$p cget opcion	Devuelve la configuración del atributo opcion.
$p configure ...	Reconfigura las opciones de la photo image.
$p copy fuente opciones	Copia una imagen.
$p get x y	Devuelve el valor del pixel en la posición x y.
$p put datos ?-to x1 y1 x2 y2?	Inserta datos en una imagen . Datos es una lista de filas, donde cada fila es una lista de colores.
$p read fichero opciones	Carga una imagen desde un fichero.
$p redither	Aplica el algoritmo de dithering a la imagen.
$p write fichero opciones	Salva la imagen a un fichero de acuerdo con unas opciones dadas.

Tabla 19-6. Opciones del comando copy.

from x1 y1 ?x2 y2?	Especifica la localización y área de la imagen fuente. Si x2 e y2 no se dan, se toma como tales la esquina inferior derecha.
to x1 y1 ?x2 y2?	Especifica la localización y áreade destino. Si x2 e y2 no se especifican, el tamaño es determinado por la fuente.
zoom x ?y?	Hace un zoom de la fuente, de forma que cada pixel de la imagen fuente se convierte en un bloque de datos de tamaño x por y en la imagen destino.
decimate x ?y?	Reduce la fuente tomando el pixel número x en la dirección X y cada pixel y en la direccón Y.

Tabla 19-7. Opciones del comando read.

format formato	Especifica el formato de los datos. Por defecto, el formato es determinado automáticamente.
from x1 y1 ?x2 y2?	Especifica la subregión de la fuente de datos. Si x2 e y2 no se proporcionan, el tamaño es determinado por los datos.
to x1 y1	Especifica la esquina superior izquierda de los nuevos datos.

Tabla 19-8. Opciones del comando write.

format formato	Especifica el formato de los datos. Por defecto el formato es determinado automáticamente.
from x1 y1 ?x2 y2?	Especifica la subregión de los datos a salvar. Si x2 y y2 no se dan, se toma la esquina inferior derecha.