Ahoj, WPF!

Prvým a veľmi klasickým príkladom v skoro každom programovacom tutoriály je program "Ahoj, svet!". Ale v tomto návode to zmeníme na "Ahoj, WPF!". Cieľom je vypísať tento text na obrazovku, aby sme vám ukázali, aké ľahké je začať.

Ďalej v tomto tútoriály sa predpokladá, že máte nainštalovaný IDE, najlepšie Visual Studio alebo Visual Studio Community (pozrite si predchádzajúci článok, kde nájdete pokyny, ako ho získať). Ak používate iný produkt, budete sa musieť prispôsobiť vášmu produktu.

V programe Visual Studio začnite výberom položky New project v menu File. Vľavo by ste mali mať strom kategórií. Tento výukový program sa zameria na C# vždy, keď sa jedná o kód, takže by ste ho mali vybrať zo zoznamu šablón a keďže budeme vytvárať aplikácie Windows, mali by ste zo stromu vybrať Windows. Zobrazí sa vám zoznam možných typov aplikácií systému Windows vpravo, kde by ste mali vybrať WPF Application. V textovom poli Name som pomenoval svoj projekt "HelloWPF". Uistite sa, že zvyšné nastavenia v spodnej časti dialógového okna sú v poriadku a potom stlačte tlačidlo Ok.

Váš nový projekt bude mať niekoľko súborov, ale sústredíme sa iba na jeden z nich: MainWindox.xaml. Toto je primárne okno aplikácií, ktoré sa zobrazuje ako prvé pri spustení aplikácie, pokiaľ to konkrétne nezmeníte. Kód XAML, ktorý sa v ňom nachádza (XAML podrobne preberieme v ďalšej kapitole tohto tutoriálu) by mal vyzerať takto:

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

Toto je základ XAML, ktorým vytvorí Visual Studio naše okno, všetky jeho časti sa vysvetľujú v kapitolách XAML a "Okno". Teraz môžete aplikáciu spustiť (vyberte Debug -> Start debugging alebo stlačiť F5), aby ste si pozreli prázdne okno, ktoré vytvorila naša aplikácia, ale teraz je načase dostať našu správu na obrazovku.

Urobíme to tak, že pridáme na panel Grid ovládací prvok TextBlock a do neho ako obsah (content) našu správu:

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

Skúste teraz spustiť aplikáciu (vyberte Debug -> Start debugging alebo stlačte F5) a pozrite sa na krásny výsledok vašej tvrdej práce - Vaša prvá aplikácia vo WPF:

Všimnite si, že sme použili tri rôzne atribúty na TextBlock, aby sme získali vlastné zarovnanie (v strede okna), rovnako ako vlastnosť FontSize, aby sme získali väčší text. Všetky tieto pojmy budú preberané v neskorších článkoch.

Blahoželáme vám, že ste to dotiahli tak ďaleko. Teraz si prečítajte zvyšok tutoriálu a čoskoro budete majster v programovaní vo WPF!