glyFX Guides : Microsoft Visual Studio .NET
Using glyFX icons in Microsoft Visual Studio .NET
This document outlines the basic procedure on how to use the glyFX toolbar images with Microsoft Visual Studio .NET tools. The steps for using glyFX icons on your toolbars, buttons and other controls is the same, regardless of whether you use Visual Basic, Visual C#, Visual C++ or Visual J#, as the components are common to all.
There are two main mechanisms for adding icons on your controls, image lists and embedding into controls.
Image Lists
Image Lists allow you to keep a single object that contains all of your icons in one place. The advantage is that you can edit the images in the Image List, and the controls will automatically update if you have made any changes to those icons. If you use a particular image on more than one control it also lets you store just one copy of the image within the application, rather than within each control. This guide is broken up into 4 seperate parts;
- Part 1 - Adding an Image List
- Part 2 - Setting Image List properties
- Part 3 - Adding icons to the Image List
- Part 4 - Using the Image List
Embedding
Embedding an image directly into a control is a fast way of assigning icons to your user interface elements. The selected control will directly store the image resource. This method is not as efficient as using Image Lists, but is sometimes necessary as some controls are not compatible with Image Lists. This guide has just 1 part;
Image Lists: Part 1 - Adding an Image List
Step 1
Select the Windows Form components in the Toolbox panel.
Step 2
\
Scroll down the list, until you find the ImageList component, and select it.
Step 3
Drag the ImageList component to your form, it will automatically appear beneath the form designer.
Image Lists: Part 2 - Setting Image List properties
Step 1
Click the TransparentColor editor button in the Properties panel. Scroll down to Fuchsia and double click it (this is the default background colour for the glyFX bitmap files).
Step 2
Click the ColorDepth editor button in the Properties panel. Select the Depth16Bit or Depth24Bit option and double click it. Please note, the images will also work when set to Depth8bit (for 256 colour systems), however their quality will be lower.
Step 3
Depending on what size you require, edit the ImageSize Width and ImageSize Height properties to the required size (depending on which sets you own, this may be 16, 24, 32, 48 or 64). Both dimensions must be the same.
Step 4
Click the Images editor button to invoke the Image Collection Editor (where you can add individual icons to the Image List).
Image Lists: Part 3 - Adding icons to the Image List
Step 1
Click the Add button in the Image Collection Editor window. This will display a standard Windows Open File dialog, where you may select a bitmap (.BMP) or gif (.GIF) image from one of the glyFX folders.
Step 2
Once you have selected an image, the Collection Editor will display the icon you have added. You can continue adding as many images as you need (you can always edit the contents of the ImageList at a later stage).
Image Lists: Part 4 - Using the Image List
This part demonstrates how to use the ImageList with a standard button control. The procedure is identical for other controls that support the ImageList.
Step 1
Select the Button control from the Toolbox panel (which can be found in the Windows Forms section) and drag the button to the form.
Step 2
Click the ImageList dropdown button in the Properties panel, and select the ImageList control you want to use.
Step 3
Click the ImageIndex dropdown button in the Properties panel, and select the icon that you want to use on this button (or other control).
Step 4
The final result - a button control containing a high quality glyFX toolbar icon!
Embedding: Part 1 - Adding images to controls
This example shows how to add an image directly to a Button control, the procedure is similar for other controls.
Step 1
Select the Windows Form components in the Toolbox panel.
Step 2
Select the Button control from the Toolbox panel and drag the button to the form.
Step 3
Click the Image editor button in the Properties panel. This will display a standard Windows Open File dialog, where you need to select a gif (.GIF) or png (.PNG) image from one of the glyFX folders.
Do not select the bitmap (.BMP) images, as these will display with a Fuschia background (Visual Studio can only mask background colours when you use an Image List). Please see our FAQ page for details on how to get the PNG and GIF versions of the images.
Step 4
The final result - a button control containing a high quality glyFX toolbar icon!
