Das Päckchen gefällt in seiner brauchen Einfachheit mit einem Schutzblister innen drin. Aussser dem kindle und einem Micro-USB-Kabel findet sich dann auch wirklich wenig im Karton. Die erste Überraschung meinerseits ist allerdings dann das Entfernen der Schutzfolie – jaja. Bei den meisten Displaygeräten ist ja auch der Folie ein Schaubild im Betriebszustand aufgedruckt. Hält man den kindle in der Hand und nimmt die Schutzfolie ab, bleibt dieses Bild – hola. Durch den niedrigen Energieverbrauch und die rattenscharfe Anzeige glaubt man nicht ein elektronisches Gerät anzuschauen. Wirklich Topp.

Da keine Anleitung beiliegt, ein kleines Zettelchen wäre schon nett, wird nun erstmal meinerseits auf allen Knöpfen herumgedrückt und kurz darauf erscheint der Startbildschirm um die Geräteinitialisierung vorzunehmen. Das dauert so ca. 5 Minuten und anschliessend leitet eine Assistent durch den WLAN-Anmeldevorgang. Die Tastatur ist bei diesem Gerät leider nur simuliert und alles muss mit der Wippe lästig eingegeben werden. In Zeiten von Touchdisplays ungewohnt. Trotzdem geht auch das relativ einfach und das WLAN ist verbunden. Nun findet eine weitere Initialisierung statt und nach gefühlten 2 Minuten Bäumchengucken ist mein Kindle einsatzbereit und ich kann sofort im Kindle-Shop einkaufen, da Amazon das Gerät mit meinen Zugangsdaten von Amazon befüllt hat. Jetzt interressiert allerdings die Art wie amazon das Gerät mit meinem Account verknüpft hat. Aber das finde ich in den nächsten Tagen noch heraus.
Dann gibt es auch bei Bedarf mehr zu kindle.

Die folgenden Anleitungen wurden unter Mac OSX (Snow Leopard, Lion) erstellt und ich würde jedem raten, zur Entwicklung auch einen Mac zu nutzen, da ein Test mit iOS-Geräten nur so möglich ist und anderseits der Android Emulator bei jedem Start quälend langsam alles compiliert und das so einfach keinen Spass macht. Im schlimmsten Fall läuft Titanium aber dank Aptana->Eclipse->Java auch unter Windows.

Basisobjekte von Titanium UI

Mobile Entwicklung mit Titanium enthält im Normalfall die folgenden Instanzen

• Tabgroups
• Tabs
• Windows
• Views

Tabgroups und Tabs sind nicht zwangsläufig notwendig. Um irgendetwas darzustellen, ist aber mindestens ein Window und ein damit verbundener View notwendig.

Ein View ist in hier ein normaler (nativer) View oder ein so genannter Webview. Bei einem Webview wird innerhalb der Anwendung  der Browser des Endgeräts geöffnet und dort die Webseite angezeigt. In Verbindung mit einer mobilen Framework wie z.B. jquery-mobile lassen sich so relativ schnell Apps erstellen, die aber im einfachsten Fall  nur mit Appicons verknüpfte Webseiten sind. Titanium bietet aber die Möglichkeit, App interativ zu entwickeln. Es wird mit einer simplen Webview-Anwendung gestartet und im Anschluss mit nativen Elementen aufgehübscht, mit mobilen Seiten erweitert und bei ausreichend Durchhaltevermögen steht eine native Anwendung und nebenbei wurde vielleicht noch eine mobile html-Version erstellt.

Nun aber ein einfacher Quickstart, um eine Webseite einzupacken, mit einem Icon und Startbildschirm zu versehe

Erstes Projekt anlegen

• Titanium starten
• Ein neues mobiles Titanium Projekt erstellen: File -> New -> Titanium Mobile Projekt
• Innerhalb der Dialogbox nun nett alles eintragen und vor allem auf die App Id achten. Diese ist wichtig für das spätere Deployment im AppStore. Die Daten aus diesem dialog können später allerdings auch im Nachhinein geändert werden, falls ein Eintrag nicht stimmt. Als Deployment Targets nehmen wir das volle Programm inkl. Android, denn sonst könnte wir das ganze ja direkt mit Objektive C programmieren, welches wir ja alle beherrschen, gell?
• Im kommenden Dialogfenster wählen wir nun aber kein Projekttemplate aus denn wir wollen ja eine einfachen sicheren Start hinlegen.  Finish ist hier unser Freund und im Anschluss hat titanium uns
• Ein “nicht leeres” Projekt angelegt mit 2 Tabs und 2 nativen Views, die innerhalb von 2 windows dargestellt werden.

App im Simulator testen

Wir können nun prüfen, ob unsere Entwicklungsumgebung schon mal läuft. Hierzu einfach erstmal den iphone Simulator starten. Nun übersetzt Titanium unseren Code erst in Objektive C und deployed eine kompilierte Version auf dem Simulator.

