Hello, WPF!

El primer i més clàssic exemple en quasi qualsevol tutorial de programació és l'exemple "Hello, world!", però en aquest tutorial farem una bogeria i ho canviarem per "Hello WPF!". L'objectiu és simplement fer aparèixer aquest text per pantalla, per mostrar-li que fàcil és començar.

La resta d'aquest tutorial assumeix que vostè disposa d'un IDE installat, preferiblement Visual Studio o Visual Studio Community (mireu l'article anterior on hi ha les instruccions per obtenir-lo). Si esteu utilitzant un altre producte, haureu d'adaptar les instruccions al vostre producte.

A Visual Studio, comencem seleccionant New project des del menú File. A l'esquerra, hauria de figurar un arbre d'opcions. Aquest tutorial se centrarà en C# allà on estigui present, pel que hauríeu de seleccionar-lo de la llista de plantilles on, donat que estem creant aplicacions Windows, hauria de seleccionar Windows de l'arbre d'opcions. Això mostrarà una llista de tipus d'aplicacions Windows possibles a la dreta, on hauríem de seleccionar una WPF Application. He anomenat el meu projecte "HelloWPF" al camp de text Name. Assegureu-vos que la resta d'ajustos a la part inferior del diàleg són correctes i premeu el botó Ok.

El nou projecte tindrà un parell de fitxers, però ara només ens centrarem en un d'ells: MainWindox.xaml. Aquesta és la finestra principal de les aplicacions, la primera que es mostra quan s'executa el llançament de l'aplicació, llevat que especifiquem que això no sigui així. El codi XAML inclòs en aquesta (XAML és tractat amb detall a un altre capítol d'aquest tutorial) hauria de tenir un aspecte similar al que figura a continuació:

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
    <Grid>

    </Grid>
</Window>

Aquesta és la base XAML que Visual Studio crea per a la nostra finestra, totes les parts estan explicades als capítols sobre XAML i "The Window (La Finestra)". De fet podeu executar l'aplicació ara (seleccioneu Debug -> Start debugging o premeu F5) per veure la finestra buida en què consisteix la nostra aplicació actualment, però ara és l'hora d'obtenir el nostre missatge per pantalla.

Ho farem afegint un control de tipus TextBlock al contenidor de Grid, amb el nostre missatge com a contingut:

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="72">
            Hello, WPF!
        </TextBlock>
    </Grid>
</Window>

Intenteu executar l'aplicació ara (seleccioneu Debug -> Start debugging o premeu F5) i veieu el bonic resultat del vostre gran esforç - la vostra primera aplicació WPF:

Notareu que al TextBlock hem fet servir tres atributs diferents per establir una alineació personalitzada (al mig de la finestra), també la propietat FontSize per obtenir un text més gran. Tot d'aquests conceptes seran tractats en propers articles.

Felicitats per haver arribat tan lluny. Ara seguiu llegint la resta del tutorial i aviat dominareu WPF!