Mittwoch, 24. Februar 2010

OinkiDoinki - Fang das Ziel durch Kippen und Neigen!


Kommen wir im dritten Teil der Serie über meine J2ME-Anwendungen zu meinem absoluten Liebling: OinkiDoinki ist ein Handyspiel, bei dem es darum geht, durch Kippen und Neigen das kleine Quadrat mit der Kugel zu treffen. Ist das gelungen, so taucht es an einer anderen Stelle wieder auf.
Features:
  • Durch Kippen und Neigen des Handys wird die Kugel bewegt!
  • Durch Drücken der Stern-Taste (*) können beliebig viele Kugeln hinzugefügt werden und auf der Raute-Taste (#) wieder stückweise gelöscht werden. Die Kugeln stoßen sich (näherungsweise) physikalisch korrekt ab.
  • Das Ziel-Kästchen kann auf 5 ausgeblendet werden.
  • Auf 0 werden die Vibration, die bei vielen Kugeln recht störend seien können, ansonsten aber wirklich klasse sind, deaktiviert werden.
  • Durch Schütteln ändert sich die Hintergrundfarbe, wobei das Quadrat die Komplementärfarbe des Hintergrunds annimmt.
  • Geheimtipp: Im Dunklen sieht eine oft wiederholte auf-und-ab-Bewegung ziemlich cool aus - fast wie ein Regenbogen ;-)

Obwohl mich das Spiel viel Zeit und Nerven gekostet hat (vor allem die Stöße von mehreren Kugeln), bin ich im Nachhinein froh diese investiert zu haben und bin richtig stolz darauf :-).


Da auch bei diesem Spiel wieder auf den Beschleunigungssensor des Handys zugegriffen wird, ist ein solcher zwingend erforderlich. Ebenfalls obligatorisch ist die Java-Platform 8 und speziell die Unterstützung des JSR 256 (Mobile Sensor API). Getestet wurde es mit einem der ersten Sony Ericsson Handys, das diese Bedingungen erfüllt, dem K850i. Außerdem getestet auf dem W980 und C902, mit neueren Geräten sollte es keine Probleme geben.
Wenn euer Handy diese Anforderungen erfüllt, könnt ihr euch die Spiel hier herunterladen und über Bluetooth oder USB auf das Gerät laden. Viel Spaß damit!

Bei Interesse veröffentliche ich auch gerne Ausschnitte des Java-Quellcodes.

