C# ColorPicker Gadget

• Download installed (source included!) - 506.9 KB
• Download source - 148.5 KB

Introduction

This gadget is based on my article, "Pure C# .NET Desktop Color Picker With Magnifying Glass". It uses the MagnifyingGlass class and the Windows API methods (because Windows is a system requirement to run as Windows Vista Sidebar Gadget ;).

After running the gadget in your sidebar, you see the current selected color. You may select another color by clicking the color preview panel from the default Windows color dialog. To select a color from the desktop, simply click on the pipette button to enter the select mode. In the select mode, you'll see two magnifying glasses: one following the cursor, another fixed one in the gadget GUI. The gadget will also display the color of the current pixel in the preview panel on the right side. Just click to quit the exit the select mode and select the color of the pixel under the mouse cursor. To copy a color value to the Windows clipboard, just click on it in the gadget GUI.

The ColorPicker Gadget may be useful for designers to get color values fast and easy, every time from everywhere.

Using the Code

You can download only the source or the complete gadget with an installer, including the source. If you choose to install the complete gadget, you'll find the source zipped in the application folder (f.e. "C:\Program files\Andreas Zimmermann\ColorPicker Gadget\") after installing. After unzipping the source, you find all gadget files that will be copied by the Vista installer in the subfolder "Gadget". All other files are the Visual Studio project files for the ColorPickerGadget.dll.

Please have a look at my article, "Pure C# .NET Desktop Color Picker With Magnifying Glass", if you want to get information about how to use the MagnifyingGlass class.

A way to display a C# user control within the gadgets HTML is to make the DLLs COM visible and register the class, so you can use the object HTML tag like this:

<object classid="clsid:fc720f6d-e15d-4b4d-82af-
    4dff1fb3db4d" width="120" height="78" />

I used this class header for the COM:

[Guid("fc720f6d-e15d-4b4d-82af-4dff1fb3db4d"),
ComVisible(true)]
public partial class Gadget : UserControl
{
    ...
}

While writing the code, I didn't care much about the fact that the application will run as Sidebar Gadget. The only one target was to make the GUI as small as possible (120 x 100 pixel should be small enough), but to include as many functions as possible, too.

The only real problem I had was the installation: How would the user be able to install the gadgets only with a few mouse clicks and without caring about how it works? Simply zipping the files and changing the extension to ".gadget" was no solution because the COM classes have to be registered to get them working. So I decided so make an MSI installer that will prepare the use of the gadget. After the installer finished, the folder with the shortcut to the .gadget-file will be opened (for this, I created the class Setup within the ColorPickerGadget.dll). Finally, the user needs to click on "Use ColorPicker Gadget" to install the gadget to the Sidebar.

Points of Interest

This was my first attempt to get something running in the Sidebar. And I had some problems with doing that... So if you want to develop your own gadget, you may be interested in this:

Transparent Background

If you want to use a transparent background, you use something like this:

<g:background src="images/tbg.png" style=
    "position:absolute;left:0px;width:120px;height:100px;
    top:0px;z-index:-999;" />

Don't show any text or links on this transparent background, it'll look ugly: Place text elements on a coloured background always.

CSS

I had some problems using CSS for defining a style for text links: The hover behavior was ignored. I don't know the reason yet, but maybe you'll have similar problems with other CSS attributes...

Use of an COM Object as GUI

At first, the ColorPicker Gadgets GUI was only made of the .NET user control. But then I realized that no options (for moving, closing, etc.) are fading if I hover the GUI while it's used as Sidebar Gadget. At last, it seems you need to view a small non-user control area (finally, the wan24.de-link on the ColorPicker Gadget GUI bottom) to enable the user closing and configuring the gadget.

Another problem is that - like I wrote above - it may not be enough to zip and change the file extension to ".gadget" to have an installer. If you want to use COM objects that are not yet trusted at the target system, they won't work! I chose an MSI installer for preparing the gadget as a solution.

History

• 11^th February, 2007: Initial version