1. Tutorial “Create Flex Mobile Project ‘Hello World’”

Bereits im letzten Blogeintrag habe ich eine kleinen Einblick in die neue Generation der Mobilen Anwendungsentwicklung mit Adobe Flash Builder 4.5 gegeben.

In diesem Beitrag möchte Ihnen anhand eines Tutorials aufzeigen, wie einfach es ist ein Projekt anzulegen und die erste Anwendung zu bauen.

Let’s start!

  1. Laden Sie sich die 60-Tage-Testversion von Adobe Flash Builder 4.5 herunter. Beachten Sie hierbei die Systemvoraussetzungen! Für den Download benötigen Sie ein Adobe Account, den Sie kostenfrei unter Adobe anlegen können!
  2. Nach der erfolgreichen Installationen können wir bereits den Flash Builder 4.5 öffnen.
  3. Im nächsten Schritt wird der Flex Mobile Project-Dialog über das Menu File->New->Flex Mobile Project aufgerufen.
  4. Unter dem „Project name“ kann der Name des Projektes festegelegt werden.
  5. Anschließend wird unter Mobile Settings das Application Template ausgewählt.
    Nachdem das View Based Application Template selektiert wurde, kann das Projekt bereits
    über den Button Finish angelegt werden.
  6. Wählen Sie im Anschluss den View HelloWorldAppHomeView aus.
  7. Im Flash Builder gibt es zwei Ansichten- die Quelltext- und die Design-Ansicht.
    Initial wird die Quelltext-Ansicht geladen. Zum Wechseln in die Design-Ansicht muss
    einfach der Button Design gedrückt werden.
  8. In der Design – Ansicht kann die Oberfläche der Applikation bereits betrachtet werden.
  9. Damit die Anwendung auch später für das passende Endgeräte entwickelt werden kann, liefert der Flash Builder
    bereits Vorlagen mit den entsprechende Abmaßen mit.

    Als Device wird Google Nexus One selektiert.

  10. Damit der Hello World – Text auch angezeigt werden kann, wird die Label-Component ausgewählt.
  11. Per Drag&Drop wird die Component in das View gezogen.
  12. Unter den Label – Properties kann der Text „Hello World“ in die Text Property geschrieben werden.
  13. Abschließend wird die Anwendung getestet!
  14. Da die Anwendung das 1. Mal gestartet wird, muss einmalig für das Projekt die Ausgabe definiert werden.
    Als Launch Method wird On desktop und das Device Google Nexus One gewählt.
  15. Danach wird die Einstellung über den Button Apply bestätigt und über den Button Run die Anwendung ausgeführt!
  16. Voilà, das fertige Ergebnis!

Im zweiten Teil der Tutorial – Serie werde ich näher auf das Thema Datenanbindung eingehen.

Getagged mit: , , , , , , , , , , ,

Schreibe einen Kommentar

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

*

*