Kleine Anmerkung noch zum Schluss: Um eines klarzustellen - ich habe das Spiel vor ca. 2 Jahren geschrieben, also noch bevor das Bedienkonzept Schütteln, Neigen, Kippen auf dem iPhone umgesetzt wurde... ich hätte es früher veröffentlichen sollen :-(
:D

Gravitation - Wo ist "unten"?


Im zweiten Teil der Serie über meine J2ME-Anwendungen will ich euch Gravitation vorstellen. Dieses Programm zeigt euch mit einem schlichten Pfeil wo unten ist - egal wie ihr das Handy haltet, der Pfeil zeigt stets nach unten. Auf Wunsch (Klick auf 0) kann zusätzlich die Erdbeschleunigung in m/s^2 oben eingeblendet werden.
Wie schon das vorherigen Teil wird dazu auf den im Handy integrierten Beschleunigungssensor zugegriffen und aus den Werten, die dieser liefert, ein Winkel berechnet, um den der Pfeil gedreht wird. Der Pfeil wird durch eine Vektorgrafik (SVG) dargestellt und mithilfe eine Rotationsmatrix gedreht. Fragen über die genaue Funktionsweise können in den Kommentaren gestellt werden.
Dieses Video demonstriert die Verwendung von Gravitation:


Das Programm funktioniert logischerweise nur auf Handys mit Beschleunigungssensor (heutzutage sind die meisten damit ausgerüstet), auf denen mindestens die Java-Plattform 8 läuft. Speziell das JSR 256 (Mobile Sensor API) muss unterstützt werden. Getestet wurde es mit einem der ersten Sony Ericsson Handys, das diese Bedingungen erfüllt, dem K850i. Außerdem getestet auf dem W980 und C902, mit neueren Geräten sollte es keine Probleme geben.
Wenn euer Handy diese Anforderungen erfüllt, könnt ihr euch die Anwendung hier herunterladen und über Bluetooth oder USB auf das Gerät laden. Viel Spaß damit!

Bei Interesse veröffentliche ich auch gerne Ausschnitte des Java-Quellcodes.

Accelerometer - Beschleunigungsmesser für Handys


Das ist der erste Teil einer fünfteiligen Serie, in der ich euch meine J2ME-Anwendungen für Handys (speziell Sony Ericsson Geräte) vorstellen werde.
Nachdem ich festgestellt hatte, das mein altes Handy (ein Sony Ericsson K850i) Bilder automatisch dreht, wenn ich das Gerät kippe, fragte ich mich wie das genau funktioniert und habe durch Internetrecherche erfahren, dass darin ein Beschleunigungssensor verbaut ist. Dieser liefert Beschleunigungswerte in x-, y-, und z-Richtung, die über eine Java-API (JSR256) ausgelesen werden können. Also fing ich an meine erste J2ME-Anwendung zuschreiben, die zugleich meine erste Java-Anwendung überhaupt war.
Dabei entstand der Accelerometer, ein Beschleunigungsmesser für Handys, der die x-, und y-Komponente der auf das Gerät wirkende Beschleunigung in einem Polarkoordinatensystem darstellt. Oben links werden zusätzlich die Werte in m/s^2 angeeigt. Damit ist es z.B. möglich die Beschleunigung beim Autofahren, beim Start im Flugzeug oder die Erbeschleunigung (in unseren Breiten ca. 9,81 m/s^2) zu messen.
Für die Entwicklung habe ich das Sony Ericsson SDK und die Mobility-Version von Netbeans verwendet.
Hier ist noch eine kurze Video-Demonstration des Accelerometers:

Das Programm funktioniert logischerweise nur auf Handys mit Beschleunigungssensor (heutzutage sind die meisten damit ausgerüstet), auf denen mindestens die Java-Plattform 8 läuft. Speziell das JSR 256 (Mobile Sensor API) muss unterstützt werden. Getestet wurde es mit einem der ersten Sony Ericsson Handys, das diese Bedingungen erfüllt, dem K850i. Außerdem getestet auf dem W980 und C902, mit neueren Geräten sollte es keine Probleme geben.
Wenn euer Handy diese Anforderungen erfüllt, könnt ihr euch die Anwendung hier herunterladen und über Bluetooth oder USB auf das Gerät laden. Viel Spaß damit!

Bei Interesse veröffentliche ich auch gerne Ausschnitte des Java-Quellcodes.

Dienstag, 23. Februar 2010

I Am Rich als iPhone WebApp [Update: Jetzt auch offline verfügbar!]

So, mal wieder was für Angeber - also so ziemlich alle iPhone-Besitzer (wie Bilder wie dieses bestätigen - gut...ich geb's zu, meins ist auch dabei ;-)): Die iPhone-App I Am Rich, der sogar ein Wikipedia-Artikel gewidmet wurde, hat im Prinzip keine Funktion außer anzugeben und war für einen Tag für erschwingliche $999 im App Store zu haben. Natürlich um anzugeben und vor allem um einen guten Freund und selbst ernannten iPhone-Profi etwas vorzuführen, habe ich dazu ein Webapp-Pendant erstellt und veröffentliche es nun hier.
Wer auch so cool sein will wie ich, kann mit seinem Safari auf dem iPhone auf folgende Seite navigieren: http://dev.ubbel.de/iphone/webapp/iamrich. Das sieht dann zunächst ziemlich langweilig aus - um den Effekt, wie auf dem Screenshot rechts gezeigt, zu erzielen, muss man im Safari in der unteren Leiste auf das kleine Plus (+) klicken und die Option "Zum Home-Bildschirm hinzufügen" wählen. Daraufhin wird auf dem Homescreen ein Symbol mit dem Titel "I Am Rich!" abgelegt, dass genauso aussieht wie eine richtige App. Öffnet man diese Webapp startet Safari, jedoch ohne die obere Adressleiste und die Optionsleiste unten, und man erhält das Ergebnis, wie auf dem Screenshot rechts gezeigt.

Für Ober-Angeber habe ich noch die Funktion eingebaut, seinen eigenen Namen anzeigen zu lassen. Und zwar geht das ganz einfach über die URL: http://dev.ubbel.de/iphone/webapp/iamrich/?name=nicky. Also einfach das hinter "?name=" (hier: "nicky") durch euren Namen ersetzen und ihr werdet ruck zuck die coolsten in der Schule sein.
Viel Spaß damit!

Update: Die "I Am Rich!"-WebApp ist jetzt auch offline verfügbar! Für alle, die die App bereits installiert haben, empfiehlt es sich sie nochmal vom iPhone zu löschen und genau wie oben beschrieben ein neues "I Am Rich!"-Icon auf dem Homescreen abzulegen, denn nur so sind die Offline-Funktionalitäten gewährleistet. An dem "Installationsprozess" hat sich nichts geändert.
Besonders praktisch ist diese Neuerung für iPod Touch-Besitzer oder um die Mädels im Ausland zu beeindrucken ;-).

Montag, 22. Februar 2010

Buchstabensalat mit Php-Script lösen

Jeder kennt diese kleinen Rätsel, bei denen man eine ungeordnete Zeichenkette (z.B. pleaf) durch Umstellung der Buchstaben (Permutation) in ein sinnvolles, meist recht einfaches Wort (apfel) umwandeln soll. Um bei 9Live richtig abzusahnen, habe ich mir ein kleines Php-Script geschrieben, dass einen einfachen Permutations-Algorithmus implementiert und alle möglichen Buchstabenkombinationen an Google sendet und sie nach der Anzahl der Suchtreffer zu sortieren.
Der Algorithmus geht rekursiv vor:
Angenommen die Zeichenmenge ($pool) sei [a; b; c; d], dann nimmt er sich zuerst das erste Element (hier a) und "hält es fest" ($hold). Dann geht er eine Ebene tiefer und hält das nächte Element fest (hier b), festgehalten wird jetzt also a und b, die Restzeichenmenge ist [c; d]. Sind nur noch zwei Elemente in der Restzeichenmenge (wie hier c und d) werden diese einmal in der normalen Reihenfolge (cd) und einmal in der umgekehrten Reihenfolge (dc) zur Ergebnismenge hinzugefügt, zuvor werden jedoch die festgehaltenen Elemente (ab) vorne angehängt, sodass die Ergebnismenge folgendermaßen aussieht: [abcd, abdc].
Ist eine solche Reihe abgeschlossen springt es zur nächsten und hält dann zunächst b, dann a fest und hängt den Rest wie oben beschrieben an.
Für größere Tiefen, d.h. eine größere Zeichenmenge verläuft das ganze analog, nur dass dann 3 Elemente (z.B. abc) "festgehalten" werden.
Hier ein Ausschnitt des relevaten Code-Teils:
/**
* Permutation (rekursiv)
*
* @author Dominique d'Argent (nicky.nubbel@googlemail.com)
* @param $pool Zeichenmenge, entweder direkt als Array oder als String
* @param $sep   Seperator, um die als String übergebene Zeichenmenge aufzuteilen
* @returns array: Alle möglichen Kombinationen der Zeichenmenge
*/

function permutation($pool, $sep = '', $hold = array()) {
  // pool-Parameter in ein Array umwandeln
  if (!is_array($pool)) {
    if (is_string($pool)) {
      $pool = $sep ? explode($sep, $pool) : str_split($pool);
    }
    else {
      $pool = (array)$pool;
    }
  }
  // wenn nur noch zwei Elemente übrig sind, z.b. a und b, diese einmal in normaler und 
  // einmal in umgekehrter Reihenfolge zurückgeben: [ab, ba]
  if (count($pool) == 2) {
    return array(implode($sep, array_merge($hold, $pool)), // normale Reihenfolge: ab
                 implode($sep, array_merge($hold, array_reverse($pool)))); // umgekehrte Reihenfolge: ba
  }
  else {
    $res = array();
    foreach ($pool as $key => $value) {
      $new_pool = $pool;
      array_splice($new_pool, $key, 1); // das Element mit dem Index $key aus dem Array löschen
      
      $new_hold = array_merge($hold, array($value)); // den Wert des Elements mit dem Indey $key "festhalten"
      
      $res = array_merge($res, permutation($new_pool, $sep, $new_hold)); // mit der übrigen Zeichenmenge das selbe machen, bis nur noch 2 Elemente übrig sind (s.o.)
    }
    return $res;
  }
}

Eigentlich ganz einfach oder? :-)

