Lekce 1 - Úvod do Windows Forms aplikací

Vítejte u první lekce kurzu, ve kterém se naučíme vytvářet okenní (formulářové) aplikace v C# .NET a vyzkoušíme si použití jednotlivých komponent. Budeme pracovat s tlačítky, textovými poli, tabulkami, ale i s obrázky, časovači a dalšími tzv. ovládacími prvky (anglicky controls), které máme v těchto aplikacích k dispozici.

Kurz budu psát tak, abyste nepotřebovali žádné pokročilé znalosti. Předpokládám však, že znáte alespoň základy objektově orientovaného programování.

Windows Forms

Windows Forms je prvním frameworkem z .NETu, který umožňuje jednoduchou tvorbu formulářových aplikací pomocí grafického designeru. Nalezneme zde plnou sadu připravených ovládacích prvků (někdy označovaných jako komponenty) pro většinu situací. A pokud nám nebudou stačit, můžeme si samozřejmě vytvořit vlastní nebo upravit nějakou existující. Právě Windows Forms se budeme v tomto kurzu věnovat.

V současné době existuje spolu s Winforms ještě jeden modernější framework WPF (Windows Presentation Foundation). Obsahuje lepší oddělení logiky a výstupu, podporu rychlejšího vykreslování, animací, bindingů a dalších nových technologií. V praxi se u formulářových aplikací používají oba frameworky, u novějších aplikací WPF, existující aplikace z většiny používají Winforms. V současné době není Winforms označen za zastaralý a stále se používá, jeho použití je jednoduché a určitě se v praxi setkáte s mnoha aplikacemi, které jsou ve Winforms napsané. Měli byste o nich tedy mít alespoň nějaké povědomí, i když je určitě lepší tvořit nové aplikace rovnou ve WPF, které je technologicky mnohem dále.

Příprava Visual Studia

Pro vývoj formulářových aplikací je nutné mít ve Visual Studiu nainstalovanou sadu funkcí "Vývoj desktopových aplikací pomocí .NET". To ověříme kliknutím na položku Tools v aplikačním menu VS, poté zvolíme položku Get Tools and Features…. Otevře se nám Visual Studio Installer, pomocí kterého se instaluje VS a také pomocí něj můžeme doinstalovat sady funkcí. Ujistěte se, že máte zaškrtnutou sadu "Vývoj desktopových aplikací pomocí .NET", případně ji zaškrtněte a klikněte na Změnit.

První formulářová aplikace

Nezačneme jinak, než klasickou aplikací Hello World, tentokrát formulářovou Pokud jste nečetli zdejší kurz, tak zopakuji, že je to jednoduchá aplikace, která nedělá nic jiného, než že vypíše nějaký text.

Vytvořte si nový projekt, jako typ projektu vyberte Windows Forms Application. Jako název zvolíme HelloForms.

Okno vašeho Visual Studia by nyní mělo vypadat asi takto:

Popišme si jeho jednotlivé části, které budeme při vývoji formulářových aplikací používat. Důležité části jsou na obrázku výše zvýrazněné červeně.

• Designer (Grafický návrhář) - V Designeru vidíme, jak formulář vypadá. Zatím je to jen prázdné okno.
• Properties (Vlastnosti) - V okně Properties vidíme vlastnosti aktuálně označeného prvku na formuláři. Pokud okno nevidíte, zapněte si ho v menu View -> Properties Window.
• Toolbox (Panel nástrojů) - Toolbox je vyjížděcí okno, které slouží jako paleta s jednotlivými ovládacími prvky, které můžeme na formulář vložit.

Nastavení vlastností ovládacích prvků

Když označíme nějaký prvek na formuláři nebo formulář samotný, můžeme v okně Properties měnit jednotlivé vlastnosti tohoto prvku.

Jelikož na formuláři žádný prvek nemáme, je označený právě formulář. Formuláři změníme titulek na "Pozdrav". Vyhledejte si vlastnost Text a do ní vložte hodnotu "Pozdrav" (bez uvozovek). Výsledek se hned projeví v návrháři. Tímto způsobem budeme nastavovat vlastnosti všech prvků na formuláři.

Vložení ovládacích prvků na formulář

Nyní otevřeme Toolbox a vybereme ovládací prvek Label, což je textový popisek. Vložíme jej do formuláře buď dvojklikem nebo přesunutím myší. Formulář si zmenšete a label myší jednoduše přesuňte doprostřed. Označenému labelu v oknu Properties nastavte text na "Pozdrav z formuláře".

Vaši první okenní aplikaci můžete spustit jako vždy zeleným tlačítkem Play nebo klávesou F5. Měli byste dostat podobný výsledek:

Pod pokličkou

