TomTom: Icons für eigene Programme

Man kann sowohl für eigene Programme wie auch für die Standard-Befehle eigene Symbole hinterlegen. Für die eigenen Programme geht das über die CAP-Dateien, für andere Befehle über Menüanpassungen.

Format

Als Symbol werden BMP-Dateien im Format 76×48 Pixel akzeptiert. (Kleinere Bilder werden auf dieses Format gestreckt).

Als transparente Farbe kann Rot (entsprechend FF0000) eingesetzt werden. Dabei ist der Rotton nur dann transparent, wenn das Symbol mindestens die oben angegebene Größe hat!

Beispiel

Als Beispiel die Erstellung eines Symbols für einen Taschenrechner.

Als Basis nehme ich dafür das Symbol „accessories-calculator“ von den Tango-Icons.

Diese Symbole liegen im SVG-Format vor. Das hat den Vorteil, dass mann (z.B. mit Inkscape das Symbol vorher leicht bearbeiten kann.

Die eigentliche Erstellung des Symbols habe ich mit Gimp vorgenommen.

Gimp einstellen

In Gimp als Vordergrundfarbe einen „TomTom-ähnlichen“ Blauton – ich verwende #a0c8f0 – und als Hintergrundfarbe Rot (#ff0000) einstellen.

GIMP Grundeinstellungen

Datei öffnen

Jetzt können wir die Basis-Datei öffnen. In unserem Falle ist das die SVG-Datei, die wir durch Gimp so rendern lassen, dass sie in das vorgegebene Maß von 72×48 Pixeln passt, also z.B. mit 48×48 Pixeln.

SVG öffnen

Natürlich kann man hier auch ein passendes Symbol eines anderen Formats (png,…) verwenden.

Symbol bearbeiten

Das Symbol hat halbtransparente Bereiche, die u.a. für den Schatten sorgen. Würde man jetzt den Hintergrund einfach rot einfärben, so würden diese halbtransparente Bereiche über dem rot liegen und hässliche Effekte hervorrufen.

Aus diesem Grund sorgen wir dafür, dass der gesamte Bereich „hinter“ dem Symbol mit einem Blauton eingefärbt wird.

Dafür muss zunächst die Bildebene kopiert werden (das Ebenenfenster lässt sich mit Strg+L einblenden).

Ebene kopieren

Dann die obere Ebene ausblenden und die untere Ebene aktivieren.

Ebene aktivieren

Diese untere Ebene füllen wir jetzt komplett mit dem eingestellten Blauton. Im Gimp dazu den Farbeimer Farbeimerwählen. Die EInstellungen sollten lauten „Füllart VG-Farbe“, „Ähnliche Farben füllen“, „Transparente Bereiche füllen“, und die Schwelle sollte auf 255 hochgesetzt werden.

Fülleinstellungen

Mit dem Cursor klickt man nun ein mal ins Bild und hat damit den blauen Hintergrund geschaffen.

Als nächsten Schritt vergrößern wir die Bildgröße, um die für das TomTom-Symbol notwendige Bildgröße zu erreichen. Im Menü „Bild“ den Punkt „Leinwandgröße“ wählen. Um die Maße 76×48 eingeben zu können, muss man die Verkettung der Werte für Breite und Höhe lösen (auf das Kettensymbol klicken). Mittels „zentrieren“ wird der Versatz so eingestellt, dass das ursprüngliche Motiv in der Mitte zu liegen kommt.

Leinwandgröße

Jetzt fehlt noch die rote Farbe als Hintergrund für die transparenten Bereiche. Dazu eine neue Ebene anlegen und die Füllart „Hintergrundfarbe“ angeben.

Im Ebenenfenster muss man jetzt noch die rote Ebene an die richtige Stelle – ganz unten – ziehen und die oberste Ebene wieder einblenden:

Ebenenstapel

Das Ergebnis sieht nun so aus:

Fertige Grafik

Ergebnis

Und so sieht das Ergebnis auf dem TomTom aus:

Grafik auf TomTom

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.