How to Create a Custom Button Control in VB.NET

Reusable classes and controls are a very important part of any object-oriented programming language. More so is the ability to create your own controls or customize existing ones. In this tutorial, we'll learn how to create a custom button using the pre-existing Button class.

Firstly, as for any VB.NET project, launch Microsoft Visual Basic or Microsoft Visual Studio. From the start menu, select "New Project", then "Class Library" from the dialog. Name your project and confirm.

How to Create a Custom Button Control in VB.NET

You should be taken to an almost blank Class file. The first thing we'll want to do is add the necessary references to the project. This can be done by right-clicking the project name from the Solution Explorer and selecting "Properties" from the contextual menu. From the menu that appears, select the "References" tab and  click on the "Add" button.

How to Create a Custom Button Control in VB.NET

From the list that appears, you'll have to add the following:
  • System.Windows.Forms
  • System.Drawing
How to Create a Custom Button Control in VB.NET

Once that is done, go back to your empty Class and add these namespaces:
Imports System.Windows.Forms
Imports System.Drawing
Now lets get to the actual coding! Since we're modifying the existing Button Class, we'll want to inherit from it. This can be done by entering the following code under the last Public class statement:
 Inherits Windows.Forms.Button
Now, we want to create the actual control. This is done in the New() Sub:
Public Class New()
       Me.Size = New System.Drawing.Point(90, 25)
        Me.FlatStyle = Windows.Forms.FlatStyle.Flat
        Me.BackgroundImage = DefaultImage
        Me.BackgroundImageLayout = Windows.Forms.ImageLayout.Stretch
        Me.BackColor = Drawing.Color.Transparent
        Me.Font = New System.Drawing.Font("Tahoma", 9.01, Drawing.FontStyle.Regular, Drawing.GraphicsUnit.Point, CType(0, Byte))
        Me.ForeCo End Sublor = Drawing.Color.White
Me.FlatAppearance.BorderColor = Drawing.Color.Gray
        Me.FlatAppearance.MouseDownBackColor = Drawing.Color.Transparent
        Me.FlatAppearance.MouseOverBackColor = Drawing.Color.Transparent
        Me.FlatAppearance.BorderSize = 0
Change me.backgroundimage = default image , change the default image with your normal button image name

Now add 3 button images for Mouse Down,Mouse Hover and Normal to the resources and add this code under the end sub

*Change the image names with my.resources.imagename

Private Sub MyButton_MouseDown(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles Me.MouseDown
        Me.BackgroundImage = MouseDownImage
    End Sub

    Private Sub MyButton_MouseEnter(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.MouseEnter
        Me.BackgroundImage = MouseHoverImage
    End Sub

    Private Sub MyButton_MouseLeave(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.MouseLeave
        Me.BackgroundImage = DefaultImage
    End Sub

    Private Sub MyButton_MouseUp(ByVal sender As Object, ByVal e As System.Windows.Forms.MouseEventArgs) Handles Me.MouseUp
        Me.BackgroundImage = MouseHoverImage


Now save your project and click build

How to Create a Custom Button Control in VB.NET

Go to your project files and check inside debug

How to Create a Custom Button Control in VB.NET

Hooray !!!! you just created a button control now i will tell you how to use it go ahead and create a new windows forms project and right click and click choose items

How to Create a Custom Button Control in VB.NET

This window will pop UP

How to Create a Custom Button Control in VB.NET

Click browse and select your dll and click ok

How to Create a Custom Button Control in VB.NET

Now see your toolbox
How to Create a Custom Button Control in VB.NET

Now just drag it in to the form

How to Create a Custom Button Control in VB.NET

I hope you enjoyed the tutorial , dont forget to comment.

24 comments

Thanks sir,, :) nice tutorial..

Reply

hey Have you created the video tutorial?
If then please send me the link.

And yes, How you can type this code in this manner in your Website?

Reply

Hi,

I am sorry i haven't created a video tutorial about this article , if you mean the syntax i use this http://alexgorbatchev.com/SyntaxHighlighter

Reply

hi sir.
may i request a skin or theme?
please :)

Reply

very good :)

Reply

I've tried it but i got Error when i try

Unable to cast object of type 'System.EventArgs' to type 'System.Windows.Forms.MouseEventArgs'.

any IDEA?

Reply

Did you add Inherits Windows.Forms.Button?

Reply

It's not cleared
When i try your code i stop because some code have errors.

Reply

why is there a me ? it has a form ?

Reply

You don't need to have a form to use 'me' when you make controls because it the control requires the form when it's used only.

Reply

please can you swend me the whole program code or the dll file as attachment at mogal.munib503@gmail.com

Reply

It appears that the tutorial needs some work. In VS2013 you can't name a sub "New()". Perhaps I have completely misunderstood what you meant when you said to create the actual control "This is done in the New() Sub"

Reply

Sorry. I finally see that you meant the already existing Sub New() that is under the newly created class.

Reply

Thanks dude, nice one!!! was looking for this online for quite some time, could not come across anything as simple. haha

Reply

What is span class="skimlinks-unlinked" I Dont Understand

Reply

It's some HTML tag jumped in

Reply

You can what a lot of people can not: Explain things in a simple way. Thanks, now I understood...

Reply

how do you change the statement:

me.backgroundimage = defaultimage

to something that compiles/builds without errors?

Reply
This comment has been removed by the author.

The 'Me' has an error

Reply

Can you make one on custom tab control like operas?

Reply

waoooo i enjoy dis but little prob show up pls can som1 send me d full source code on whatsapp 08180135037 or deji.ayo53@yahoo.com

Reply

Thank you for your tutorial.

Reply

Post a Comment

Note: Only a member of this blog may post a comment.