Jun 132011
 

Ich stand diese Woche vor dem Problem, dass ich bestimmte Programme zur Administration immer und immer wieder brauchte. Die Navigation über das Startmenü erschien mir hierfür zu mühsam, also habe ich mir mal die Funktionsweise der Windows-7 Sidebar angesehen. Zu meiner großen Überraschung bestehen die dort angezeigten Mini-Anwendungen aus nicht viel mehr als einer HTML-Seite, ein bisschen Java-Script Code, sowie Bildern und einer CSS-Datei. Dazu kommt noch eine Manifest Datei. Um das ganze an den Kunden zu bringen ist nicht viel mehr nötig als das gesamte Verzeichnis bspw. mit 7Zip als Zip-Datei zu verpacken und dann mit der Erweiterung .gadget auszustatten. Sehr zu meiner Freude gibt es im Netz auch schon ein paar schöne Anleitungen [1] [2] [3] [4] [5] , die mir den Einstieg vereinfacht haben. Leider finden sich nur wenig Verweise darauf, wie man innerhalb des Widgets auch externe Programme starten kann und/oder diese mit Parametern versehen kann. Ich habe beim experimentieren herausgefunden, dass es sogar möglich ist eigene Exe-Dateien mitzuliefern, die dann aus dem Widget heraus gestartet werden können. In wie weit dieses “Feature” ein Sicherheitsrisiko darstellt möchte ich jetzt im Moment nicht beurteilen.

Der Einstieg

Windows-Sidebar-Gadgets finden sich an verschiedenen Stellen im Betriebssystem. Für die Entwicklung bietet es sich an im eigenen “Home-Verzeichnis” zu bleiben. Alle lokal verfügbaren Gadgets finden sich dann unter %USERPROFILE%AppDataLocalMicrosoftWindows SidebarGadgets Um den weiteren Einstieg zu vereinfachen hier mein Template für Windows-Gadgets Empty.gadget. Die einzelnen Teile erkläre ich dann im folgenden.

Was ist was?

Zunächst einmal ein kurzes Bild dazu, wie sich unser Gadget im Mini-Anwendungen Menü darstellt und welche Elemente wir alle bestücken müssen. Hier ein kurzer Überblick über die einzelnen Elemente eines Gadgets, damit man versteht wovon bei den einzelnen Dateien die Rede ist.

Verzeichnisstruktur

Ich baue meine Gadgets dann in folgender Baum-Struktur auf:

| <gadgetname>.gadget     [DIR] -> Der Einstiegspunkt
 | |--- author.png               -> Logo für den Autoren (wo das angezeigt wird später)
 | |--- drag.png                 -> Das Icon, das angezeigt wird, wenn man das Widget aktiviert
 | |--- logo.png                 -> Das Logo des Gadgets
 | | tools                 [DIR] -> Enthält "externe" Exe-Programme die das Gadget anspricht
 | | |--- putty.exe
 | | |--- WinMtr.exe
 | | |--- dig.exe
 | | images                [DIR] -> Das Untervezeichnis für alle gemeinsamen Grafiken
 | | |--- .... .png
 | | de-DE                 [DIR] -> Das lokalisierte Verzeichnis. Dient zur Sprachauswahl
 | | |--- gadget.xml             -> Die Manifest-Datei damit Windows das Projekt erkennt
 | | |--- main.html              -> Die "Hauptseite" der Anwendung
 | | |--- settings.html          -> Die Seite die angezeigt wird, wenn Einstellungen vorhanden sind.
 | | |--- flyout.html            -> Das "Flyout" der Anwendung. Was das ist, dazu später
 | | | cs                  [DIR] -> Die Cascading Stylesheets für die HTML-Seiten
 | | | | --- main.css
 | | | | --- settings.css
 | | | | --- flyout.css
 | | | js                  [DIR] -> Der Javascript-Code der Leben bringt
 | | | | --- main.js
 | | | | --- settings.js
 | | | | --- flyout.js
 | | Doku                  [DIR] -> Ein bisschen Dokumentation des Gadgets
 | | -- ...
 | | SRC                   [DIR] -> Quell-Dateien (bspw. XCF-Bilder vor der Skalierung und Konvertierung)
 | | -- ...

Stolperfallen bei der Entwicklung

Während der Entwicklung bin ich immer wieder auf kleinere Stolperfallen gestossen, die ich nicht unerwähnt lassen möchte, bevor wir uns dem eigentlichen Projekt zuwenden.

  • Die Background-Image-Datei wird gecached. Erst nach einem Neustart von sidebar.exe wird die Änderung sichtbar. Andere CSS-Eigenschaften werden direkt übernommen.
  • Bei übereinander gelagerten Bildern mit Transparenzen (das schliesst die Hintergrund-Grafik mit ein) kommt es zu “magenta” Flecken, wenn zwei transparente Bereiche aufeinander zu liegen kommen. Der Alpha-Kanal wird beim Rendering also nicht durchgehend verrechnet, sondern immer nur auf der aktuellen Ebene berücksichtigt.
  • Achtung bei der Wahl der Option “deinstallieren” im Menü der Mini-Anwendungen. Dieser Befehl löscht gnadenlos das gesamte Gadget-Verzeichnis und somit ggf. auch die ganze Arbeit. Es bietet sich daher an die “Quelldateien” auch noch an einer anderen Stelle (am besten in einem Code-Repository) zu lagern. GIT ist hier nur zu empfehlen, wenn auch ein zusätzlicher Upstream existiert, denn bei der “Deinstallation” würde auch das .GIT Verzeichnis gelöscht und somit ist auch wieder alles futsch.

Projekt-Templates

Ich versuche bei der Entwicklung von Programmen nach Möglichkeit immer wieder die gleichen Schema und Templates zu verwenden. Dadurch bleibt der Code leichter wartbar und man versteht auch mit ein bisschen Abstand noch, was man da mal programmiert hatte. Außerdem steigt dadurch die Wiederverwendbarkeit deutlich an und die Zeit zur Erstellung des eigentlichen Programms wird geringer.

Aus dem Grund folgen jetzt auf den nächsten Seiten ersteinmal alle Templates, die ich für das Schreiben von Gadgets verwende.

Auf der nächsten Seite geht’s weiter.

  •  13. Juni 2011
  •  Posted by at 12:46
  •   Kommentare deaktiviert für Erstellen von Sidebar-Gadgets für Windows 7
  •   Programmierung