Wie kann ich mit WPF Daten dreidimensional visualisieren?

Voraussetzungen:

Plattform

.NET Framework 3.5 SP1

Sprachen

XAML, C#

Werkzeuge

Visual C# 2008, Expression Blend 2.0 (optional), Expression Design (optional)

Zu bearbeitende Projekte

Microsoft.WPF.Samples.BizCardFlow

Einleitung:

Die Windows Presentation Foundation bietet viele Möglichkeiten, mit dreidimensionalen Objekten zu arbeiten. Hierfür müssen allerdings zunächst die folgenden Voraussetzungen geschaffen werden:

Erstellen einer 3D-Szene:

Zum Erstellen einer 3D-Szene wird ein Viewport3D zusammen mit den folgenden Komponenten verwendet:

• Eine Kamera wird mit einer PerspectiveCamera erstellt. Die Kamera gibt an, welcher Teil der 3D-Szene angezeigt werden kann.
• Ein Material, das auf der Oberfläche des Objekts angezeigt wird, wird mit der Material-Eigenschaft vom GeometryModel3D als DiffuseMaterial angegeben. (Wird in der Code-Behind-Datei von CoverFlowList.xaml.cs gesetzt.)
• Ein Licht, das auf dem Objekt leuchtet, wird mit AmbientLight erstellt.
• Ein ContainerUIElement3D, welches unsere BizCardFlow-Elemente „gesichtslos“ verwaltet. „Gesichtslos“ bedeutet hier, dass ContainerUIElement3D keine visuelle Repräsentation bereitstellt, sondern lediglich Child-Elemente akzeptiert, die eine visuelle Repräsentation haben.
• ModelUIElement3D (in CoverFlowList.xaml.cs) implementiert die BizCards mit einem front- und backTemplate, damit das ContainerUIElement3D eine visuelle Repräsentation erhält.
• Die Form des 3D-Objekts wird vom GeometryModel3D als MeshGeometry3D erstellt. (In unserem Beispiel entweder mit oder ohne Spiegel-Effekt abhängig von der Leistung des Systems.)

Die 3D-Szene können Sie in der CoverFlowList.xaml und CoverFlowList.xaml.cs einsehen und editieren.

Datenübergabe an BizCardFlow

BizCardFlow besitzt zwei DataTemplates für die Visualisierung unserer Personendaten. Ein Front- und ein Back-Template, welche die Personendaten an BizCardFlow bindet. Diese beiden Templates werden von BizCardFlow benötigt, um das „gesichtslose“ ContainerUIElement3D, mit Leben zu füllen. Event-Handler und Animationen werden bereits eigenständig von ModelUIElement3D verwaltet. Wenn Sie also das Erscheinungsbild oder die Daten der Visitenkarten verändern möchten, müssen Sie lediglich die beiden Data Templates bearbeiten. Öffnen Sie hierfür die Datei ResourceDictionary.xaml und suchen Sie die beiden Data Templates mit den Namen: „FrontTemplate“ und „BackTemplate“.

Abbildung 1: Bearbeiten des FrontTemplate mit Expression Blend 2

Alle grafischen Elemente im BizCardFlow wurden in XAML definiert und können mit Microsoft Expression Design bearbeitet werden.

Verändern der Proportionen der Visitenkarte

Da es sich bei den Visitenkarten um dreidimensionale Objekte handelt, reicht es nicht, im Data Template die Höhe und Breite zu verändern, da diese von dem MeshGeometry3D überschrieben werden. Wenn Sie also beispielsweise Visitenkarten im quadratischen Format visualisieren möchten, müssen Sie die Datei CoverFlowList.xaml editieren und eine neue MeshGeometry3D an BizCardFlow übergeben.