2. Hello Word

Aprire Visual Studio 2008 e scegliere "File", "Nuovo", "Progetto ..." nel menu principale. Scegliere "Applicazione WPF" come tipo di progetto.

Scegliere una cartella per il progetto e dargli un nome. Quindi premere "OK"

Visual Studio crea il progetto e aggiunge automaticamente alcuni file per la soluzione. Un Window1.xaml e un App.xaml. La struttura sembra abbastanza simile a WinForms, tranne che il file Window1.designer.cs non è più il codice, ma è ora dichiarata in XAML come Window1.xaml

Aprire il file Window1.xaml nella finestra di progettazione WPF e trascinare un pulsante e un controllo TextBox dalla Casella degli strumenti della finestra

Selezionare il pulsante e passare alla vista degli eventi nella finestra delle proprietà (clicca sulla piccola icona fulmine giallo). Fare doppio clic sull'evento "Click" per creare un metodo nel codebehind che si chiama, quando l'utente fa clic sul pulsante.

Nota: se non trovate l'icona di un giallo lampo, è necessario installare il Service Pack 1 per VisualStudio sulla vostra macchina. In alternativa è possibile due volte sul pulsante nella finestra di progettazione per ottenere lo stesso risultato.

 

Visual Studio crea automaticamente un metodo nel file code-behind che viene chiamato quando il pulsante viene premuto.


private void button1_Click (object sender, RoutedEventArgs e)
{
TextBox1.Text = "Ciao WPF!";
}


La casella di testo è diventato automaticamente assegnato il nome textBox1 dal designer WPF. Testo testo presentato a "Ciao WPF!" quando il pulsante viene premuto e abbiamo finito! Avviare l'applicazione da premere [F5] della tastiera.

Logical- and Visual Tree

Introduzione
Elementi di una interfaccia utente WPF sono collegate gerarchicamente. Questa relazione si chiama LogicalTree. Il modello di un elemento è costituito da più elementi visivi. Questo albero è chiamato VisualTree. WPF differisce tra i due alberi, perché per alcuni problemi è necessario solo gli elementi logici e per altri problemi si desidera che tutti gli elementi.

<Window>
<Grid>
<label Content="Label" />
<Button Content="Button" />
</ Grid></ Window>

Perché abbiamo bisogno di due diversi tipi di alberi?
Un controllo WPF è costituito da più, controlli più primitivo. Un tasto - per esempio - è costituito da un bordo, un rettangolo e un presentatore contenuto. Questi controlli sono figli visivo del pulsante.
Quando WPF rende il pulsante, lo stesso elemento non ha l'aspetto, ma si scorre l'albero visuale e rende i bambini visivo di esso. Questa relazione gerarchica può essere utilizzato anche per fare hit testing, layout, ecc
Ma a volte non siete interessati ai confini e rettangoli di un modello di un controllo '. Particolarmente perché il modello può essere sostituito, e quindi non dovrebbe riguardare la struttura ad albero visuale! A causa di ciò si vuole un albero più robusto che contiene solo i "veri" controlli - e non tutte le parti modello. E questo è l'idoneità per l'albero logico.
L'albero logico
L'albero logico descrive le relazioni tra gli elementi dell'interfaccia utente. L'albero logico è responsabile per:
• Eredita valori DependencyProperty• Risoluzione DynamicResources riferimenti• Ricerca di nomi di elementi per le associazioni• RoutedEvents Forwaring

Il Visual Tree
La struttura ad albero visuale contiene tutti gli elementi logici compresi tutti gli elementi visivi del modello di ogni elemento. La struttura visiva è responsabile di: • Elementi di rendering visivo• Propaga opacità elemento• Propaga Layout e RenderTransforms• Propagare la proprietà IsEnabled.• Do Hit-Testing• RelativeSource (FindAncestor)

Trova un antenato di programmazione in Visual Tree
Se sei un elemento figlio di una interfaccia utente e si desidera accedere ai dati da un elemento padre, ma non sai quanti livelli fino Elemens che è, è la migliore soluzione per navigare l'albero fino a trovare un elemento di il tipo richiesto.
Questo helper fa excactly questo. È possibile utilizzare praticamente lo stesso codice per navigare attraverso l'albero logico.

pubblico VisualTreeHelperExtensions classe statica{
public static T FindAncestor <T> (DependencyObject DependencyObject)
dove T: classe
{
DependencyObject target = DependencyObject;
fare
{
target = VisualTreeHelper.GetParent (target);
}
while (target = null & & bersaglio (è T)!);
obiettivo di rendimento come T;
}}

L'esempio seguente mostra come utilizzare l'helper. Si parte da questo e naviga la struttura visiva finché non trova un elemento di rete tipo. Se il soccorritore raggiunge l'elemento radice dell'albero, restituisce null.

var grid = VisualTreeHelperExtensions.FindAncestor <Grid> (this);

Introduzione a XAML

