WPF: Viele bunte Smart Clients

Transkript

1 ITMAGAZINE WPF: Viele bunte Smart Clients 18. August Mit dem Windows Presentation Framework (WPF) führt Microsoft im Rahmen von.net 3.0 ein neues Programmiermodell für die Konzeption von grafisch ansprechenden Benutzeroberflächen ein. Geplant war es, die Windows Presentation Foundation (früherer Codename: «Avalon») sowie das gesamte.net Framework 3.0 (bislang WinFX) nur mit Windows Vista auszuliefern. Auf Drängen der Entwickler wurden dann aber auch Versionen für Windows XP und Windows 2003 bereitgestellt, so dass nun eine grössere Kundengruppe in den Genuss von eindrucksvolleren Benutzeroberflächen kommt. Und genau das ist das Ziel dieses Framework. Als eine der vier neuen Technologien des.net Framework 3.0 bietet die WPF neue leistungsfähige Möglichkeiten, grafische Oberflächen für Smart-Client-Anwendungen zu erstellen. Zu nennen wären da neue Kontrollelemente, die direkte Unterstützung von Animationen und 3D-Grafik sowie eine verbesserte Textdarstellung und -verarbeitung. Mittels Styles lassen sich alle visuellen Kontrollelemente individuell darstellen - dem Einfallsreichtum sind in diesem Fall (fast) keine Grenzen gesetzt. Man sollte nun nicht glauben, dass dies lediglich der Spielerei dient. Es bieten sich statt dessen völlig neue Möglichkeiten an, dem Benutzer eine grafische Oberfläche zu präsentieren, die intuitiver zu bedienen ist und beispielsweise auch bessere visuelle Rückmeldungen, z.b. bei der Eingabe von fehlerhaften Daten, liefern kann. Einstieg in die WPF Seit ca. Mitte 2004 werden Vorabversionen des.net Framework 3.0 von Microsoft bereitgestellt. Diese Preview Releases benötigen als Basis ein installiertes.net Framework 2.0, so dass es sich bei der Version 3.0 eigentlich «nur» um einen Aufsatz zur Version 2.0 handelt. Zur Ausführung von.net-3.0-anwendungen muss eine zusätzliche Laufzeitkomponente installiert werden. Wer später noch programmieren möchte, benötigt ausserdem das Windows SDK. Momentan können optional Erweiterungen für Visual Studio 2005 installiert werden, so dass sich bereits jetzt die Vorteile einer IDE zur Entwicklung mit.net 3.0 nutzen lassen. Im Laufe 2007 wird für.net 3.0 eine neue Version von Visual Studio («Orcas») erscheinen. Wer benötigt nun eigentlich ein neues Framework für neue Benutzeroberflächen? Im Grunde genommen niemand, wenn man mit den bisherigen Anwendungen, die auf Windows Forms basieren, zufrieden ist. Wollte man allerdings mit Windows Forms und den Mitteln des.net Framework 2.0 Animationen erzeugen, Anwendungen mit Skins versehen oder die Standarddarstellung der Kontrollelemente verändern, war dies bisher gar nicht oder nur mit grossem Aufwand zu erledigen. XAML: Die GUI-Sprache Normalerweise erhält ein Entwickler ein API (Application Programming Interface) in die Hand, über das er mittels Funktionsaufrufen eine bestimmte Operation durchführt. So wird etwa über das API der.net-klassenbibliothek ein Fenster mit einer Schaltfläche und einem Eingabefeld erzeugt. In der WPF steht nun zusätzlich die deskriptive Sprache XAML (Extensible Application Markup Language) zur Verfügung, um Oberflächen ganz ohne Programmcode zu erzeugen. Für die Darstellung im Codekasten 1 wäre beispielsweise der dazu abgebildete XAML-Code notwendig (etwas gekürzt). Darin wird ein Fenster (window) definiert, in welchem sich innerhalb eines Grid (Tabelle) drei Schaltflächen befinden. Die Eigenschaft FontSize (Schriftgrösse) wird über ein Attribut des Elements Button gesetzt. Die Syntax einer XAML-Datei entspricht dabei einem XML-Dokument, wobei vordefinierte Element- und Attributnamen verwendet werden dürfen, die wiederum den entsprechenden Klassennamen und Eigenschaften dieser Elemente entsprechen. Damit die Schaltflächen ihr farbiges Aussehen erhalten, wird innerhalb eines Ressourcen-Elements ein neuer Stil (Style) für alle Schaltflächen dieses Fensters definiert. Auf diese Weise lassen sich bestimmte Eigenschaften, hier der Hintergrund (Control.Background), mit Vorgabewerten belegen. Diese können bei Bedarf

