HowTo: Typografisches iPhone Theme

Posted by Tobias on 2011-09-23 at 2:57 pm

Bevor endlich das neue Notification Center mit iOS 5 erscheint hätte ich hier noch eine interessante Modifikation - nämlich ein Theme. Genauer gesagt ein Winterboard Theme für das iPhone 3G bzw. 3GS. Eigentlich bin ich selbst kein Fan von Themes oder Winterboard, aber als ich das gesehen hatte, war ich direkt von der Schlichtheit überzeugt. Leider gestaltet sich die Installation nicht durchgängig einfach und verständlich, daher gibt es hier ein kleines HowTo.Zunächst einmal der kleine Haken an der Geschichte... Die Installation des Themes erfordert sowohl, dass das iPhone gejailbreaked ist als auch ein paar Kenntnisse, wie sich Dateien auf dem iPhone manuell verändern lassen. Zweiteres beschreibe ich aber im folgenden Tutorial genau - somit sollte nichts schief gehen. Anzumerken wäre noch, dass sich die Anleitung nur auf die Installation auf einem iPhone 3G bzw. 3GS bezieht. Für ein iPhone 4 gibt es (wegen dem Retina-Display) ein anderes Installationsverfahren.

Schritt 1: Paketinstallation via Cydia

Wie schon gesagt ist ein Jailbreak Voraussetzung für dieses Theme. Wer einen Jailbreak an seinem iPhone durchgeführt hat weiß demnach auch, was Cydia ist. Über Cydia sollten jetzt die folgenden Pakete gesucht und installiert werden:

    • Typophone Weather - Das eigentliche Theme.
    • Lockscreen Clock Hide - Blendet die "normale" iOS Uhr im Lockscreen aus.
    • Hide Slide To Unlock - Blendet den "Slide to unlock" Text im Lockscreen aus.

Optional kann noch ein weiteres Paket Namens "Lockscreen Dim Delay Control" installiert werden. Dies dient später dazu, dass der Lockscreen - wenn das iPhone im Standby ist und kurz der Power-Button gedrückt wird - etwas länger als normal angezeigt wird. Dies bietet sich an, da sonst kaum Zeit ist das Wetter zu studieren.

Nach der Paketinstallation muss das iPhone komplett neu gestartet werden (aufgrund der Winterboard Installation).

Schritt 2: Themes aktiv schalten

Im Menü des iPhones sollte es eine neue App Namens "Winterboard" geben. Innerhalb dieser App den Menüpunkt "Themes" wählen und (mindestens) die folgenden Themes aktiv schalten (Haken vor dem Text):

    • Typophone Weather
    • White Icon Labels
    • Hide Slide To Unlock

Sind die Haken gesetzt oben links auf Respring klicken. Jetzt sollte sich zum ersten Mal das Theme zeigen - aber noch nicht so schön, wie wir es haben wollen. Daher...

Schritt 3: Theme konfigurieren

... muss das Theme jetzt noch ein klein wenig angepasst werden. Diese Anpassungen werden direkt in einzelnen Dateien auf dem iPhone vorgenommen. Am einfachsten geht dies, wenn das iPhone mit dem PC verbunden ist - zusammen mit der Software iFunBox. Also iPhone mit dem USB-Kabel anschließen und iFunBox starten. In der Menüstruktur links das angeschlossene iPhone wählen und über das "Raw File System" in folgenden Ordner browsen: "/Library/Themes/Typophone Weather.theme/". Hier werden wir das Theme konfigurieren.

12 oder 24 Stunden Format für die Uhr

Innerhalb des Ordners gibt es eine "functions.js" Datei. Diese per Drag&Drop auf den PC kopieren und mit einem Editor deiner Wahl öffnen. Gleich ganz oben sollte es eine Zeile geben:

AM_PM = true

Wenn hinter dem Gleichheitszeichen ein "true" steht ist das 12 Stunden Format aktiv und zwischen den Doppelpunkten in der Uhranzeige erscheint jeweils ein kleines AM oder PM. Wird dieses "true" in ein "false" geändert, ist das 24 Stunden Zeitformat aktiv.

Wetter an die eigene Stadt anpassen

Standardmäßig ist für die Wetterauskunft natürlich nicht die eigene Stadt eingestellt, sondern ein Standardwert. Dieser muss ebenso verändert werden. Dazu wird die Datei "weather.txt" bearbeitet. Folgend ein Beispielinhalt der Datei, den wir dann entsprechend abändern:

{ "units" : "Celsius" , "places" : [ { "cityName" : "Heidenheim/Brenz, Germany" , "zip" : "GMXX1573" } ] , "lang" : "en-us", "theme":"","themeName":"default" }

Das Wort "Celsius" kann gegen "Fahrenheit" ersetzt werden, falls eine andere Einheit gewünscht ist. Zunächst muss natürlich die Stadt angepasst werden - in meinem Beispiel oben ist das "Heidenheim/Brenz, Germany". Hier einfach die eigene oder gewünschte Stadt eintragen.

Der Code "GMXX1573" ist wichtig und ist bei jeder Stadt ein anderer. Dieses muss also auch durch deinen eigenen Code ersetzt werden. Den Code kannst du im Internet herausfinden. Dazu einfach diese Webseite aufrufen:

http://xoap.weather.com/search/search?where=DEINE_STADT

Das Wort "DEINE_STADT" ersetzt du dabei einfach.... ja.... mit deiner Stadt eben. Also könnte ein Aufruf z.B. so lauten:

http://xoap.weather.com/search/search?where=Frankfurt

Als Ergebnis bekommst du dann unter anderem den Code, den du dann in die Datei einträgst.

Eigenes Hintergrundbild - anstatt schwarz

