This course - Install a custom control in the Toolbox (Tutorial 1)

last updated: 08/07/2006

In this tutorial, you create your own customized button control and install it in the Toolbox in the Windows Forms Designer. There are fourteen steps...

  1. Create a new C# Windows Control Library project. To do so, open VS.NET and prepare to create a new Project from the File...New...Project menu:


     
  2. In the New Project popup window, select “Visual C#" and "Windows" in the left pane, and “Windows Control Library” in the right pane. At the bottom, modify the Solution Name and Location to reflect the folder and path for the new solution. Modify the Name to be "PrettyButton" (this will be the Project name and folder):


     
  3. The project will start with the default class, UserControl1.cs, open in design mode:


     
  4. Now edit the custom control class to do what you want. View code for file UserControl1.cs and modify the class name and inheritance:
       OLD:   public partial class UserControl1    : UserControl
       NEW:   public partial class BeautifulButton : Button
       
    Also, rename the constructor method from UserControl1 to BeautifulButton:


     
  5. Click on the + next to file UserControl1.cs; this should expand to reveal the Windows Forms Designer file, UserControl1.Designer.cs. This file contains part of the code automatically generated for you by the Windows Forms Designer. View code for file UserControl1.Designer.cs and also change its class name from UserControl1 to BeautifulButton.


     
  6. Close and save both files and try to build the project. You'll probably get a compile error--just click on the error to open the code to the error location, and comment out the offending line of code as shown below and rebuild (this seems to be a bug):


     
  7. A final cleanup step--with both .cs files closed, rename file UserControl1.cs to BeautifulButton.cs. Now rebuild--there should be no errors this time, and your project should look like this:


     
  8. Double click on file BeautifulButton.cs to open it in design mode; look at its Properties pane as shown in the lower right, below (you might have to select the menu View...Properties Window to see the pane):


     
  9. In the Properties pane toolbar, click once on the lighting bolt icon:


     
  10. Clicking the Lightning Bolt icon should cause the Properties pane to diplay a list of all the events which a button control can raise. Scroll the list of events until you see "Click" in the list, and then double-click in the empty space to the right of "Click". After double-clicking, it should appear as shown below; this has automatically generated an empty method, named BeautifulButton_Click, in file BeautifulButton.cs.


     
  11. View code for file BeautifulButton.cs and add the following code to the BeautifulButton_click event (copy the code from this plain text file):
       private void BeautifulButton_Click(object sender, System.EventArgs e)
       {
          Random r = new Random();
          this.Text = r.Next(100).ToString();
       }
       

     
  12. Build the project (but do not run it yet); this should create file PrettyButton.dll underneath the \bin folder of your project folder.

    Create a new C# Windows Application project, named ApplicationTestPrettyButton, to the Solution (right-click over the Solution name to access menus for doing this). You'll need to open the project's form in design mode and then view the Toolbox by selecting View...Toolbox from the VS.NET menus.

    Now add file PrettyButton.dll to the toolbox as follows. With your mouse over the Toolbox and somewhere inside the “Window Forms” pane of the Toolbox, right-click and select “Choose Items...” from the popup menu. This will bring up a wizard that sometimes takes awhile to appear--be patient.


     
  13. In the Choose Items... popup, click browse and find your .dll file on the file system. This will probably be found in My Documents\Visual Studio Projects\PrettyButtonDLL\Pretty Button\bin\Debug\PrettyButton.dll.

    Click open, then OK. A new component, BeautifulButton, should now appear in your Toolbox (at the bottom of the list in the pane where you originally clicked). Test it by dragging the control onto the form:


     
  14. Now build and run the test application; when you click on the BeautifulButton control in the running application, it should display a random number. You can add multiple BeautifulButtons to your form, and all should exhibit this behavior when the program runs.
     
    NOTE: Click to expand the References list in your test application, and you'll see that the Windows Form Designer has added a reference to the "PrettyButton" namespace for you.  The fully qualified name for your new component is PrettyButton.BeautifulButton.  You can view the Form1.Designer.cs file to verify this.



Visitors: Hit Counter