Page 1 of 1

A Simple Custom Control (focussed TextBox) Rate Topic: -----

#1 andrewsw  Icon User is online

  • Build your own boat!
  • member icon

Reputation: 6204
  • View blog
  • Posts: 24,735
  • Joined: 12-December 12

Posted 21 August 2016 - 05:09 AM

This tutorial shows how to create a simple custom control and add it to Forms in other projects. The custom control is just a TextBox that changes colour as you tab into, and away from, it. The default focussed background colour can be changed.

Create a new Class Library (.dll) project. I named mine MyControls.

In the Solution Explorer window right-click your project and choose Add, New Item, and Custom Control. Change the name to FocussedTextBox.vb. You'll see a blank surface on which you can add existing controls, images, etc..

From the Toolbox add a TextBox to the surface. Change its Dock property to Fill and reduce the height of the surface so that it just contains the TextBox control.

(You could change the name of the TextBox to something other than TextBox1.)

Double-click the TextBox to get to the code behind it, or right-click and choose View Code.

There is a default New constructor that I'm using for the Default focussed colour of Yellow, but I've add another constructor which accepts a different colour. Don't forget to include Imports System.Drawing for Color. Here's the code:
Imports System.Drawing

Public Class FocussedTextBox
    Public Property FocusColour As Color

    Public Sub New()

        ' This call is required by the designer.
        InitializeComponent()

        ' Add any initialization after the InitializeComponent() call.
        FocusColour = Color.Yellow
    End Sub

    Public Sub New(colour As Color)

        ' This call is required by the designer.
        InitializeComponent()

        ' Add any initialization after the InitializeComponent() call.
        FocusColour = colour
    End Sub

    Private Sub TextBox1_Enter(sender As Object, e As EventArgs) Handles TextBox1.Enter
        Me.TextBox1.BackColor = FocusColour
    End Sub

    Private Sub TextBox1_Leave(sender As Object, e As EventArgs) Handles TextBox1.Leave
        Me.TextBox1.BackColor = SystemColors.Window
    End Sub
End Class


SystemColors.Window is the default background colour for a TextBox.

The code simply uses the Enter and Leave events of the TextBox to change, and reset, the background colour.

Choose the Build menu and Configuration Manager and change the Configuration to Release rather than Debug. Then Build the Project.



Changing this configuration is not an essential step. For our simple purpose it just means that our custom control will be found in a Release folder (that is created) rather than the Debug folder.

In reality, more planning and testing is necessary, to fully build and test our custom controls, or control library, before getting them to their finalized stage. Like all other controls we expect them to be fully tested and functional when we add them to our project(s)!




Close the current project. Create a new WinForms project which I named UseMyControl.

Right-click within the Toolbox and click Choose Items... There is a Browse.. button that we will use but you might have to wait a while until all existing controls are located and the button is no longer greyed out.

Browse to find the previous project, its bin folder and Release folder. Select MyControls.dll inside this folder.

(Some first choose Add Reference from the Project menu but I found that directly locating our control from the Toolbox adds this reference automatically.)

Now that our custom control appears in the Toolbox we can add it to our form and it will work as expected.

Dragging the control from the Toolbox uses the default constructor, and the background when focussed will be yellow. To use our other constructor we can add a control programmatically:
Public Class Form1
    Private blue As MyControls.FocussedTextBox

    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        blue = New MyControls.FocussedTextBox(Color.Blue)
        blue.Left = 250
        blue.Top = 40

        Me.Controls.Add(blue)
    End Sub
End Class


(You may need to make your form bigger to see this control.)

Alternatively, because FocusColour is exposed as a public property of the control it appears in the Properties Window for one of our controls and can be changed from there.

Attached Image

I hope that you find this outline of the basic steps useful. Of course, there is much more to explore with Custom Controls.

Is This A Good Question/Topic? 0
  • +

Page 1 of 1