Vydělávej až 160.000 Kč měsíčně! Akreditované rekvalifikační kurzy s garancí práce od 0 Kč. Více informací.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

2. diel - Jednoduchá kalkulačka v C # .NET Windows Forms

V minulej lekcii, Úvod do Windows Forms aplikácií , sme si uviedli technológiu Windows Forms a vytvorili okno s textovým popisom. V dnešnom C# .NET tutoriálu sa pozrieme na udalosti a vytvoríme jednoduchú kalkulačku. Bude vyzerať takto:

Kalkulačka v C# .NET v oknu - Okenné aplikácie v C # .NET vo Windows Forms

Príprava formulára

Založte si nový Windows Forms projekt s názvom Kalkulacka. Formulár premenujeme na KalkulackaForm. Pri aplikáciách sa väčšinou začína práve návrhom formulára. Z Toolbox na neho natiahneme niekoľko ovládacích prvkov. Budeme potrebovať:

  • 2x Label
  • 1x Button
  • 2x NumericUpDown
  • 1x ComboBox

Label

Label už poznáme, jedná sa jednoducho o textový popis.

Ak ovládacie prvky nepoužívame z kódu, nemusíme ich pomenovávať. Ak áno, mali by sme im nastaviť vlastnosť Name (v oknu Properties je názov vlastnosti v zátvorke (Name)) a cez toto meno k prvku potom z kódu pristúpime. Odporúčam si prepnúť zobrazenie vlastností z kategórií, na abecedný (prvé 2 ikonky v Properties oknu), vlastnosti nájdete rýchlejšie. Name je teda meno objektu, Text je to, čo je na objekte napísané. Z toho logicky vyplýva, že na formulári môžeme mať viac prvkov s rovnakým textom, ale len jeden s určitým menom.

Jeden label bude slúžiť len ako návestie s textom "=", nastavte mu ho. Druhý Label bude slúžiť pre výpis výsledku a keďže do neho budeme programovo vkladať hodnotu, nastavíme jeho vlastnosť Name na vysledekLabel. Text nastavíme na hodnotu "0". Font výsledku môžeme zväčšiť na veľkosť 10.

Button

Button je jednoducho tlačidlo, ktoré v prípade stisku zavolá nejakú metódu (presnejšie vyvolá udalosť). V našom prípade sa bude tlačidlo menovať vypocitejButton a jeho Text bude nastavený na "Vypočítej". Udalosť tlačidlu priradíme neskôr.

NumericUpDown

NumericUpDown je prvý ovládací prvok na zadávanie hodnoty, ktorý si uvedieme. V predvolenom nastavení do neho môžeme zadať len celé číslo. Toto správanie možno zmeniť nastavením vlastnosti DecimalPlaces, ktorá udáva počet desatinných miest. Túto hodnotu nastavme na 2 oboma ovládacím prvkom. Tiež nastavíme vlastnosti Minimum a Maximum, v našom prípade minimum na nejakú nízku hodnotu a maximum na nejakú vysokú, napr. -1000000 a 1000000. Ak by sme chceli využiť maximálne hodnoty daného dátového typu, musíme limity nastaviť v kóde formulára pomocou vlastnosti MaxValue a MinValue na danom dátovom typu.

Výhodou zadávanie čísel týmto ovládacím prvkom je, že užívateľ nemôže zadať nezmyselnú hodnotu. Ak by sme číslo parsovali z prvku TextBox (ktorý si ukážeme v ďalších lekciách), mohla by naše aplikácie pri nevalidním vstupe spadnúť. Je vždy jednoduchšie vybrať správny ovládací prvok ako ošetrovať užívateľský vstup.

Prvky pomenujeme ako cislo1NumericUpDown a cislo2NumericUpDown. Všimnite si, že meno by malo vždy obsahovať aj typ ovládacieho prvku. Môžeme tak mať napr. vekLabel a vekNumericUpDown, kedy label je label pole na zadanie veku a numericUpDown je potom toto pole. Navyše sa v kóde potom lepšie orientuje. Niekedy sa používa aj cisloNmr, vypocitejBtn a podobne.

