Programming Windows Sidebar Gadgets

It’s been a long time since Windows Vista is introduced to the IT World(And how much we are thankful for Windows 7 being introduced!)

One of the remarkable things about Post-XP Windows, is the cute Gadgets floating around our desktops!

This posts tells you how you can make your own Gadgets for Windows Sidebar*

What is a .gadget file?

If you are a curious Mac user(or possibly Yahoo Widget Engine user.) you may already know the answer to this question.
A .gadget file is just an archive file(.ZIP file.) wrapping a bunch of stuff together and making them ready for running under Sidebar.exe.

What is in a .gadget file?

A simple gadget, must have 2 files:

• gadget.xml
• An HTML Startup Page

A more complicated one, can have these files too:

• CSS Files for Styling
• Javascript Codes (Interacting with Sidebar APIs)
• A bunch of Images

Gadget.xml:

The manifest of your Gadget. Everything that sidebar should know about your gadget is stored in this file.
This is a general form of a gadget.xml file:

HTML Startup page:

A really simple page containing your gadget.

Sidebar.exe APIs

Well nobody like a static gadget!
Fortunately, you can spice up your gadgets with some APIs provided by Sidebar.exe. For example you can access Power Information of the machine your gadget is running on. Or the information about machine’s Total Memory and Available Memory or available networks in wireless range etc.

Here is a sample Javascript:
(this code uses Sidebar.exe APIs to get Machine Power Status)

function OnPageLoad() {
    System.Machine.PowerStatus.powerLineStatusChanged = GetPowerStatus;

    GetPowerStatus();
}

function GetPowerStatus() {  
    var sMachineInfo;
    // Get the machine details.
    if (System.Machine.PowerStatus.isPowerLineConnected == true) {
        sMachineInfo += "Connected to External Power." + "<br/>";       
    } else {
        var percent = System.Machine.PowerStatus.batteryPercentRemaining;       
        sMachineInfo += "Power Percent Remaining: " + percent.toString() + "%<br/>";
    }

    // Initialize the gadget content.
    var s = document.getElementById("gadgetContent");
    s.InnerHTML = sMachineInfo;
}

Deploying your gadgets:

In order to deploy your gadgets, you should select it’s files and put them into a .ZIP archive. Then change the extension of the file from .ZIP to .Gadget in order to make it visible to Sidebar.exe

Where to now?

http://msdn.microsoft.com/en-us/library/dd370867(VS.85).aspx#development
http://www.codeproject.com/KB/gadgets/InsideBar.aspx

And I really recommend this book (for a quick review, check the book’s source codes.):

And you know the most accurate reference for Microsoft APIs, is MSDN.

* You can use all of these resources for Windows Sideshow Gadget development.