CAPÍTULO IV:  LA BROCHA

(GDI+ CON VISUAL BASIC .NET)

 

Fecha: 03/Sep/2005 (03/09/2005)
Autor: Arbis Percy Reyes Paredes 
Email: [email protected]
http://percyreyes.blogspot.com 
Joven desarrollador de aplicaciones Web y Servicios Web XML en Visual Basic .NET y Visual C# .NET con bases de datos SQL Server 2000 - 2005.

¡ Los peruanos Sí podemos !

Esta vez estudiaremos conceptos importantes e interesantes respecto a la manera de usar los distintos tipos  y estilos de objetos "brochas", como las brochas sólidas, brochas con trama,brochas con textura, brochas con gradientes.. y cosas parecidas... todo esto en este artículo.

LA BROCHA

La brocha es usada para colorear o rellenar los dibujos. Existen distintos tipos de brochas de acuerdo a la cantidad de colores con las que se trabaja y algunas características particulares. Para trabajar con los pinceles haremos uso de métodos de relleno como FillEllipse, FillPath, FillPie, FillPolygon, FillRectangle, FillRectangles, FillRegion, FillPath.En visual Studio .NET existen los siguientes pinceles:

SolidBrush Rellena la forma con un solo color. haciendo uso de  un pincel o brocha. Los pinceles se utilizan para rellenar formas de gráficos, por ejemplo rectángulos, elipses, gráficos circulares y rutas.  Aquí va un ejemplo para los curiosos. 

Ahora nos proponemos pintar una elipse:

' creamos un pincel para rellenar  
Dim myPincel As SolidBrush = New SolidBrush(Color.FromName("BlueViolet"))
' rellenamos o pintamos una elipse
Me.TextBox1.CreateGraphics.FillEllipse(myPincel, New Rectangle(New Point(100, 150), New Size(250, 180)))

 

Esto es algo más creativo:

Dim n As Integer
For n = 0 To 360 - 30 Step 30
    ' creamos un pincel para rellenar  
    Dim myPincel As SolidBrush = New SolidBrush(Color.FromArgb(-795218 * (n + 1)))
    ' rellenamos o pintamos una elipse
    Me.TextBox1.CreateGraphics.FillPie(myPincel, New Rectangle(New Point(100, 150), New Size(250, 180)), n, 30)
Next

HatchBrush    Rellena la forma con dos colores según un modelo predefinido, es decir, define un pincel rectangular con un estilo de trama, un color de primer plano y un color de fondo. Los estilos de trama se encuentran en la enumeración  HatchStyle.

enumeración HatchStyle

Ahora veamos un ejemplillo de ilustración.

'  creamos una trama para rellenar  
Dim myTrama As System.Drawing.Brush = _
New System.Drawing.Drawing2D.HatchBrush(Drawing2D.HatchStyle.DiagonalBrick, Color.Blue, Color.Yellow)
 ' rellenamos la elipse
Me.TextBox1.CreateGraphics.FillEllipse(myTrama, New Rectangle(New Point(100, 150), New Size(250, 180)))

 

TextureBrush Rellena la forma con una textura, es decir con una imágen y no con colores. Una textura consiste en el relleno de una superficie con una imagen repetida tantas veces cuantas sea necesario hasta cubrir toda la superficie. Los parámetros del constructor de TextureBrush son, por tanto, la imagen y los diferentes modos en que se repiten las imagenes, contenidos en la enumeración WrapMode. WrapMode especifica cómo se colocan en mosaico una textura o un degradado cuando son más grandes que el área que se va a rellenar.

Nombre de miembro Descripción
Clamp Fija la textura o el degradado al límite del objeto.
Tile Coloca en mosaico la textura o el degradado.
TileFlipX Invierte la textura o el degradado horizontalmente y, a continuación, los coloca en mosaico.
TileFlipXY Invierte la textura o el degradado horizontalmente y verticalmente y, a continuación, los coloca en mosaico.
TileFlipY Invierte la textura o el degradado verticalmente y, a continuación, los coloca en mosaico
 
Qué le parece este ejemplo...

 Para la textura usaremos la siguiente imagen de "el Guille" que elegí de mi PC para la ilustración del ejemplo.

Aquí el código fuente y más abajo el resultado. Sea minucioso por favor, observe la disposición de la imagen como textura. 

Dim Open As New OpenFileDialog
If Open.ShowDialog = DialogResult.OK Then
    '  creamos una textura para rellenar  
    Dim myTextura As System.Drawing.TextureBrush  = New System.Drawing.TextureBrush _
    (Bitmap.FromFile(Open.FileName), System.Drawing.Drawing2D.WrapMode.TileFlipXY)
    '  rellenamos un rectángulo con la textura, en este caso la imagen de "el guille" 
    Me.TextBox1.CreateGraphics.FillRectangle(myTextura, New Rectangle(New Point(10, 10), New Size(600, 300)))