ComboBox

Sme skoro v cieli. ComboBox je Výjazdný zoznam s niekoľkými preddefinovanými prvkami. Prvky môžeme buď naklikať v návrhári alebo vložiť z kódu a to aj za behu programu. Toto platí pre všetky komponenty, všetky vlastnosti z návrhára môžeme nastavovať iz kódu. Niektoré pokročilé vlastnosti idú však nastaviť len z kódu a v návrhári nie sú.

Ovládací prvok pomenujeme operaceComboBox au vlastnosti Items klikneme na tlačidlo "...". Do novo otvoreného okna vypíšeme možnosti, ktoré v combobox pôjdu vybrať. Každú možnosť zapíšeme na samostatný riadok, v našom prípade to budú hodnoty +, -, *, /.

Položky combobox zo C# .NET vo Visual Studio - Okenné aplikácie v C # .NET vo Windows Forms

Položkami nemusí byť len textové reťazce, ale aj objekty. Ukážeme si to neskôr.

Vybranú položku možno bohužiaľ nastaviť len z kódu.

Nastavené ovládacie prvky usporiadame na formulár tak, ako bolo uvedené na začiatku článku.

Kód formulára

Presunieme sa do zdrojového kódu formulára. Už vieme, že to urobíme skratkou Ctrl + Alt + 0 alebo kliknutím pravým tlačidlom myši na formulár a zvolením možnosti View Code.

V konstruktoru formuláre hneď po zavolaní InitializeComponents() nastavíme vybranú položku pre operaceComboBox. Urobíme to nastavením vlastnosti SelectedIndex na 0, teda prvú položku:

public KalkulackaForm()
{
    InitializeComponent();
    operaceComboBox.SelectedIndex = 0;
}

Z formulára máme samozrejme prístup ku všetkým jeho prvkom.

Do konstruktoru vkladáme ten kód, ktorý sa má vykonať po vytvorení formulára, ale to je snáď jasné. Keď aplikáciu spustíte, bude vybrané sčítanie:

Vybranie položky combobox v C# .NET - Okenné aplikácie v C # .NET vo Windows Forms

Obsluha udalostí

Zostáva nám teda už len reagovať na udalosť kliknutí tlačidla. Presunieme sa z kódu späť na formulár a na tlačidlo 2x klikneme. V kóde nám pribudla nová metóda:

private void vypocitejButton_Click(object sender, EventArgs e)
{

}

Ak ste dočítali tunajšie objektový kurz C# .NET, hlavička metódy vám bude nápadne pripomínať EventHandler. V súbore KalkulackaForm.Designer.cs by sme našli kód, ktorý udalosti tlačidla prideľuje práve túto metódu. Ak ste predchádzajúcom vetám nerozumeli, vôbec to nevadí. Bude vám stačiť, že sa táto metóda spustí v prípade, keď sa na tlačidlo klikne.

Vráťme sa ešte do Designeri (klávesa Shift + F7) a označme tlačidlo. V oknu Properties môžeme prepínať medzi vlastnosťami a udalosťami a to pomocou nižšie zvýraznených tlačidiel:

Udalosti vo Visual Studio - Okenné aplikácie v C # .NET vo Windows Forms

Vidíme tu našej udalosť Click, ktorú odtiaľto môžeme odstrániť a prípadne znovu pridať. Niektoré ovládacie prvky majú špeciálne udalosti, pre ktoré vygenerujeme metódy práve odtiaľ.

Nikdy neodstraňujte udalosti tak, že vymažete obslužnú metódu z kódu, designer by prestal fungovať a museli by ste jeho súbor opraviť (konkrétne odstrániť priradenie neexistujúce metódy do udalosti). Správne je to jedine cez designer.

Výpočet