2 Eigenschaften, hier der Hintergrund (Control.Background), mit Vorgabewerten belegen. Diese können bei Bedarf innerhalb der Komponente auch überschrieben werden. Rollenverteilung XAML-Code lässt sich ähnlich wie in ASP.Net mit C# und Visual Basic um Programmlogik erweitern. Die klare Trennung zwischen Benutzer-oberfläche und Programmcode hat einen entscheidenden Vorteil. So kann das Design der Oberfläche von einem speziell dazu ausgebildeten Designer erstellt werden, während der Programmierer nur die notwendige Anwendungs-Logik implementiert und an die Oberfläche anbindet. Mit einigen Tools, die Teil der kommenden Microsoft-Expression-Linie sind, lassen sich Oberflächen auch mit einem professionellen Grafiktool erstellen (siehe Kasten «Expression-Werkzeuge»). Dadurch wird der Entwickler entlastet, da es nun am Designer liegt, eine attraktive UI zu erzeugen. Schlechtere Karten haben höchstens die Einzelunternehmer, da sie sich nun in ihren Anwendungen um eine weitere, umfangreichere Baustelle kümmern müssen. Programmlogik einbauen Wenn mit XAML eine Oberfläche erstellt und mit C# oder Visual Basic die Programmlogik implementiert wird, müssen beide Teile irgendwie miteinander verknüpft werden. Dazu werden meist Ereignisse verwendet. Allerdings gibt es verschiedene Möglichkeiten, auf diese zu reagieren. Einfache Ereignisse können direkt in der XAML-Datei verarbeitet werden. Dazu werden beispielsweise sogenannte Trigger definiert, die ausgelöst werden können, wenn der Benutzer die Maus über eine Komponente bewegt oder sich der Wert einer Eigenschaft ändert. Im folgenden Beispiel wird ein Style für alle TextBox-Elemente definiert. Ändert sich der Wert der Eigenschaft Text in einen leeren Eintrag (Value=""), wird der Hintergrund rot gefärbt. Wird später wieder ein Text eingetragen, erhält der Hintergrund die im jeweiligen TextBox-Element hinterlegte Textfarbe. Die Reaktion auf typische Ereignisse wie OnClick erfolgt, indem über ein passendes Attribut, hier Click, der Name einer Ereignisroutine angegeben wird. Diese Routine befindet sich in der zu einer XAML-Datei dazugehörigen C#- oder Visual-Basic-Datei (Code-Behind-Datei). Dort wird dann die Programmlogik codiert. WPF versus Windows Forms Im Internet und in den einschlägigen Foren wird momentan heiss darüber diskutiert, wann am besten welche Technologie zum Einsatz kommt. Grundsätzlich konkurrieren hier eigentlich nur Windows Forms und die WPF um den Thron der grafischen Windows-Anwendungen. Windows Forms wird dabei weiterhin eine wichtige Rolle spielen, denn für Standardanwendungen, Anwendungen, die auf älteren Rechnern ausgeführt werden sollen, oder Anwendungen, die bereits verfügbare Komponenten nutzen, für die es kein WPF-Äquivalent gibt, ist Windows Forms die beste bzw. die einzige Wahl. Da die WPF auf DirectX basiert und somit die Leistungsfähigkeit einer Grafikkarte voll nutzen kann, liegt der Schwerpunkt bei WPF-Anwendungen deutlich mehr im Grafik-intensiven Bereich. Natürlich können mit der WPF auch Windows-Forms-Anwendungen aufgepeppt werden. ASP.Net-Anwendungen, Ajax oder andere Web-Technologien, welche manchmal im Zusammenhang mit der WPF genannt werden, haben aber keinen direkten Nutzen davon, denn diese benötigt zur Ausführung.Net Framework 3.0. Es sind aber Szenarios denkbar, in denen über Web-Anwendungen XAML-Code bereitgestellt wird, der direkt im Internet Explorer ausgeführt werden kann (das sogenannte Loose XAML). Auf diese Weise können Animationen oder komplexe Grafiken über XAML formuliert und vom Benutzer betrachtet werden, sofern dieser die.net 3.0 Runtime installiert hat. Fazit Die WPF ist trotz der langen Testphase ein sehr junges Framework mit unglaublichem Potential. Es stellt anfangs hohe Anforderungen an den Entwickler, der ja nicht nur die trivialen Teile davon verwenden möchte. Doch im