End  If

He aquí la representación TextureBrush usando como textura la imagen "el Guille"

LinearGradientBrush Rellena un objeto Brush con un degradado lineal. Esta brocha rellena un rectángulo con dos colores y transición graduada de uno a otro. La brocha está definida por un rectángulo, dos colores y una orientación de la graduación. La orientación de la graduación está incluida en la enumeración LinearGradientMode. Esta clase encapsula degradados de dos colores y degradados personalizados de varios colores.

Todos los degradados lineales se definen a lo largo de una línea especificada por el ancho de un rectángulo o por dos puntos. De manera predeterminada, un degradado lineal de dos colores es una mezcla lineal horizontal equilibrada desde el color inicial hasta el final a lo largo de la línea especificada. Personalice el patrón de mezcla con la clase Blend o los métodos SetSigmaBellShape y SetBlendTriangularShape. Personalice la dirección del degradado especificando la enumeración LinearGradientMode o el ángulo del constructor. Use la propiedad InterpolationColors para crear un degradado de varios colores. La propiedad Transform especifica una transformación geométrica local aplicada al degradado. eyyyy !!! no corrás, todo lo mencionado anteriormente se ejemplicará, pues tu amigo Percy Reyes está para ayudarte. Sigamos... con un ejemplo... 

' punto inicial del degradado
Dim myStartPointGradient As PointF = New PointF(10, 10)
' punto final del degradado
Dim myEndPointGradient As PointF = New PointF(100, 10)
' primer color del degradado
Dim StarColorGradient As Color = Color.Brown
' segundo color del degradado
Dim EndColorGradient As Color = Color.Yellow
' creamos la brocha degradada
Dim myLinearGradientBrush As LinearGradientBrush = New LinearGradientBrush( _
myStartPointGradient, myEndPointGradient, StarColorGradient, EndColorGradient)
' pintamos el rectángulo haciendo uso de la brocha myLinearGradientBrush
Dim myRectangleToPaint As Rectangle = New Rectangle(New Point(10, 10), New Size(400, 400))
Me.TextBox1.CreateGraphics.FillRectangle(myLinearGradientBrush, myRectangleToPaint)

 

 

Esta es otra forma de crear la anterior brocha degradada 

' creamos la brocha degradada
Dim myLinearGradientBrush As LinearGradientBrush = New LinearGradientBrush( _
New Rectangle(New Point(10, 10), New Size(100, 10)), Color.Brown, Color.Yellow, LinearGradientMode.Horizontal)
' pintamos el rectángulo haciendo uso de la brocha myLinearGradientBrush
Me.TextBox1.CreateGraphics.FillRectangle(myLinearGradientBrush, New Rectangle(New Point(10, 10), New Size(400, 400)))

NOTA  En cada uno de los ejemplos no se olvide de liberar recursos usados por la brocha y por el graphics. 

' cerramos la brocha liberando recursos 
myLinearGradientBrush.Dispose()
' cerramos el graphics
Me.TextBox1.CreateGraphics.Dispose()

Como había comentado en alguna parte de este artículo, podemos personalizar nuestras gradientes, mediante la clase ColorBlend, añadiendo más colores y estableciendo puntos de inicio a partir de donde empezará el pintado (en ambas vertientes) para cada color.  La clase Belnd define matrices de colores y posiciones utilizadas para intercalar mezclas de color en un degradado de color.

 

Un objeto ColorBlend contiene las matrices correspondientes de colores y posiciones. Las posiciones son valores del 0 al 1 que especifican el porcentaje de la distancia a lo largo de la línea del degradado del punto donde está ubicado el color correspondiente. Si se establece esta propiedad se crea un degradado de varios colores con un color en cada posición a lo largo de la línea de degradado. Si se establece esta propiedad se anulan todos los valores anteriores de color, posición y disminución de este objeto LinearGradientBrush. Estoy seguro que con un ejemplo su vida le será menos complicada, je, je, je...

 

 Ejemplo:

 

' creamos la brocha
Dim myLinearGradientBrush As LinearGradientBrush = New LinearGradientBrush( _

New Rectangle(New Point(100, 100), New Size(400, 100)), Color.Brown, Color.Yellow, LinearGradientMode.Horizontal)

' definimos los colores para la gradiente
Dim MezclaColores As ColorBlend = New ColorBlend
MezclaColores.Colors = New Color() {Color.Green, Color.Yellow, Color.White, Color.Red, Color.Brown, Color.Orange}

' ahora hacemos lo mismo con los puntos de inicio para los colores
Dim PuntosInicioPintado As Single() = New Single() {0.0F, 0.1F, 0.2F, 0.4F, 0.7F, 1.0F}

' establecemos las posiciones a lo largo de la línea de un degradado
MezclaColores.Positions = PuntosInicioPintado

