title: 'Hello World from Acropolis!' author: alexzeitler date: 2007-09-10T22:38:00

layout: layout_article.html



In diesem Posting werde ich ein kleines "Hello World"-Beispiel mit Microsoft Acropolis erstellen.

Acropolis ist ein Set von Komponenten und Tools, die die Entwicklung von clientseitigen, modular aufgebauten Business Applikationen mit .NET und WPF deutlich erleichtern und somit beschleunigen soll. Acropolis ist der offizielle Nachfolger des SmartClient Application Blocks und integriert sich in Visual Studio 2008.

Systemvoraussetzungen

Um dieses Beispiel "nachbauen" zu können, sind folgende Downloads notwendig:

Konzept

In Acropolis wird bei der Entwicklung von Windows-Anwendungen mittels WPF der Ansatz der strikten Trennung von Code und UI verfolgt. Hierzu existieren in Acropolis zwei wesentliche Elemente:

Dieser Ansatz ermöglicht die unabhängige und parallele Entwicklung von UI (durch einen Designer) und Code (durch einen Entwickler), welche zu einem späteren Zeitpunkt wieder zur vollständigen Applikation zusammengeführt werden können.

Die Verbindung zwischen View und Part - um z.B. den Code für den Klick auf einen Button auszuführen - stellen sogenannte "Connection Points" dar. Hierbei wird unterschieden zwischen ComponentProperty, um Eigenschaften zu binden und ComponentCommand, um Methoden zu binden.

Die nachfolgende Grafik verdeutlicht die Zusammenhänge:

PartsAndViewsConnectionPointsFinal

Hello World!

Nach der Installation muß in Visual Studio 2008 ein neues Projekt vom Typ "Acropolis" / "WPF Application" erstellt werden:

NewAcropolisProject3D

Nach einem Klick auf den "OK"-Button öffnet sich der "Acropolis Application Wizard":

AcropolisWizardStep13D

Dieser kann ohne Änderungen über den "Finsih"-Button sofort beendet werden (unser Beispiel soll so einfach wie möglich bleiben ;-))

Visual Studio legt nun im aktuellen Projekt die Dateien "Application.xaml" und "Window1.xaml" an:

SolutionExplorer13D

Über einen Rechtsklick auf das Projekt "AcropolisHelloWord" im Solution-Explorer und danach auf "Add" und "New Item..." muß ein neues Item vom Typ "Acropolis Part and View (WPF) mit dem Namen "HelloWorld.xaml" hinzugefügt werden:

AddNewItemHelloWorldXAML3D

Visual Studio erzeugt nun im Solution Explorer vier neue Dateien:

In HelloWorld.xaml bzw. HelloWorld.xaml.cs befindet sich später die Logik für HelloWorldView.xaml(.cs), welches wiederum die UI definiert.

Nach einem Doppelklick auf "HelloWorldView.xaml) im Solution-Explorer wird die Datei im Designer dargestellt, welcher in die Bereiche Design und XAML unterteilt ist:

HelloWorldViewXAML3D

Im nächsten Schritt ziehen wir aus der Toolbox eine TextBox und einen Button auf unser HelloWorldView-Form:

HelloWorldViewXAMLWithControls3D

Alternativ kann auch der folgende Code zwischen die beiden -Tags kopiert werden:

Damit ist das Designen des Formulars in der HelloWorldView.xaml abgeschlossen. Nun fehlt uns noch der Code, der beim Klick auf den Button den Text der TextBox in einer MessageBox ausgibt.

Gemäß des Konzepts von Acropolis muß sich dieser Code in der HelloWorld.xaml(.cs) befinden, welche wir durch einen Doppelklick im Solution-Explorer öffnen:

HelloWorldXAML3D

Nun werden wir eine ComponentProperty, welche and die TextBox gebunden wird und ein ComponentCommand, welches an den Button-Click gebunden wird, hinzufügen.

Hierzu muß der Design-Teil der Datei HelloWorld.xaml angeklickt (bzw. aktiv) sein.

Danach erfolgt ein Doppelklick auf die ComponentProperty in der Toolbox im Abschnitt "Acropolis Framework":

ComponentPropertyToolbox3D

Nun muß noch ein Doppelklick auf "ComponentCommand" durchgeführt werden, wobei auch hier vorher sichergestellt sein muß, dass die Design-Ansicht aktiv ist:

ComponentCommandToolbox3D

Danach sollte sich die HelloWorld.xaml wie folgt im Designer präsentieren (man beachte die neuen Einträge unter "Connection Points / Properties"):

HelloWorldWith2ConnectionPoints3D

In der XAML-Ansicht muß nun der Code

durch

ersetzt werden.

CommandExecuted ist der Name der Methode, die ausgeführt werden soll, wenn das entsprechende Kommando aufgerufen wird.

Description beinhaltet die Beschreibung des Befehls, welche angezeigt wird, wenn der Befehl über ein Menü aufgerufen werden soll.

Im nächsten Schritt erstellen wir die Methode showText, welche sich in der Datei HelloWorld.xaml.cs befinden muß (wir öffnen diese über den Solution-Explorer:

SolutionExplorerHelloWorldXAMLcs3D

Die Methode showText sieht wie folgt aus:

private void showText(object sender, ComponentCommandExecutionEventArgs<OBJECT> e){
    System.Windows.MessageBox.Show(inputText.Value.ToString());
}

Dieser führt nun den Button1ClickHandler unseres Parts HelloWorld.xaml aus.

Da ein Part, so wie wir es bis hierher entwickelt haben, nicht alleine lauffähig ist, muß es zu einem Host (d.h. der Applikation, in der das Part ausgeführt wird) verbunden werden, in unserem Fall die Application.xaml.

Um das Part für Application.xaml verfügbar zu machen, muß ein Build der Solution durchgeführt werden (Rechtsklick auf die Solution im Solution Explorer -> "Build Solution").

Danach erscheint in der Toolbox bei geöffneter Application.xaml in der Sektion "User Components(Acropolis)" der Eintrag "HelloWorld":

ToolBoxHelloWorldPart3D

Nach einem Doppelklick auf diesen Eintrag erscheint eine Instanz von HelloWorld (nämlich HelloWorld1) in der Application und die ConnectionPoints werden angezeigt:

ApplicationXamlFinal3D

Wenn wir nun die Applikation starten und in der TextBox einen Text eingeben, gefolgt von einem Klick auf den Button, erscheint der eingegebene Text in einer MessageBox - that's it!

HelloWorldFromAcropolis3D

Download: AcropolisHelloWorld.zip (Verwendung auf eigene Gefahr!)