Hier noch die Online-Demo: http://dev.ubbel.de/php/permutation/ - die Ergebnisse werden nach der Anzahl der Googletreffer sortiert.
Eigene Zeichenmengen können über die URL übergeben werden, z.B. http://dev.ubbel.de/php/permutation/?pool=nicky - leider ist der Server schon bei recht wenigen Elementen überfordert bzw. braucht sehr lange :-(

Der vollständige Quelltext (live und in Farbe) ist hier zu finden: http://dev.ubbel.de/php/permutation/permutation.phps

Präsentation über LEGO Mindstorms NXT

Da ich auch immer viele Informationen aus dem Internet beziehe, dachte ich mir, gebe ich ihm mal etwas zurück. Deshalb veröffentliche ich hier meine Präsentation über NXT-Roboter. Sie beinhaltet sowohl Aspekte der Hardware als auch der Software (speziell Programmierung mit NXT-G) und gibt abschließend noch einige Informationen, Erfahrung und Kritik an der First LEGO League.
Online-Demo: http://docs.ubbel.de/presentations/nxt
Die Präsentation basiert auf einem Html-Grundgerüst, dass ich optisch und interaktiv mit jQuery UI und Css aufgewertet habe, was mir glaube ich auch ganz gut gelungen ist. Der Folienwechsel geschieht nach einem Klick in der Navigationsleiste links über einen asynchronen XMLHttpRequest (AJAX), dass heißt es wird nicht die ganze Seite neu geladen, sondern nur der Content-Bereich in der Mitte. Die Seite ist optimiert für Google Chrome 4+ und einer Auflösung von 1280x800px, andere Kombinationen sind natürlich auch gut möglich. Leider habe ich festgestellt, dass das Layout auf unserem Beamer in der Schule durch die Bilder etwas verzerrt wurde.