In der Console lassen sich nun die ganzen Debug-Meldungen und evtl. Fehler verfolgen. Sehr praktisch ist die Console auch um über den Simulator zu debuggen. Mittels z.B. Ti.API.debug lassen sich touch events oder eventListener auswerten. Fehler werden hier in roter Schrift angezeigt und führen im schlimmsten Fall zum Abbruch der Simulation. Titanium schickt in der Standardkonfiguration Trackingdaten, was bei meiner Firewall gesperrt ist und somit als Fehler deklariert wird. Der Simulator läuft aber denoch einwandfrei.

Verzeichnisstruktur

Innerhalb von Titanium haben wir nun ein root-Verzeichnis und darin die Projekteinstellungen. Der Klick auf tiapp.xml öffnet das Dialogfenster welches wir bei der Erstellung des Projekts angelegt haben. Der Ressources Ordner ist allerdings der “Place to Be”.

Hier finden sich die folgenden Elemente:

Alles auf Null

Wir wollen die Basisbefüllung erst einmal vergessen und machen wir geplant einen doofen Webview ohne Tabs, Titel oder sonstigen Kladeradatsch. Also mutig voran, auf in die app.js und den gesamten Inhalt erst mal löschen.

Als erstes brauchen wir jetzt einen view, um die Website anzuzeigen. Also erzeugen wir eine Webview-Instanz