3 hohe Anforderungen an den Entwickler, der ja nicht nur die trivialen Teile davon verwenden möchte. Doch im Laufe der Zeit werden immer mehr Beispielanwendungen, vorgefertigte Komponenten etc. verfügbar sein, welche den einen oder anderen Teil der WPF ausnutzen und somit als Vorlage für eigene Entwicklungen dienen. Dank der frühen Freigabe des Framework haben sich schon viele Hersteller an die Entwicklung von Tools gemacht, allen voran Microsoft mit den Produkten der Expression-Familie. Von Mobiform steht schon länger ein grafischer XAML-Editor namens Aurora bereit, Infragistics hat mit dem DataPresenter ein stark erweitertes DataGrid für die WPF geschaffen und Software FX bietet eine WPF-Version ihres Chart-FX-Controls an. Somit sind schon einige Hersteller bereit, der WPF zu einem furiosen Start zu verhelfen. Die Expression-Werkzeuge Die Produkte, die sich hinter dem Begriff Microsoft Expression verbergen, bieten eine anspruchsvolle Grafikverarbeitung in unterschiedlichen Bereichen. Der Graphic Designer dient als Vektor- und Pixel-basierendes Zeichentool und nutzt dabei hauptsächlich die WPF-Grafik-Features. Der Interactive Designer ist für die Erstellung von Benutzeroberflächen für WPF-Anwendungen spezialisiert. Es lassen sich dabei nicht nur Grafikelemente plazieren und konfigurieren, sondern auch Kontrollelemente wie Buttons, Textboxen oder Panels. Über spezielle Tools können auch Animationen visuell erzeugt werden, die im Hintergrund wiederum als XAML-Code abgelegt werden. Ein grosser Vorteil ist das mit dem Visual Studio gemeinsam verwendete Projektformat. So kann beispielsweise eine mit dem Interactive Designer entwickelte Oberfläche in XAML gespeichert und direkt im Visual Studio weiterverarbeitet werden. Als letztes Mitglied von Microsoft Expression dient der Web Designer zum Erstellen Browser-unabhängiger Websites, die auf den standardisierten Techniken XHTML und CSS basieren und Server-seitig ASP.Net 2.0 nutzen können (siehe auch Test der Vorabversion in IW 11/06). Codekasten 1 <Window Title="StylesProj" Height="173" Width="230"> <Window.Resources> <Style TargetType="Button"> <Setter Property="Control.Background"> <Setter.Value> <LinearGradientBrush StartPoint="0,1" EndPoint="1,1"> <LinearGradientBrush.GradientStops> <GradientStop Color="LightGreen" Offset="0" /> <GradientStop Color="LightYellow" Offset="1" /> </LinearGradientBrush.GradientStops> </LinearGradientBrush> </Setter.Value>

4 </Setter> <Setter Property="Control.Margin"> <Setter.Value> 5,5,5,5 </Setter.Value> </Setter> </Style> </Window.Resources> <Grid> <Grid.RowDefinitions> </Grid.RowDefinitions> <Button Grid.Row="0" FontSize="15">Button 1</Button> <Button Grid.Row="1" FontSize="20">Button 2</Button> <Button Grid.Row="2" FontSize="25">Button 3</Button> </Grid> </Window> Codekasten 2 <Style TargetType="TextBox"> <Style.Triggers> <Trigger Property="TextBox.Text" Value=""> <Setter Property="Background" Value="Red"/>

5 </Trigger> </Style.Triggers> </Style>... <TextBox>Hallo</TextBox> Der Autor Dirk Frischalowski schreibt unter anderem als Fachautor zu Themen im Bereich C# in Verbindung mit.net 2.0/3.0, Delphi und Java. Copyright by Swiss IT Media 2016