Prejdime k samotnému výpočtu. Kód nebude nijako zložitý, jednoducho v obslužnej metóde tlačidla naifujeme vybrané položky operaceComboBox a podľa toho vypočítame výsledok. Ten potom nastavíme ako text vysledekLabel. Nemali by sme zabudnúť ošetriť delenie nulou.

Kód obslužné metódy by mohol vyzerať takto:

private void vypocitejButton_Click(object sender, EventArgs e)
{
    // příprava proměnných
    string operace = operaceComboBox.SelectedItem.ToString();
    double cislo1 = Convert.ToDouble(cislo1NumericUpDown.Value);
    double cislo2 = Convert.ToDouble(cislo2NumericUpDown.Value);
    double vysledek = 0;

    // výpočet
    if (operace == "+")
        vysledek = cislo1 + cislo2;
    else if (operace == "-")
        vysledek = cislo1 - cislo2;
    else if (operace == "*")
        vysledek = cislo1 * cislo2;
    else if (operace == "/")
    {
        if (cislo2 != 0)
            vysledek = cislo1 / cislo2;
        else
            MessageBox.Show("Nulou nelze dělit");
    }
    vysledekLabel.Text = vysledek.ToString();
}

Najprv si uložíme hodnoty z ovládacích prvkov do premenných, je to tak prehľadnejšie. K vybranej položke ComboBox sa dostaneme cez SelectedItem, ktorý je typu object. V našom prípade ho musíme previesť na string. Rovnako tak by sme mohli pracovať aj s jednoduchým číslom položky cez SelectedIndex. Keďže NumericUpDown vracia hodnotu vo vlastnosti Value, ktorá je typu decimal, musíme ju previesť na double pomocou triedy Convert.

V prípade nulového deliteľa zobrazujeme užívateľovi MessageBox pomocou rovnomennej statickej triedy a metódy Show(). Nakoniec do vysledekLabel vypíšeme výsledok. Na rozdiel od konzoly, kde šlo jednoducho vypísať aj čísla, tu musíme číslo najprv previesť na string.

Formulári ešte môžeme nastaviť ikonu cez vlastnosť Icon (vyberieme súbor s ikonkou), Text nastavíme na "Kalkulačka" a StartPosition na CenterScreen. Formulár sa tak vytvorí uprostred obrazovky. Ak nastavíme FormBorderStyle na hodnotu FixedSingle, nepôjde formulár rozťahovať, čo sa pre našu aplikáciu hodí. Rovnako tak môžeme zakázať maximalizáciu okna pomocou vlastnosti MaximizeBox.

Kód je ako vždy v prílohe. V budúcej lekcii, Riešené úlohy k 1.-2. lekciu Windows Forms v C # .NET , si vytvoríme zložitejšie aplikáciu s viacerými formulármi, bude sa jednať o pripomínač narodenín.

V nasledujúcom cvičení, Riešené úlohy k 1.-2. lekciu Windows Forms v C # .NET, si precvičíme nadobudnuté skúsenosti z predchádzajúcich lekcií.


 

Mal si s čímkoľvek problém? Stiahni si vzorovú aplikáciu nižšie a porovnaj ju so svojím projektom, chybu tak ľahko nájdeš.

Stiahnuť

Stiahnutím nasledujúceho súboru súhlasíš s licenčnými podmienkami

Stiahnuté 1673x (108.67 kB)
Aplikácia je vrátane zdrojových kódov v jazyku C#

 

Predchádzajúci článok
Úvod do Windows Forms aplikácií
Všetky články v sekcii
Okenné aplikácie v C # .NET vo Windows Forms
Preskočiť článok
(neodporúčame)
Riešené úlohy k 1.-2. lekciu Windows Forms v C # .NET
Článok pre vás napísal David Hartinger
Avatar
Užívateľské hodnotenie:
1 hlasov
David je zakladatelem ITnetwork a programování se profesionálně věnuje 15 let. Má rád Nirvanu, nemovitosti a svobodu podnikání.
Unicorn university David sa informačné technológie naučil na Unicorn University - prestížnej súkromnej vysokej škole IT a ekonómie.
Aktivity