Walkthrough: Creating a Custom Toolbox Icon for a Control
This walkthrough shows how to create a Toolbox icon for a Windows Presentation Foundation (WPF) custom control. When you add the custom control to the Toolbox, the icon appears next to the control's name.
In this walkthrough, you perform the following tasks:
Create a WPF custom control library project.
Create a custom bitmap file for the control's Toolbox icon.
Test the control's icon at design time.
When you are finished, you will know how create a Toolbox icon for a custom control.
Note
The dialog boxes and menu commands you see might differ from those described in Help depending on your active settings or edition. To change your settings, choose Import and Export Settings on the Tools menu. For more information, see Working with Settings.
Prerequisites
You need the following components to complete this walkthrough:
- Visual Studio 2010.
Creating a Custom Toolbox Icon
To create a custom Toolbox icon for a control, add an image as an embedded resource to the control's project.
To create a custom Toolbox icon
Create a new WPF Custom Control Library project in Visual Basic or Visual C# named CustomControlWithToolboxIcon.
The code for CustomControl1 opens in the Code Editor.
From the Project menu, select Add New Item.
The Add New Item dialog box opens.
In the Add New Item dialog box, select the General category.
In the list of templates, select Bitmap File, name the new file CustomControl1.Icon.bmp, and then click Add.
The Image Editor opens.
In the Properties window, set the bitmap's Colors property to 24 bit.
Use the Image Editor tools to paint an image in the bitmap. For more information, see Image Editor.
In Solution Explorer, select CustomControl1.Icon.bmp.
In the Properties window, set the Build Action property to Embedded Resource.
Build the solution.
For more information, see Toolbox Icons.
Testing the Toolbox Icon
Test your custom Toolbox icon by adding CustomControl1 to the Toolbox.
To test the Toolbox icon
Add a new WPF Application project in Visual Basic or Visual C# named TestApplication to the solution.
MainWindow.xaml opens in the WPF Designer. In the Toolbox, CustomControl1 appears in the CustomControlWithToolboxIcon Controls tab.
.png "Toolbox with custom control")
In the Toolbox, right-click CustomControl1 and select Delete.
In the message box that appears, click OK.
CustomControl1 is removed from the Toolbox.
In the Toolbox, right-click the control group where you want to add the control and then select Choose Items from the context menu.
The Choose Toolbox Items dialog box opens.
In the Choose Toolbox Items dialog box, click the WPF Components tab. For more information, see WPF Components Tab, Choose Toolbox Items Dialog Box.
Click Browse and navigate to CustomControlWithToolboxIcon project's bin\Debug folder.
In the Open dialog box, select CustomControlWithToolboxIcon.dll and click Open.
Details of the CustomControlWithToolboxIcon assembly appear in the Choose Toolbox Items dialog box. Your custom icon appears in the CustomControl1 group box.
Click OK.
CustomControl1 appears in the Toolbox with its corresponding icon.
.png "Custom Toolbox icon")
See Also
Tasks
How to: Embed an Icon in an Assembly
Walkthrough: Providing Metadata for Toolbox Icons
Reference
WPF Components Tab, Choose Toolbox Items Dialog Box