'establecemos un objeto ColorBlend que define un degradado lineal de varios colores
myLinearGradientBrush.InterpolationColors = MezclaColores

 

' finalmente hacemos que myLinearGradientBrush  haga su trabajo

Me.TextBox1.CreateGraphics.FillRectangle(myLinearGradientBrush, New Rectangle(New Point(100, 100), New Size(400, 100)))

' cerramos la brocha
myLinearGradientBrush.Dispose()

' cerramos el graphics
Me.TextBox1.CreateGraphics.Dispose()

 

Esto es lo que se obtuvo:

PathGradientBrush Rellena la forma con colores que emanan desde el centro y los vértices de la forma y van graduando El degradado de color es un sombreado suave de colores desde el punto central del trazado hasta el límite del borde exterior del trazado. Los factores de mezcla, las posiciones y el estilo afectan a los puntos inicial y final del degradado y a la rapidez del cambio de sombreado. Los pinceles de trazado del degradado no obedecen a la propiedad SmoothingMode del objeto Graphics utilizado para realizar el dibujo. Las áreas que se rellenan mediante un objeto PathGradientBrush se procesan de la misma manera (sin alisado), independientemente del modo de suavizado. 

 

 

 

' creamos un GraphicsPath que almacenará las líneas y curvas
Dim myGraphicsPath As New GraphicsPath

' le agregamos un rectángulo
myGraphicsPath.AddRectangle(New Rectangle(New Point(100, 100), New Size(200, 200)))

' creamos la brocha, dándole como parámetro myGraphicsPath de donde extraerá el punto central
Dim myBrocha As PathGradientBrush = New PathGradientBrush(myGraphicsPath)

' le asignamos el color central
myBrocha.CenterColor = Color.White

 

' especificamos los colores para la gradiente
myBrocha.SurroundColors = New Color() {Color.Yellow, Color.Green, Color.Orange, Color.YellowGreen}

' finalmente hacemos que la brocha haga su trabajo
Me.TextBox1.CreateGraphics.FillPath(myBrocha, myGraphicsPath)

 

 

También podemos hacerlo creando un array de puntos y opcionalmente definiendo el punto central.

 

 

' creando el array de puntos
Dim Puntos() As PointF = New PointF() {New PointF(100, 100), _
New PointF(300, 100), New PointF(300, 300), New PointF(100, 300)}

' creamos la brocha, dándole como parámetro el array de puntos

Dim myBrocha As PathGradientBrush = New PathGradientBrush(Puntos )

' opcionalmente asigno el punto central, esta vez moveré el punto central...
myBrocha.CenterPoint = New PointF(150, 150)


'  le asignamos el color central
myBrocha.CenterColor = Color.White

 

' especificamos los colores para la gradiente
myBrocha.SurroundColors = New Color() {Color.Yellow, Color.Green, Color.Orange, Color.YellowGreen}

' finalmente hacemos que la brocha haga su trabajo
Me .TextBox1.CreateGraphics.FillPolygon (myBrocha, Puntos)

 

 

Algo importante a saber es que así como podíamos personalizar la gradiente usando LinearGradientBrush, de manera semejante podemos hacerlo para PathGradientBrush. Ejemplo:



'  creamos un GraphicsPath que almacenará las líneas y curvas 
Dim myGraphicsPath As New GraphicsPath
' le agregamos un rectángulo
myGraphicsPath.AddRectangle(New Rectangle(New Point(100, 100), New Size(400, 300)))

' creamos la brocha, dándole como parámetro myGraphicsPath de donde extraerá el punto central
Dim myBrocha As PathGradientBrush = New PathGradientBrush(myGraphicsPath)

' definimos los colores para la gradiente
Dim Colores() As Color = New Color() _
{Color.Green, Color.GreenYellow, Color.Green, Color.YellowGreen, Color.Green, Color.GreenYellow}

' ahora hacemos lo mismo con los puntos de inicio para los colores
Dim Puntos() As Single = New Single() {0.0F, 0.2F, 0.4F, 0.6F, 0.8F, 1.0F}

' estableciendo últimos detalles... 
Dim MezclaColores As New ColorBlend(5)
MezclaColores.Colors = Colores
MezclaColores.Positions = Puntos
myBrocha.InterpolationColors = MezclaColores

' dibujamos
Me.TextBox1.CreateGraphics.FillPath(myBrocha, myGraphicsPath)

 

Un artículo más ha sido terminado y espero que haya logrado el objetivo de ayudarte y ser de utilidad para todos. Bueno, parece que terminé sano y salvo esta vez,... aún queda muchos más artículos por escribir acerca de GDI+... no te la pierdas...!!!

Por favor, califica este artículo en PanoramaBox, pues así me animarás a continuar colaborando contigo.

Web Developer Percy Reyes                ®Todos los Derechos Reservados

Saludos desde Trujillo - Perú.

ir al índice