Creating a true transparent image that supports GIF
- Requirements: Visual Studio 2005, Visual Studio 2008, Visual Studio 2010
- Programming Level: Advance
- Language: Visual Basic.Net
Scenario:
Way back in visual basic 6.0 when i tried to use an image and I designed a GIF image with transparent background color, and I could not let the background picture or controls be appeared behind the image but instead is show the backcolor of the image control. When Visual basic.Net has been released including the latest version prior to this writing (Visual Studio 2010) still when we set the backcolor of the image control to transparent it only copies the backcolor of the parent control as what happened in a label control configurations.
Solutions:
In this article I’ll be showing you how to create your own Image Control with the properties of transparency and support with GIF Rendering (Image with Multiple Frames). In this solution you will need four(4) references: You need to create new Project and add User control object, the complete Visual Basic Project can be downloaded at the bottom of this article.
References
Imports System.Windows.Forms Imports System.Drawing Imports System.ComponentModel Imports System.Drawing.Imaging
This references should be present to be able to use the properties and methods in related with the creation of this control. The Codes is shown below
Imports System.Windows.Forms
Imports System.Drawing
Imports System.ComponentModel
Imports System.Drawing.Imaging
''' <summary>
''' Programmed by Nolan F. Sunico
''' Visit our Website at
''' http://www.sourcehints.com
''' </summary>
''' <remarks></remarks>
Public Class ImageControl
Public Sub New()
' This call is required by the designer.
InitializeComponent()
' Add any initialization after the InitializeComponent() call.
Me.SetStyle(ControlStyles.AllPaintingInWmPaint, True)
Me.SetStyle(ControlStyles.Opaque, True)
Me.SetStyle(ControlStyles.SupportsTransparentBackColor, True)
BackColor = Drawing.Color.Transparent
Me.components = New System.ComponentModel.Container()
End Sub
#Region "Private WithEvents"
Private Started As Boolean = False
Private Rect As Rectangle = Nothing
Private sWidth As Integer = 0
Private sHeight As Integer = 0
Private x As Integer = 0
Private y As Integer = 0
#End Region
#Region "Overrides"
Protected Overrides ReadOnly Property CreateParams() As System.Windows.Forms.CreateParams
Get
Dim cp As CreateParams = MyBase.CreateParams
cp.ExStyle = cp.ExStyle Or &H20
Return cp
End Get
End Property
Protected Overrides Sub OnPaint(ByVal e As System.Windows.Forms.PaintEventArgs)
Try
If Not Started Then
'Animate GIF Image using the address of go subroutines
ImageAnimator.Animate(_myImage, New EventHandler(AddressOf go))
Started = True
End If
' Update GIF Frames
ImageAnimator.UpdateFrames()
'Clear Previous Images
e.Graphics.Clear(myBase.BackColor)
'Redraw the Image
e.Graphics.DrawImage(_myImage, Rect)
Catch ex As Exception
End Try
End Sub
#End Region
#Region "Private Subroutines"
Public Sub go(ByVal sender As Object, ByVal e As EventArgs)
' Without this line, the form will not keep firing OnPaint event
Me.Invalidate()
End Sub
Private Sub StartPaint()
Try
Select Case ImageSizeMode
Case PictureBoxSizeMode.AutoSize
sWidth = _myImage.Width
sHeight = _myImage.Height
MyBase.Width = sWidth
MyBase.Height = sHeight
x = 0
y = 0
Case PictureBoxSizeMode.CenterImage
sWidth = _myImage.Width
sHeight = _myImage.Height
x = (MyBase.Width - _myImage.Width) / 2
y = (MyBase.Height - _myImage.Height) / 2
Case PictureBoxSizeMode.Normal
sWidth = _myImage.Width
sHeight = _myImage.Height
x = 0
y = 0
Case PictureBoxSizeMode.StretchImage
sWidth = MyBase.Width
sHeight = MyBase.Height
x = 0
y = 0
Case PictureBoxSizeMode.Zoom
sWidth = MyBase.Width * 0.75
sHeight = MyBase.Height * 0.75
x = (MyBase.Width - sWidth) / 2
y = (MyBase.Height - sHeight) / 2
End Select
Rect = New Rectangle(x, y, sWidth, sHeight)
Catch ex As Exception
End Try
End Sub
#End Region
#Region "Proeprties"
Private _ImageSizeMode As PictureBoxSizeMode
''' <summary>
''' The Image Size Mode for this control.
''' </summary>
''' <value></value>
''' <returns></returns>
''' <remarks></remarks>
<Description("The Image Size Mode for this control."), Category("Image")>
Public Property ImageSizeMode() As PictureBoxSizeMode
Get
Return _ImageSizeMode
End Get
Set(ByVal value As PictureBoxSizeMode)
_ImageSizeMode = value
StartPaint()
End Set
End Property
Private _myImage As Image
''' <summary>
''' The Image to be displayed in this control also supports GIF animations.
''' </summary>
''' <value></value>
''' <returns></returns>
''' <remarks></remarks>
<Description("The Image to be displayed in this control also supports GIF animations."), Category("Image")>
Public Property Image() As Image
Get
Return _myImage
End Get
Set(ByVal value As Image)
_myImage = value
StartPaint()
End Set
End Property
#End Region
''' <summary>
''' On a Resize event of the control call the StartPaint Subroutines.
''' </summary>
''' <param name="sender"></param>
''' <param name="e"></param>
''' <remarks></remarks>
Private Sub ImageControl_Resize(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Resize
StartPaint()
End Sub
End Class
I have created a print screen as shown below or you can download the complete project in Visual basic.Net, you just need to have a Microsoft Visual Studio 2010 or 2008 installed
Image may be NSFW.
Clik here to view.![Visual Basic.Net 2010 Custom Control]( "Image-Control")
Clik here to view.
Custom Image Control-vb.net
You can download the Full Source Code of Image-Control Here, but please like our Facebook Fan Page first.
Conclusion
This control can be use as a progressbar in your project using a background worker let the process be run and show this image control with an embeded GIF image. This Program can also be use in VS2005, VS2008 environment just make some any changes to suit you Visual Studio version.
Image-Control Password
ilikesourcehintsimagecontrol