var viewWeb = Ti.UI.createWebView({url:'http://blog.wolfgang-burger.de'};

Nun noch eine Window-Instanz erzeugen und ein Child an die Instanz anhängen. windowWeb.open() öffnet das Fenster dann.

var windowWeb = Titanium.UI.createWindow();
windowWeb.add(viewWeb);
windowWeb.open();

Beim Tippen im Editor versucht Titanium Code zu vervollständigen, was ebenso wie die CodeHints sehr nützlich ist. Jetzt starten wir allerdings unsere App und nach kurzer Zeit erscheint die angegebene URL in unserem Simulator.

Optik

Um unsere App nun rund aussehen zu lassen, wäre ein eigenes App-Icon und ein Startbildschirm toll. Da dies von den Endgeräten abhängig ist müssen wir zur Anpassung in  den entsprechenden Ordner. Unser App-Icon befindet sich unter iphone und heisst treffenderweise appicon.png. Einfach mit einem png-Bild in der Auflösung 75×75 Pixel in 72 dpi ersetzen und fertich!

Das gleiche gilt für den Startbilschirm (Splashscreen). Hier werden für die unterschiedlichen Auflösungen entsprechende bilder benötigt:

• iphone
• iphone Retina
• ipad
• ipad-Landscape-Modus

Finish

So jetzt ist die App erstmal deploybar. Noch nicht grosses, aber wenn nun ein Kunde so etwas für wenig Geld erstmal haben will – gut so.

Für uns ist das allerdings erst der Einstieg in die Entwicklung in Titanium und um und im nächsten Teil werde ich wohl einen nativen View bauen und en paar Tabs einbauen.

Zum Schluss…

muss noch erwähnt werden, dass Appcelerator die Verwendung von webviews nicht empfiehlt und es nicht garantiert ist dass eine solche App durch den Apple Genehmigungsprozess kommt. Aber das ist ja nur ein Start und am Ende machen wir dann hoffentlich alle glücklich!

Quellen:

• Q&A zu Titanium von Appcelerator 
• Titanium API-Referenz

Die Einrichtung geht relativ einfach vonstatten:

• aktuelle sdk für Titanium herunterladen ->
  http://builds.appcelerator.com.s3.amazonaws.com/RC/mobilesdk-1.7.0.RC1-osx.zip
• Damit die sdk von titanium erkannt wird, muss das zip an die richtige Stelle entpackt werden. Unter OSX wäre das
  /Library/Application\ Support/Titanium/mobilesdk/osx
  Hier liegt jetzt das Vezeichnis 1.7.0.RC1Dabei fand mein titanium die Datei nicht, wenn das sdk im Userspace lag. Als das sdk im system-Library lag war alles OK.
• Nun titanium neu starten und
  Help->Aptana->Run Diagnostic Test
  sollte jetzt folgenden Eintrag enthalten:
  Titanium Mobile SDK Version: 1.7.0
• Help->Aptana->check for Titanium SDK Update ausführen und auf die neueste sdk-Version updaten

Leider gab es bei mir beim update eine jav null.pointer exception. Ich habe zur Fehlerbehebung folgende Dateien gelöscht und danach lief das Update einwandfrei:

sudo rm ~/Library/Java/Extensions/log4j-1.2.13.jar

sudo rm /Library/Java/Extensions/log4j-1.2.13.jar

Quellen:

Möglichkeiten über Ti.Api zu debuggen:

http://developer.appcelerator.com/apidoc/mobile/1.7.1/Titanium.API-module

Links:

Anleitung und Demovideo

http://developer.appcelerator.com/blog/2011/04/titanium-studio-1-0-preview-with-titanium-mobile-debugging.html

Android SDk installieren
sdk hier herunterladen:
http://developer.android.com/sdk/index.html

Der Fehler war allerdings in der http.conf schnell gefunden. Apple hat den Apache nämlich in einer neuen Version beglückt. Dummerweise müssen jetzt noch die virtualhosts inkludiert werden und php aktivert werden.

Hier nun meine Anleitung die dem Einen oder Anderen vielleicht helfen kann.

cd /etc/apache2
sudo mv httpd.conf httpd.conf.backup
sudo mv httpd.conf.default httpd.conf

Jetzt innerhalb der http.conf folgenden Code hinzufügen zur Aktivierung von php in Zeile 110 das php-Modul wieder aktivieren:
LoadModule php5_module libexec/apache2/libphp5.so

Falls nun noch die virtual hosts aktiviert warden müssen, ans Ende folgende Zeilen hängen:
Include /private/etc/apache2/other/*.conf
NameVirtualHost *:80
Include /private/etc/apache2/virtualhosts

Jetzt noch den Apache neu starten
sudo apachectl graceful

Im Anschluss läuft dann ein Apache/2.2.19 (Unix) DAV/2 PHP/5.3.6 with Suhosin-Patch.

Quellen: Apple Diskussionsforum

Hilfreich bei der Einrichtung waren:

Trikks

Myanmar = Burma = Birma

Yangun = Yangon = Rangun

Pagan = Bagan = Nyang U (Flughafen)

To be continued

Die Reiseplanung ist bis auf Kleinigkeiten auf kukunu.com einzusehen: Myanmar Roundtrip

Mal schauen, ob uns Michael Pfeiffer von fascinating land Travels noch das eine oder andere Hotelschnäppchen rausschlagen kann,

Unser Veranstalter Michael Weber maß den Trip mit Schrittzähler und kam auf eine Distanz von knapp 20km. Das fühlte sich allerdings weder so an, noch entsprach das der wirklichen Entfernung. Spass hat’s trotzdem gebracht.

Für das  Layout habe ich mir ein freies Template namens Typbased von WooThemes genommen und hoffe das gefällt meinen Lesern genauso gut wie mir. Was mir bei dem Template leider nicht gefällt, ist die Anzeige der Detailseiten. Überall wird der rechte Block angezeigt und macht den Inhaltsbereich leider zu klein. Als WordPress-Änfänger habe ich also die Anzeige einer Detail(Single)-Seite mit der css-Klasse single versehen und dann mittlels css die mittlere Spalte etwas groesser und die rechte komplett ausgeblendet. Sicher nicht die tollste Lösung aber so auf die Schnelle reciht mir das erst mal. Das ist ja schliesslich keine High-Traffic-Page und im Moment mag ich noch nicht in die Tiefen von WordPress eindringen. Dem kritischen Besucher wird noch auffallen, dass die Hintergrundgrafik über dem Seitentitel noch nicht 100% passt, aber auch dem werde ich in Kürze nachkommen.

Wichtiger schien mir erstmal zu sehen, wie gut die Rückmeldung auf mein Blog sind. Dazu habe ich als Trackingsoftware natürlich google Analytics benutzt, sowie für Realtimeanalyse den Dienst Woopra.

Verknüpft habe ich ansonsten noch Qype.

Macports installieren

Im Terminal folgendes eingeben

 sudo port list #holt sich einen Liste der verfügbaren pakete
 sudo port install mysql5
 sudo port install mysql5-server
 sudo/opt/local/share/mysql5/mysql/mysql.server start
 sudo -u _mysql mysql_install_db5 [Testtabellen installieren]
 /opt/local/lib/mysql5/bin/mysql_secure_installation

Den socket an die richtige Stelle konfigurieren

Eigentlich sollte das jetzt funktionieren, aber leider fand meine Installation jetzt nicht den Socket an der richtigen Stellen und weigerte sich den Befehl abzuschliessen:
“Can’t connect to local MySQL server through socket ‘/opt/local/var/run/mysql5/mysqld.sock’ “

find / -n zeigte mir dann, dass der Socket unter /private/var/mysql/mysql.sock zu finden ist. Da gehört er aber nicht hin und wir müssen noch etwas umbiegen:

sudo touch /opt/local/var/run/mysql5/mysqld.sock
sudo nano /opt/local/etc/mysql5/my.cnf

in die Datei folgenden Text einfügen:

 [mysqld_safe]socket = /opt/local/var/run/mysql5/mysqld.sock
 [client]socket =/opt/local/var/run/mysql5/mysqld.sock

Server neustarten

Jetzt den mysql-Server neu starten und alles wird gut:

sudo /opt/local/share/mysql5/mysql/mysql.server start