Mattes Groeger

Developer Blog

Icon Badge for Windows

Until now the Air Icon Badge library implementation only supported OS X dock icons. Nevertheless it is easy to extend the implementation for utilizing it as Windows system tray icon. In this article I will demonstrate how this could be realized.

Demo

I extended the existing example implementation. Just choose “Window Tray Icon” from the right panel for previewing the new icon.


Implementation

The first class that I create is the SystemTrayIconBuilder (it must implement IconBuilder interface). This class is responsible for composing the system tray icon. It also sets the general icon size to 16 by 16 pixels.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
public class SystemTrayIconBuilder extends AbstractIconBuilder implements IconBuilder
{
  public override function createNewIcon(width : int, height : int) : void
  {
    super.createNewIcon(16, 16);
  }

  public override function addBackground( background : Bitmap) : void
  {
    background.width = background.height = 16;

    container.addChild(background);
  }

  public override function addBadge(label : String) : void
  {
    var badge : TrayIconBadge = new TrayIconBadge();
    badge.label.text = label;

    container.addChild(badge);
  }
}

Please note the the TrayIconBadge class used in this example (line 17) is a MovieClip designed and exported (swc) with the Flash IDE. I used a pixel font for better readability. Because of the small icon size the visible letter count is also limited.

The next step is to create a custom SystemTrayIconBadge which has to implement the IconBadge interface. To avoid redundancies I extend the DockIconBadge class and override the factory method “createIconBuilder()”.

1
2
3
4
5
6
7
public class SystemTrayIconBadge extends DockIconBadge
{
  protected override function createIconBuilder() : IconBuilder
  {
    return new SystemTrayIconBuilder();
  }
}

The last step is to build the CrossPlatformIconBadgeFactory which implements IconBadgeFactory. It is responsible for detecting the users operating system and returning the corresponding IconBadge. Again I extend the existing factory class to avoid redundancies:

1
2
3
4
5
6
7
8
9
10
11
public class CrossPlatformIconBadgeFactory extends
AirIconBadgeFactroy
{
  public override function create() : IconBadge
  {
    if (NativeApplication.supportsSystemTrayIcon)
      return new SystemTrayIconBadge();

      return super.create();
  }
}

Finally for using the new factory it has to be assigned to the AirIconBadge class.

1
2
AirIconBadge.factory = new CrossPlatformIconBadgeFactory();
AirIconBadge.label = "1";

Summary

As you can see, it is very little effort to add the windows system tray icon capability. You are free to (re)use this example. Binaries and sources can be downloaded from the google code project site.

Comments