Ihr könnt die Präsentation hier herunterladen. Viel Spaß damit!

Sonntag, 21. Februar 2010

Gehirntrainer mit GWT

Dieses "Gehirntrainer"-Projekt habe ich vor einigen Jahren angefangen und - wie viele meiner Projekte - nie fertiggestellt...
Drei Disziplinen habe ich immerhin geschafft:

  1. 20 simple, arithmetische Kopfrechenaufgaben lösen, wobei die richtigen Ergebnisse und die Zeitgemessen werden.

  2. Zählen wie viele Leute nach einiger Zeit in einem Haus sind, nachdem zuvor unterschiedlich viele Leute in das Haus bzw. aus diesem heraus gerannt sind. Meine Lieblingsdisziplin :-)

  3. Ein einfacher Reaktionstest: Man muss die grünen Quadrate mit der Maus berühren und am Ende wird die Zeit angezeigt.


Das Programm wurde in Java geschrieben und mithilfe des Google Web Toolkits (GWT) in eine Rich Internet Application (RIA), also im Prinzip in HTML + Javascript-Code, umgewandelt.

Eine Online-Demo ist hier einzusehen: http://dev.ubbel.de/gwt/gehirntrainer/Gehirntrainer.html
Auf Wunsch stelle ich den Java-Quelltext natürlich auch zum Download bereit.


UPDATE: Leider habe ich gerade festgestellt, dass meine Lieblingsdisziplin online nicht funktioniert :-(. Wer dennoch damit spielen will, kann sich die ganze Anwendung hier herunterladen.

NXT folgt Linie mithilfe zweier Lichtsensoren

So, jetzt will ich Euch mal ein kleines NXT-G-Programm vorstellen, dass den Roboter auf einer schwarzen Linie im Kreis fahren lässt. Im Roboter sind zwei Lichtsensoren verbaut - einer hängt knapp links von der Linie und einer entsprechend rechts daneben. Die Sensorwerte im Bereich von 0 bis 100 werden ausgelesen und anschließend voneinander subtrahiert. Diese Differenz im Bereich von -100 bis 100 geht dann in die Lenkung und in die Leistung der Motoren mit ein und sorgt für eine (zumindest theoretisch) weiche Kurvenbahn.
Hier noch eine kurze Demonstration:


Das verwendete NXT-G-Programm steht hier zum Download bereit.

Quadratische Gleichungen lösen mit jQuery

Diese kleine jQuery-Anwendung habe ich mal zum Angeben im Informatikunterricht erstellt ;-). Das eigentliche Programm ist recht simpel und eigentlich nicht erwähnenswert. Es behandelt alle Fälle, die bei einer quadratischen Gleichung auftreten können und liefert die entsprechende Lösungsmenge. Mit jQuery und einigen schönen Effekten habe ich das schlichte Programm etwas aufgewertet. Ebenfalls sehenswert sind die automatisch ablaufenden Tests, die alle o.g. Fälle abdecken.

Erster Test [UPDATE]

So, das ist mein erster Post.

UPDATE: Falls sich jemand fragt, wozu dieser Blog ist... na ja, ich glaube im Wesentlichen dient er mir als Referenzen-Sammlung. Ich habe schon so viel Zeit in die Programmierung von teilweise ernsthaften Anwendungen, oft aber auch nur Spielereien, gesteckt und habe aber nach den vielen Jahren so gut wie nichts vorzuweisen. Deshalb benutze ich jetzt hier diesen Blog, um meine Arbeiten zu sammeln :-)


Technorati claim token: AKTTW5HC4GUP