XAML è l'acronimo di Extensible Application Markup Language. Il suo un linguaggio semplice basato su XML per creare e inizializzare. NET con relazioni gerarchiche. Anche se è stato originariamente inventato per WPF può da utilizzare per creare qualsiasi tipo di alberi dell'oggetto.
Oggi XAML viene utilizzato per creare interfacce utente in WPF, Silverlight, dichiarare workflow in WF e per la carta elettronica nello standard XPS.
Tutte le classi di WPF sono costruttori senza parametri e rendere l'uso eccessivo di proprietà. Che viene fatto per renderlo perfettamente adatto per i linguaggi XML come XAML.
I vantaggi di XAML
Tutto quello che puoi fare in XAML può essere effettuata anche nel codice. XAML ist solo un altro modo per creare e inizializzare oggetti. È possibile utilizzare WPF senza l'utilizzo di XAML. Sta a te se vuoi dichiararlo in XAML o scrivere nel codice. Dichiarare l'interfaccia utente in XAML ha alcuni vantaggi:
• codice XAML è breve e chiaro da leggere• Separazione del codice di progettazione e la logica• strumenti di progettazione grafica come Expression Blend richiedono XAML come fonte.• La separazione tra XAML e logica dell'interfaccia utente permette di separare chiaramente i ruoli di progettista e sviluppatore.
Vs codice XAML
Come esempio costruiamo un StackPanel semplice con un TextBlock e un pulsante in XAML e confrontarlo con lo stesso codice in C #.

<StackPanel>
<TextBlock Margin="20"> Benvenuti nel mondo di XAML </ TextBlock>
<Button Margin="10" HorizontalAlignment="Right"> OK </ Button></ StackPanel>

La stessa cosa espressa in C # sarà simile a questa:

/ / Crea il StackPanelStackPanel StackPanel StackPanel = new ();this.Content = StackPanel;
/ / Crea l'oggetto TextBlockTextBlock TextBlock TextBlock = new ();textBlock.Margin = Spessore nuovo (10);textBlock.Text = "Benvenuti nel mondo di XAML";stackPanel.Children.Add (TextBlock);
/ / Crea il pulsantePulsante = new Button ();button.Margin = Spessore nuovo (20);button.Content = "OK";stackPanel.Children.Add (pulsante);

Come potete vedere è la versione XAML molto più breve e più chiaro da leggere. E questo è il potere di espressività XAMLs.
Proprietà come elementi
Le proprietà sono normalmente scritte in linea come noto da XML <Button Content="OK" />. Ma cosa succede se vogliamo mettere un oggetto più complesso come contenuto, come una immagine che ha proprietà stessa o magari un pannello grigliato intero? Per fare questo possiamo utilizzare la sintassi per elementi proprietà. Questo ci permette di estrarre la proprietà come un elemento figlio.

<button>
<Button.Content>
<image Source="Images/OK.png" Width="50" Height="50" />
</ Button.Content></ Button>

Tipo di conversione implicita
Un costrutto molto potente di WPF sono convertitori di tipo implicito. Fanno il loro lavoro silenziosamente in background. Quando si dichiara una BorderBrush, la parola "Blue" è solo una stringa. Il BrushConverter implicita fa un System.Windows.Media.Brushes.Blue fuori di esso. La stessa riguarda lo spessore del bordo che sta molto bene convertito implicitamente in un oggetto spessore. WPF include un sacco di convertitori di tipi per classi incorporate, ma è possibile anche scrivere i convertitori di tipo per il vostro CLASSI proprio.

<Border BorderBrush="Blue" BorderThickness="0,10"></ Border>

Estensioni di markup
Estensioni di markup sono i segnaposto dinamico per i valori degli attributi in XAML. Risolvono il valore di una proprietà a runtime. Estensioni di markup sono surrouded da parentesi graffe (Esempio: background = "{StaticResource NormalBackgroundBrush}"). WPF ha alcuni built-in estensioni di markup, ma è possibile scrivere il vostro, derivando da MarkupExtension. Questi sono il built-in estensioni di markup:
• BindingPer associare i valori delle due proprietà insieme.• StaticResourceUna ricerca volta di una voce di risorsa• DynamicResourceL'aggiornamento automatico di ricerca di una voce di risorsa• TemplateBindingPer associare una proprietà di un modello di controllo di una proprietà di dipendenza del controllo• x: StaticRisolvere il valore di una proprietà statica.• x: NullRestituire null
Il primo identificatore all'interno di una coppia di parentesi graffe è il nome dell'estensione. Tutti gli identificatori preciding sono chiamati parametri sotto forma di proprietà = Valore. L'esempio seguente mostra l'etichetta il cui contenuto è legato al testo della casella di testo. Quando si digita un testo nella casella di testo, il testo cambia proprietà e l'estensione di markup vincolante aggiorna automaticamente il contenuto dell'etichetta.

<TextBox X:Name="textBox"/><label Content="{Binding Text, ElementName=textBox}"/>

Namespace
All'inizio di ogni file XAML è necessario includere due spazi dei nomi.Il primo è http://schemas.microsoft.com/winfx/2006/xaml/presentation. E 'mappato tutti i controlli WPF in System.Windows.Controls.Il secondo è http://schemas.microsoft.com/winfx/2006/xaml è mappato System.Windows.Markup che definisce le parole chiave XAML.
La mappatura tra un namespace XML e uno spazio dei nomi CLR è fatto l'attributo XmlnsDefinition a livello di assembly. È anche possibile includere direttamente uno spazio dei nomi CLR in XAML utilizzando il clr-namespace: prefisso.

<Finestra xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns: x = "http://schemas.microsoft.com/winfx/2006/xaml"></ Window>