in

DotNetSide

Dot Net South Italy Developers User Group

Articoli

Articoli pubblicati dagli iscritti a .netSide

Introduzione a Windows Presentation Foundation

autore: Vito Arconzo

Windows Presentation Foundation (WPF) è il nuovo framework per la creazione di interfacce grafiche (e non solo) incluso nel .NET Framework 3.0.

Nasce come sistema unificato per la gestione di UI, Documenti, Media, ma questo non vuol dire che saremo costretti ad utilizzare WPF anzichè Windows Forms 2.0. Se vogliamo creare interfacce più accattivanti, molto più vicine a quelle a cui l’utente si sta abituando (web, flash), WPF nasce per questo: per sostituire l’attuale GDI che tutto sommato non ha grosse limitazione se non il fatto di basarsi su un modello di rendering ormai sorpassato in quanto fortemente orientato al pixel.

WPF, infatti, utilizza la grafica vettoriale per il rendering che, inoltre, rende più “universale” la fruizione dei contenuti che vengono sempre adattati alla risoluzione del dispositivo senza perdita di qualità.

XAML: un nuovo linguaggio di mark-up

WPF introduce, inoltre, un nuovo linguaggio, chiamato XAML, che consente di definire gli oggetti nell'area di lavoro attraverso tag XML, un po' come faremmo con una normalissima pagina web. Infatti, l'idea alla base di XAML è quella di riprendere, per molti versi, quanto di buono è stato introdotto con ASP.NET, o più in generale con HTML.

Solitamente, in un normale flusso di sviluppo, il grafico realizza l’interfaccia dell'applicazione con strumenti di grafica che poi lo sviluppatore cercherà di ricreare con altri strumenti (come Visual Studio) con, quasi sempre, scarsi risultati. Adesso,invece, il grafico crea il layout con strumenti a lui familiari di editing grafico, successivamente viene esportato il tutto in XAML che viene, quindi, utilizzato dallo sviluppatore nell’applicazione.

Con XAML è quindi possibile separare la parte grafica dalla parte logica , un po' come faremmo con una pagina ASP.NET.

XAML comporta soprattutto un approccio diverso allo sviluppo di interfacce per Windows (ma non solo), con il vantaggio di non essere obbligati a definirle solo in maniera visiva, come accade con le WinForms, ma di poterlo fare anche attraverso il semplice markup. Certo, anche con le WinForms è possibile definire gli oggetti attraverso codice applicativo, però è tutt'altro che banale.

D'altra parte è dimostrato dagli ultimi 10 anni di storia: definire un layout utilizzando un linguaggio di markup facilita la creazione delle applicazioni, sia da parte di umani che da parte di tool grafici.

Considerando poi che XML, di cui XAML è solamente un "dialetto", è una tecnologia pervasiva, disponibile ovunque (è un semplice file di testo) ma tutto sommato facile da capire ed abbracciare, XAML diventa manipolabile attraverso qualsiasi tool di sviluppo.

Ecco un esempio di creazione di un semplice Button con XAML:

<Window xmlns="http://schemas.microsoft.com/winfx/avalon/2005"

Title
="Windows Presentation Foundation Sample">

<Button Width="100" Height="30">Cliccami!</Button>

</Window>

In questo semplicissimo esempio vediamo come root  dell'albero XML, l'elemento Window che è appunto la finestra dove, inoltre c'è l'attributo Title specificato. All'interno dell'elemento Window, ecco Button, che definisce un pulsante con Width=100, Height=30 e come testo "Cliccami!".

Per sviluppare applicazioni con Windows Presentation Foundation sono necessari:

APPLICATION MODEL

Un’applicazione WPF, generalmente, è composta da più Pages XAML e i relativi file con il codice procedurale ma,  oltre ai processi delle varie pagine, solitamente, vengono svolte operazioni di passaggio dati tra le varie pagine.

Il core di un’applicazione WPF è l’oggetto  Application. Questo oggetto funge da interfaccia tra l’applicazione ed il sistema operativo e, inotre, permette di gestire la collection di pagine XAML.