Vysvětleme si, jak aplikace funguje uvnitř. Samotný formulář je samozřejmě objekt (jak jinak ). Je definován třídou Form1, kterou nalezneme v souboru Form1.cs. Soubor si samozřejmě můžete přejmenovat v Solution Exploreru, přejmenuje se i třída. Pro naší aplikaci by se formulář mohl jmenovat např. PozdravForm, přejmenujte si ho tak, jelikož se v aplikaci poté budete lépe orientovat.

Visual Studio zobrazuje buď grafický náhled formuláře nebo jeho zdrojový kód. Mezi těmito režimy můžeme přepínat buď pravým kliknutím na formulář (resp. na kód) a výběrem možnosti View Code (resp. View Designer). Užitečné je znát klávesové zkratky Shift + F7 k přesunu do návrháře a Ctrl + Alt + 0 k přesunu do kódu. Musí se jednat o nulu na alfanumerické klávesnici (tu vlevo).

Přesuňte se do kódu formuláře, který vypadá asi takto (vynechal jsem počáteční usingy):

namespace HelloForms
{
    public partial class PozdravForm : Form
    {
        public PozdravForm()
        {
            InitializeComponent();
        }
    }
}

Vidíme, že formulář je třída dědící z třídy Form. Nikde zde není ani památky po tom, co jsme naklikali, pouze v konstruktoru se volá podivná metoda InitializeComponent().

Třída je označená jako partial, což znamená, že je definována ve více souborech. Konkrétně existuje ještě soubor PozdravForm.Designer.cs, který obsahuje již méně přehledný kód, který se automaticky generuje tím, jak v návrháři klikáme.

Tento kód je schválně oddělen do dalšího souboru, aby nedělal zdrojový kód formuláře nepřehledným. Do souboru Designer.cs nikdy ručně nezasahujte a vlastně byste o jeho existenci ani nemuseli vědět. Ukažme si ale jeho obsah, abychom pochopili, jak aplikace funguje:

namespace HelloForms
{
    partial class PozdravForm
    {
        /// <summary>
        /// Required designer variable.
        /// </summary>
        private System.ComponentModel.IContainer components = null;

        /// <summary>
        /// Clean up any resources being used.
        /// </summary>
        /// <param name="disposing">true if managed resources should be disposed; otherwise, false.</param>
        protected override void Dispose(bool disposing)
        {
            if (disposing && (components != null))
            {
                components.Dispose();
            }
            base.Dispose(disposing);
        }

        #region Windows Form Designer generated code

        /// <summary>
        /// Required method for Designer support - do not modify
        /// the contents of this method with the code editor.
        /// </summary>
        private void InitializeComponent()
        {
            this.label1 = new System.Windows.Forms.Label();
            this.SuspendLayout();
            //
            // label1
            //
            this.label1.AutoSize = true;
            this.label1.Location = new System.Drawing.Point(75, 32);
            this.label1.Name = "label1";
            this.label1.Size = new System.Drawing.Size(135, 17);
            this.label1.TabIndex = 0;
            this.label1.Text = "Pozdrav z formuláře";
            //
            // Form1
            //
            this.AutoScaleDimensions = new System.Drawing.SizeF(8F, 16F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.ClientSize = new System.Drawing.Size(282, 80);
            this.Controls.Add(this.label1);
            this.Name = "Form1";
            this.Text = "Pozdrav";
            this.ResumeLayout(false);
            this.PerformLayout();

        }

        #endregion

        private System.Windows.Forms.Label label1;
    }
}

V kódu vidíme onu skrytou metodu InitializeComponent(), která nedělá nic jiného, než že vytvoří postupně všechny prvky na formuláři a nastaví jim patřičné vlastnosti, které jsme zvolili. Vidíme zde, jak se tvoří náš label a nastavují se mu vlastnosti. Metoda se poté volá v konstruktoru, čímž se formulář inicializuje. Nezasvěcený programátor je tedy úplně odstíněn od kódu, co generuje návrhář. Je to samozřejmě hlavně proto, aby ho nemohl rozbít Nicméně je důležité vědět, jak to funguje, abyste byli schopni např. přidávat ovládací prvky za běhu aplikace nebo opravit chyby v souboru, co designer generuje.

Dnešní projekt je ke stažení v příloze článku včetně zdrojových kódu, bude tomu tak vždy. Pokud vám něco nešlo, můžete si najít chybu.

V příští lekci, Jednoduchá kalkulačka v C# .NET Windows Forms, si vysvětlíme, jak fungují události a naprogramujeme si jednoduchou kalkulačku.

Měl jsi s čímkoli problém? Stáhni si vzorovou aplikaci níže a porovnej ji se svým projektem, chybu tak snadno najdeš.