Hello, WPF!

Eksempel kode for "Hello, world" er vanligvis det aller første eksempelet som brukes ved opplæring i programmering. I dette kurset, våger vi oss langt vekk fra normalen, og endrer det til "Hello, WPF!". Målet er ganske enkelt å vise denne teksten på skjermen, slik at vi kan vise hvor enkelt det er å komme i gang.

I resten av dette kurset, forutsettes det at du har et IDE installert, fortrinnsvis Visual Studio eller Visual Studio Community ( se foregående kapittel for mer informasjon om hvordan du kan laste ned og installere det). Hvis du har valgt å bruke et annet utviklingsmiljø, er det opp til deg å tilpasse instruksjonene til produktet du har valgt.

I Visual Studio, start ved å velge New project fra File menyen. På venstre side, skal du nå se et kategori-tre. I dette kurset vi valgt å fokusere på C# som programmeringsspråk. Du må derfor velge C# fra listen over maler, og siden vi ønsker å lage applikasjoner for Windows, må du velge Windows. Dette vil gi deg en liste over mulige programtyper for Windows-programmer til høyre. Du må da velge WPF Application i listen til høyre. Jeg har navngitt prosjektet mitt "HelloWPF" i Name tekst-feltet. Dobbeltsjekk at resten av innstillingene i bunnen av dialogvinduet er korrekt, og trykk på Ok knappen.

Det nye prosjektet kommer ferdig satt opp med flere filer/dokumenter, men vi vil fokusere på kun en av dem: MainWindow.xaml. Dette er programmets hoved-vindu, det vil si; det er vinduet som vises først når programmet startes, med mindre du spesifikt har valgt å endre det til noe annet. XAML koden i dette dokumentet ( du vil finne emnet XAML dekket i detalj i et annet kapittel i dette kurset ) vil se ut omtrent slik:

<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>

Dette er grunnleggende XAML kode, som Visual Studio har genereret for vinduet vårt, der alle elementer i koden er forklart i kapitlene om XAML og "Vinduet". Du kan allerede kjøre progammet ( velg Debug -> Start debugging eller trykk på F5) for å se programmet i sin nåværende form. For øyeblikket vil du kun se et tomt vindu, så vi skal se på hva som må til for å få tekst-meldingen vår vist på skjermen.

For å få til det, vil vi legge til en TextBlock kontroll til Grid panelet, som da vil inneholde vår tidligere valgte tekst-melding.

<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>

Prøv å kjøre programmet nå ( velg Debug -> Start debugging eller trykk F5) og nyt fruktene arbeidet ditt så langt - ditt første WPF program:

Du vil kanskje legge merke til at vi brukte tre forskjellige attributter på TextBlock kontrollen, for å finjustere plassering av tekst( i midten av vinduet ), i tillegg til FontSize egenskapen for å få større tekst. Samtlige konsepter vil forklares nærmere i senere kapitler.

Gratulerer med alt du har lært så langt. Fortsett med resten av kurset og du vil snart kunne kalle deg en WPF ekspert!