Alcune caratteristiche dell’oggetto Application:

  • E' globale per applicazione, tutte le pagine (Window o Page) accedono alla stessa istanza di oggetto
  • Viene creato duranto lo startup dell'applicazione per tutta la durata di quest'ultima

L'oggetto Application può essere definito tramite XAML o, tradizionalmente, con codice e, a seconda dello scenario, è possibile aggiungere un livello logico all'applicazione per:

  • Gestire eventi a livello di applicazione (come "Startup" o "Exit")
  • Gestire eventi globali della navigazione tra Page
  • Gestire Custom Property o metodi, con possibilità di utilizzo da qualsiasi Page o Window dell'applicazione

STYLING & TEMPLATING

Windows Presentation Foundation mette a disposizione diverse funzionalità per la gestione degli Styles e Templates.

Gli Styles permettono, un pò come accade nel web, la dichiarazione dello stile di qualsiasi controllo in modo da condividere questa informazione in tutta l'applicazione e dare, quindi, un aspetto standard a quest'ultima.

Se ad esempio abbiamo:

 

<TextBlock>My Pictures</TextBlock>

<TextBlock>Check out my new pictures!</TextBlock>

Window before styling

una semplice finestra con due TextBlock (molto simile alle Label di Windows Forms) e vogliamo impostare un Style di default, dovremmo semplicemente definirne uno nella sezione Resource del file XAML in questo modo:

 

<Window.Resources>



...



<!--A Style that affects all TextBlocks-->

<Style TargetType="TextBlock">

<Setter Property="HorizontalAlignment" Value="Center" />

<Setter Property="FontFamily" Value="Comic Sans MS"/>

<Setter Property="FontSize" Value="14"/>

</Style>



...



</Window.Resources>

impostando le property HorizontalAlignment, FontFamily e FontSize, avremo come risultato:

Window after styles

Oltre agli Styles, WPF, introduce anche il concetto di Templates.

Ogni controllo, infatti, espone una property Template su cui è possibile agire per, addirittura, stravolgere la UI del controllo mantenendo, però, inalterato il comportamento.

Ad esempio ridefiniamo il template di un semplice Button disegnando un ellisse:

<Style TargetType="Button">
  <!--Set to true to not get any properties from the themes.-->
  <Setter Property="OverridesDefaultStyle" Value="True"/>
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate TargetType="Button">
        <Grid>
          <Ellipse Fill="{TemplateBinding Background}"/>
          <ContentPresenter HorizontalAlignment="Center"
                            VerticalAlignment="Center"/>
        </Grid>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

Con il risultato:

button control template

 

CONCLUSIONI

Abbiamo visto, in questa breve introduzione, cosa riserva il nuovo framework per gli sviluppatori Windows Forms, un sistema unificato per una nuova esperienza visuale che, ormai, ha abituato l'utente ad interfacce davvero stupefacenti.

Only published comments... Nov 19 2006, 08:00 PM by DotNetSide Staff
Filed under:

Comments

 

Vito Arconzo's Blog said:

Come gi&#224; annunciato, il 5 dicembre 2006, &#232; previsto il mio webcast Introduzione a Windows Presentation

November 20, 2006 9:34 AM
 

Leo said:

Ciao Vito,

ho  appena letto la tua introduzione a WPF che mi è sembrata molto interessante; per esigenze lavorative mi sto occupando di verificare la possibilità di utilizzare WPF per  costruire interfacce web per applicazioni ASP.NET più accattivanti (simili a quelle che si ottengono utilizzando prodotti quali flash ecc.).

Ho discusso di questo argomento com mio cugino  (Michele alias Miguel), il quale mi accennava alla possibilità di "hostare" i controlli WPF per renderli fruibili lato web almeno su una intranet. Potresti fornirmi ulteriori dettagli sia  a proposito di WPF (Testi, cosa guardare per iniziare, ecc.) che sulla possibilità di sfruttare i controlli WPF lato WEB.

Ti ringrazio per la disponibilità

Ciao

Leo

March 13, 2007 12:35 PM
Powered by Community Server (Commercial Edition), by Telligent Systems