Nach der Standardinstallation ist der Hintergrund des Typophone Weather Themes einfach nur schwarz. Ziemlich langweilig, deswegen kann man mit einem kleinen Trick ein beliebiges Bild als Hintergrund nutzen. Dieses Bild kann jetzt einfach vom PC via Drag&Drop in das hoffentlich noch geöffnete iFunBox kopiert werden - in den gleichen Ordner, in den wir vorher gewechselt sind.

Damit das Bild nun auch erscheint muss noch die Datei "style.css" angepasst werden. Dazu die Datei auch herunterladen auf den PC und mit einem Editor öffnen. Innerhalb der Datei müsste zwei Mal das Wort "LockBackground.png" vorkommen. Dieses Wort ersetzt du nun mit dem Dateinamen deines Bildes - also z.B. "meinhintergrundbild.jpg". Es muss sich dabei um ein JPG oder PNG Bild handeln. Ob andere Bildformate unterstützt werden weiß ich nicht. Wenn die Datei bearbeitet ist, einfach wieder per Drag&Drop in iFunBox zurück schieben - wie die anderen bearbeiteten Dateien auch.

Dim Delay anpassen

Falls das vorher erwähnte optionale Paket "Lockscreen Dim Delay Control" mit installiert wurde kann jetzt noch in der iPhone Settings.app (Einstellungen) unter "Dim Delay" noch der Wert in Sekunden eingestellt werden. Meiner Erfahrung nach sollten es 10 oder gar 15 Sekunden sein. Nach der Installation dieses Paketes wird standardmäßig auf 15 Sekunden erhöht.

Schritt 4: Ein letzter Respring

So, das war es eigentlich auch schon. Jetzt noch ein letztes Mal einen Respring durchführen und das Theme sollte in vollem Glanz erscheinen. Respring? Was das ist? Das Springboard neu starten. Sagt dir auch nichts? Dann schalte einfach das iPhone komplett aus - 5 Sekunden den Power-Knopf gedrückt halten und den Ausschalten Slider verschieben. Dann kurz warten und wieder anschalten.

Sollte es Fragen geben, wie immer gerne in den Kommentaren stellen. Freue mich auch über Feedback :-) Ansonsten viel Spaß mit dem neuen Theme!

Apple Mac & iOSHacking
5 comments
Posted by Kai on 2012-01-25 at 2:59 am
HI du,

ich bin echt nicht fit was sowas angeht aber das hast du super beschrieben... schaut bei mir hammer hammer geil aus mit einem eigenen HD Hintergrundbild... kannst du mir sagen was ich ändern muss um nicht "UNLOCK" sondern einen anderen Text z.B. "simply shake" im slider stehen zu haben??? weil ich über den Activator mein iPhone 4S immer über schütteln aktiviere...

lieben Dank

Kai
Posted by Tobias on 2012-01-25 at 10:56 am
Hi,

Danke für das Lob. Um den Text zu ändern kannst du in Cydia mal nach iSlideText suchen. Nachdem du das Programm installiert hast kannst du doppelt auf den Slider tippen dann sollte ein Menü erscheinen wo du den Text einstellen kannst.

Viel Vergnügen,
Tobi
Posted by Kai on 2012-01-28 at 1:54 am
hi Tobi,
ich sitz grade in Afrika rum und hab nix zu tun...
nun hab ich gerade über cydia das update aufgespielt. Leider hab ich nicht gefunden wo ich mir da meine Stadt aussuchen kann, (wie im update versprochen... macht aber nix, habs wieder nach deine Anleitung gemacht und wunderbar...

nun hab ich folgende Idee:
erst mal wenn ich in die Mitte des Sperrbildschirms tippe kann ich danach zwischen dem von mir in der weather.txt datei umbenannten und dem nicht zu ändernden Athen wählen. Wie kann ich denn die zweite Stadt ändern. Wo muss ich da was ändern z.B. auf Abidjan (wo ich grade rumsitze)? Hast du da ne Idee?
Auf meinem iPhone am Home-screen ändert sich das Hintergrundbild jede Stunde... hab das in einem Thema über irgend ein html. graffl (frag mich nicht) ... besteht nicht die Möglichkeit das mit einzubauen so das sich das Hintergrund Bild auch im Lock-screen stündlich ändert? Die dateien kann ich dir mal schicken wenn du willst...

sorry für die Fragerei..

afrikanische Grüße

Kai
Posted by Kai on 2012-01-30 at 12:01 am
ok mal schnell ein update meiner Bastelei...

in der weather.txt datei befindet sich unter der ersten Stadt auch die zweite die sich genauso einstellen lässt. Danach steht irgendwas mit
"lang" : "en-us" ändert man das "en-us" in "de-de" um hat man schon mal viel erreicht. Danch öffnen wir die weather-scrip file und suchen über die Suchfunktion des Editors "en-us" und ändern auch das in "de-de" um. Beide Dateien müssen danach wieder aufs iPhone gespielt werden, die alten Daten können überschrieben werden. (ggf. vorher sichern zur Wiederherstellung). Nun sollte die Wetterinfo in Deutsch angezeigt werden.
In der function-scrip file, lassen sich sowohl die Wochentage änder als auch die Monate. Also kann da jeder reinschreiben was er will. Ich habs halt logischerweise auf Deutsch geändert.
Datei wie gewohnt über winSCP mit der Orginaldatei austauschen, respring und fertig!

nur das sich das Hintergrundbil jede Stunde ändert hab ich noch nicht hinbekommen...

-have fun-
Posted by Tobias on 2012-02-06 at 9:15 am
Hi Kai,
Danke für das Update. Sorry das mit dem Hintergrund kann ich dir leider auch nicht sagen.
Schöne Zeit noch in Afrika!

Grüße Tobi
Comment on This Post