Appunti di WPF – Quarta Puntata – XAML, le basi

XAML è l’acronimo di eXtensible Application Markup Language e rappresenta un “dialetto” del formato XML in grado di rappresentare in maniera completa istanze di oggetti e relativa gerarchia contenuto/contenitore.

Prima di entrare in dettaglio su come è strutturato lo XAML e come possiamo definire una interfaccia grafica utilizzando questo linguaggio, vediamo di capire quali sono i vantaggi che si possono avere utilizzandolo. Per fare ciò partiremo da alcune controindicazioni che si hanno nel momento in cui si realizza un’interfaccia grafica classica (ad esempio in Windows Form).

Per prima cosa, è piuttosto difficile, in un’applicazione Windows Form, separare il codice di interfaccia vero e proprio dalla logica dell’applicazione. Poi, tutto l’aspetto grafico di una interfaccia deve essere realizzato con uno strumento esterno a quello con cui viene realizzata l’applicazione, utilizzando dei file bitmap (o equivalenti) per poi essere inserite nell’interfaccia come risorse (incorporate o meno). La gestione di semplici effetti grafici (come, ad esempio, il passaggio del mouse su un bottone), inoltre, deve essere inserita nel codice dell’applicazione appesantendo la leggibilità della stessa. Infine, le immagini in una interfaccia Windows Form, non possono essere ridimensionate senza perdere in qualità.

WPF risolve queste problematiche attraverso l’utilizzo di XAML.

Va precisato che WPF non necessariamente richiede la definizione dell’interfaccia grafica tramite da XAML (potremmo definire tutti gli oggetti grafici come accade per una Windows Form) ma il suo utilizzo semplifica notevolmente la realizzazione e permette il disaccoppiamento del codice applicativo da quello di interfaccia.

Una finestra WPF è composta, dunque, da un file XAML che rappresenta la definizione degli oggetti che compongono la sua interfaccia grafica (in termini di disposizione gerarchica degli stessi, aspetto e proprietà) e di un file VB (o CS) che contiene il codice applicativo. In sostanza una finestra WPF è assimilabile ad una Web Form in cui abbiamo un file aspx che definisce l’interfaccia grafica e un file vb che contiene il code behind.

Quando realizziamo un’interfaccia grafica utilizzando un file XAML dobbiamo tener presente tre semplici regole:

· Ogni nodo XAML rappresenta una classe .NET. Il nome del nodo è lo stesso della classe. Ad esempio il nodo <Button> corrisponde alla classe Button;

· Poichè XAML è XML, possiamo innestare nodi all’interno di nodi in una struttura gerarchica per definire che un oggetto è contenuto in un altro;

· E’ possibile impostare le proprietà di un nodo (classe) utilizzando gli attributi. In caso di proprietà complesse, è possibile utilizzare degli speciali tag innestati nel nodo.

Vediamo ora un esempio di una finestra, molto semplice, definita da WPF:

1. <Window x:Class="MainWindow"
2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4.     Title="MainWindow" Height="350" Width="525">
5.     <Grid>
6.         <Button x:Name="MyButton">Premi</Button>
7.     </Grid>
8. </Window>

Osserviamo che il nodo radice del documento è rappresentato dal tag <Window> che comunica al framework di WPF che la nostra finestra (stile windows worm) sarà rappresentata da una classe MainWindow derivata dalla classe Window. Le proprietà Title, Height e Width sono impostate utilizzando appositi attributi.

All’interno della finestra troviamo un contenitore Grid (identificato dal tag <Grid> e di cui parleremo più avanti) e, all’interno di quest’ultimo, un bottone (tag <Button>). Il bottone ha un nome associato (attributo x:Name) che permette di referenziarlo qualora ne avessimo la necessità nel code behind e un testo visualizzato. Una differenza tra Windows Form e WPF è che in Windows Form ogni controllo deve avere un nome, mentre in WPF i controlli possono anche non averne (ovviamente nel caso in cui non abbiano nome, questi non potranno essere referenziati a livello di code behind).

Poiché ogni tag corrisponde ad una classe .NET, come fa il compilatore a sapere quale classe Button associare al tag <Button>? In altre parole, come fa a completare il namespace della classe Button (che, per la cronaca, si trova in System.Windows.Controls) visto che da nessuna parte è indicato?

L’arcano si svela nell’utilizzo dei namespace. Come possiamo vedere, tra gli attributi del tag <Window> compaiono i seguenti:

1. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
2. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

che indicano al parser XAML di andare a cercare i tag all’interno di opportune definizioni alla stregua di quello che fa il compilatore del linguaggio VB quando inseriamo la parola chiave Imports per referenziare namespace del mondo .NET.

In particolare:

· http://schemas.microsoft.com/winfx/2006/xaml/presentation : è il namespace principale di WPF in cui sono contenuti tutti i controlli grafici di WPF e alcune delle classi utilizzate più di frequente. Da notare che il namespace viene referenziato senza aggiungere prefissi il che significa che si tratta del namespace di default del documento;

· http://schemas.microsoft.com/winfx/2006/xaml : si tratta del namespace caratteristico di XAML che include alcune funzionalità utili all’interno del documento (come ad esempio il nome degli oggetti dell’interfaccia). Questo namespace è referenziabile con il prefisso x nel senso che, ovunque si voglia fare riferimento ad un oggetto in esso contenuto bisognerà scrivere x:ElementName.

Osserviamo che non c’è corrispondenza tra namespace XML e namespace .NET.

Per poter utilizzare altre classi del framework o nostre classi create in un assembly separato, dobbiamo definire opportunamente i namespace in cui tali classi sono contenute per poter permette al parser XAML di riconoscerle.

Se vogliamo referenziare un assembly del framework .NET all’interno dello XAML, dobbiamo inserire il riferimento al namespace con la seguente sintassi:

xmlns:Prefix=”clr-namespace:Namespace;assembly=AssemblyName”

dove Prefix è il prefisso con cui referenzieremo le classi all’interno dello XAML, Namespace è il namespace .NET da referenziare e AssemblyName l’assembly in cui è contenuto il namespace.

Per esemplificare il concetto, supponiamo di voler utilizzare, all’interno della nostra interfaccia, la classe DateTime :

1. <Window x:Class="DateTimeWindow"
2.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4.     xmlns:sys="clr-namespace:System;assembly=mscorlib"
5.     Title="DateTimeWindow" Height="300" Width="300">
6.     <StackPanel>
7.         <ListBox>
8.             <ListBox.Items>
9.                 <ListBoxItem>
10.                     <sys:DateTime>12/31/2009 17:00</sys:DateTime>
11.                 </ListBoxItem>
12.                 <ListBoxItem>
13.                     <sys:DateTime>12/31/2009 18:00</sys:DateTime>
14.                 </ListBoxItem>
15.                 <ListBoxItem>
16.                     <sys:DateTime>12/31/2009 19:00</sys:DateTime>
17.                 </ListBoxItem>
18.             </ListBox.Items>
19.         </ListBox>
20.     </StackPanel>
21. </Window>

Abbiamo definito una list box al cui interno abbiamo inserito tre elementi contenenti 3 date.

 

Technorati Tag: wpf,tutorial,windows presentation foundation,presentation framework,XAML,XML,extensible application markup language,markup,appunti wpf