Marzo 2003
Introducción
Antes de continuar hemos de advertir que las líneas de código que exponemos en este tutorial son opciones entre toda la sobrecarga que ofrece VSNET. Abarcarla toda sería demasiado extenso; de todas formas no es difícil una vez entendidos los conceptos básicos.
Las clases que producen gráficos vectoriales en VSNET están contenidas en los espacios System.Drawing y System.Drawing.Drawing2D:
Imports System.Drawing
Imports System.Drawing.Drawing2D
El lienzo
El primer paso para poder dibujar gráficos es crear u obtener un objeto Graphics, que viene a ser el lienzo donde expresaremos nuestro arte. El objeto Graphics carece de constructor público, por tanto no se puede instanciar con la palabra clave New.
El evento Paint contiene una referencia a Graphics en su parámetro e:
Private Sub Form1_Paint(ByVal sender As Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles MyBase.Paint
Dim gr As Graphics = e.Graphics
End Sub
También puede obtenerse llamando al método CreateGraphics. El siguiente ejemplo crea tres objetos Graphics en el formulario, en un PictureBox y en un botón:
Dim Lienzo1 As Graphics = Me.CreateGraphics
Dim Lienzo2 As Graphics = PictureBox1.CreateGraphics
Dim Lienzo3 As Graphics = Button1.CreateGraphics
La diferencia entre obtener Graphics del objeto e y del formulario o control radica en el momento en que se generará el dibujo. El evento Paint se dispara siempre que sea necesario repintar cualquier área del formulario o control. Si nuestro dibujo es demasiado complejo, pueden producirse destellos desagradables en la pantalla. En cambio, obtener Graphics del control o formulario otorga al programador un control absoluto del momento en que se pinta el dibujo.
Borrar un dibujo no es tan fácil como crearlo. El código utiliza objetos para trazar líneas y colorear formas sobre, por ejemplo, un formulario, pero las líneas y las formas pintadas no son objetos, sino puntos coloreados, por tanto no se pueden modificar, a no ser que los borremos y volvamos a dibujar. Simulamos, por tanto, el borrado repintando puntos con el color del lienzo, es decir, dibujando o pintando lo que queremos borrar con el color de fondo del formulario o del control del que hemos obtenido el objeto Graphics.
Graphics sólo nos ofrece un método de borrado: .Clear(Color), que aparentemente borra la superficie completa pero en realidad la cubre con el color especificado:
gr.Clear(Me.BackColor)
Una vez utilizado el objeto Graphics es conveniente cerrarlo invocando el método Dispose
gr.Dispose()
Los ejes de coordenadas
Cualquier formulario o control contiene tres sistemas de coordenadas, llamados “coordenadas de dispositivo”, “coordenadas de página” y “coordenadas de mundo”.
En los tres sistemas los valores +X aumentan hacia la derecha y los valores +Y aumentan hacia abajo, según muestra el siguiente esquema:
Las coordenadas de dispositivo y las coordenadas de página tienen su origen inamovible en el extremo superior izquierdo del área cliente del formulario o control. El origen de as coordenadas de mundo, en cambio, aunque inicialmente se sitúa en el extremo superior izquierdo del área cliente, puede moverse a cualquier punto del área cliente del formulario o control. En el capítulo dedicado a las transformaciones aprenderemos a hacerlo. Aquí nos limitaremos a distinguir los tres sistemas de coordenadas que conviven en todo formulario o control.
Coordenadas de dispositivo (device coordinate system) Son las coordenadas por defecto inamovibles y medidas en píxeles
Coordenadas de página (page coordinate system). También son inamovibles, pero admiten diferentes unidades de medida, que se establecen llamando al método PageUnit del objeto Graphics. Este método toma como argumento un miembro de la enumeración GraphicsUnit, que especifica la unidad de medida que se utilizará:
Display
1/75 pulgadas.
Document
1/300 pulgadas.
Inch
Pulgada.
Millimeter
Milímetro.
Pixel
Pixel.
Point
Punto de impresión (1/72 pulgadas)
World
La misma que se haya definido para las coordenadas de mundo.
El valor por defecto es Pixel, de modo que, si no se modifica, las coordenadas de página coinciden con las de dispositivo.
Coordenadas de mundo (world coordinate system). Salvo en la orientación de los valores X e Y, que en ningún caso se puede cambiar, son totalmente personalizables: pueden moverse y girarse y se pueden definir unidades de medida personalizadas. Las coordenadas de mundo son las utilizadas por el objeto Graphics. Si no se personalizan, que veremos en el capítulo Transformaciones cómo hacerlo, coinciden con las coordenadas de página.
El color
No vamos a entrar en teoría del color, sino sólo indicaremos cómo se definen los colores en VBNET
Todo color se compone de tres ingredientes: rojo, verde y azul, y un nivel opcional de transparencia. Cada ingrediente toma un valor Integer en el rango 0-255. 0 indica ausencia de color y 255 total presencia. (0, 0, 0) es el color negro y (255, 255, 255) el color blanco. La transparencia también se mide de 0 a 255: 0 indica transparencia total y 255 opacidad total.
Además, cada color tiene asociado un número Integer con signo negativo.
VSNET nos ofrece la estructura Color que nos permite utilizar colores predefinidos con sólo escribir su nombre: Color.Blue, Color.Green, etc. Color es una estructura, no una clase, por tanto no admite instanciación con New.
A continuación expondré esquemáticamente los métodos de la estructura Color utilizados en este tutorial:
Color.FromArgb Define un color tomando como parámetros los valores para rojo, verde y azul y, opcionalmente, el nivel de transparencia. También puede utilizarse con sólo el número asociado al color. Ejemplo
Color.FromArgb(77, 77, 77)
Color.FromArgb(100, 77, 77, 77) ‘Con nivel de transparencia
Color.FromArgb(-123456) ‘Número del color
Color.ToArgb Devuleve el número asociado al color:
Dim n As Integer = Color.Blue.ToArgb()
A, R, G, B Devuelve, respectivamente, los niveles de transparencia, rojo, verde y azul
Dim rojo As Integer = Color.Blue.R()
FromName Define un color a partir de su nombre
Dim MiColor As Color = Color.FromName(“Blue”)
El lapicero
Antes de dibujar tenemos que definir un lapicero o “pen”. Al construirlo podemos definir sólo el color o el color y el grosor:
Dim Lápiz As New Pen(Color.Blue)
Dim Lápiz As New Pen(Color.Blue, 10)
También podemos crear un lapicero sin construirlo llamando a la enumeración Pens. Veremos un ejemplo más abajo.