How to create real transparent image

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 &amp;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

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.