Kurz: Přidání kódu do prohlížeče obrázků model Windows Forms aplikace v sadě Visual Studio

V této sérii tří kurzů vytvoříte model Windows Forms aplikaci, která načte obrázek a zobrazí ji. Integrované vývojové prostředí (IDE) sady Visual Studio poskytuje nástroje, které potřebujete k vytvoření aplikace. Další informace najdete v tématu Vítá vás integrované vývojové prostředí sady Visual Studio.

Ovládací prvky používají kód jazyka C# nebo Visual Basic k provádění akcí přidružených k nim.

V tomto třetím kurzu se naučíte:

• Přidání obslužných rutin událostí pro ovládací prvky
• Napsání kódu pro otevření dialogového okna
• Psaní kódu pro ostatní ovládací prvky
• Spusťte aplikaci

Požadavky

Tento kurz vychází z předchozích kurzů, vytvoří aplikaci prohlížeče obrázků a přidá do prohlížeče obrázků ovládací prvky uživatelského rozhraní. Pokud jste tyto kurzy ještě neudělali, projděte si je jako první.

Přidání obslužných rutin událostí pro ovládací prvky

V této části přidejte obslužné rutiny událostí pro ovládací prvky, které jste přidali v druhém kurzu, Přidání ovládacích prvků do aplikace prohlížeče obrázků. Aplikace volá obslužnou rutinu události, když se provede akce, například výběr tlačítka.

1. Otevřete sadu Visual Studio. Projekt Prohlížeč obrázků se zobrazí v části Otevřít poslední.

2. V návrháři model Windows Forms poklikejte na tlačítko Zobrazit obrázek. Místo toho můžete vybrat tlačítko Zobrazit obrázek ve formuláři a pak stisknout Enter.

   Integrované vývojové prostředí sady Visual Studio otevře kartu v hlavním okně. V jazyce C# má karta název Form1.cs. Pokud používáte Visual Basic, karta má název Form1.vb.

   Tato karta zobrazuje soubor kódu za formulářem.

   

   Poznámka:

   Karta Form1.vb může zobrazit showButton jako ShowButton.

3. Zaměřte se na tuto část kódu.

   C#

   private void showButton_Click(object sender, EventArgs e)
   {
   }
   

   VB

   Private Sub showButton_Click() Handles showButton.Click
   
   End Sub
   

   Důležité

   Pomocí ovládacího prvku programovacího jazyka v pravém horním rohu této stránky můžete zobrazit fragment kódu jazyka C# nebo fragment kódu jazyka Visual Basic.
   
   

4. Znovu zvolte kartu model Windows Forms Návrhář a potom poklikejte na tlačítko Vymazat obrázek a otevřete jeho kód. Opakujte pro zbývající dvě tlačítka. Integrované vývojové prostředí sady Visual Studio pokaždé přidá novou metodu do souboru kódu formuláře.

5. Poklikejte na ovládací prvek CheckBox v návrháři model Windows Forms přidat metoducheckBox1_CheckedChanged(). Když toto políčko zaškrtnete nebo zrušíte jeho zaškrtnutí, zavolá se tato metoda.

   Následující fragment kódu ukazuje nový kód, který vidíte v editoru kódu.

   C#

   private void clearButton_Click(object sender, EventArgs e)
   {
   }
   
   private void backgroundButton_Click(object sender, EventArgs e)
   {
   }
   
   private void closeButton_Click(object sender, EventArgs e)
   {
   }
   
   private void checkBox1_CheckedChanged(object sender, EventArgs e)
   {
   }
   

   VB

   Private Sub clearButton_Click() Handles clearButton.Click
   
   End Sub
   
   Private Sub backgroundButton_Click() Handles backgroundButton.Click
   
   End Sub
   
   Private Sub closeButton_Click() Handles closeButton.Click
   
   End Sub
   
   Private Sub CheckBox1_CheckedChanged() Handles CheckBox1.CheckedChanged
   
   End Sub
   

---

Metody, včetně obslužných rutin událostí, můžou mít libovolný název. Když přidáte obslužnou rutinu události s integrovaným vývojovém prostředím (IDE), vytvoří název na základě názvu ovládacího prvku a zpracovávané události.

Například událost Click pro tlačítko s názvem showButton je volána showButton_Click() nebo ShowButton_Click(). Pokud chcete změnit název proměnné kódu, klikněte pravým tlačítkem myši na proměnnou v kódu a pak zvolte Refaktor>přejmenovat. Všechny instance této proměnné v kódu se přejmenují. Další informace naleznete v tématu Přejmenování refaktoringu.

Napsání kódu pro otevření dialogového okna

Tlačítko Zobrazit obrázek používá komponentu OpenFileDialog k zobrazení souboru obrázku. Tento postup přidá kód použitý k volání této komponenty.

Integrované vývojové prostředí sady Visual Studio nabízí výkonný nástroj s názvem IntelliSense. Při psaní intelliSense navrhuje možný kód.

1. V návrháři model Windows Forms poklikejte na tlačítko Zobrazit obrázek. Integrované vývojové prostředí přesune kurzor uvnitř showButton_Click() metody nebo ShowButton_Click() metody.

2. Zadejte na prázdný řádek mezi těmito dvěma složenými závorkami { }nebo mezi Private Sub... a End Sub. Otevře se okno IntelliSense .

   

3. Okno IntelliSense by mělo zvýraznit slovo if. Vyberte klávesu Tab , která se má vložit if.

4. Vyberte true a potom zadejte op , pokud ho chcete přepsat pro jazyk C# nebo Op Visual Basic.

   

   IntelliSense zobrazí openFileDialog1.

5. Vyberte klávesu Tab a přidejte openFileDialog1.

6. Zadejte tečku (.) nebo tečku hned za openFileDialog1. IntelliSense poskytuje všechny vlastnosti a metody komponenty OpenFileDialog . Začněte psát ShowDialog a vybrat klávesu Tab. Metoda ShowDialog() zobrazí dialogové okno Otevřít soubor .

7. Přidejte závorky () bezprostředně za "g" v ShowDialog. Váš kód by měl být openFileDialog1.ShowDialog().

8. V jazyce C# přidejte mezeru a pak přidejte dvě znaménka rovná se (==). Pro Visual Basic přidejte mezeru a pak použijte jedno rovnítko (=).

9. Přidejte další mezeru. K zadání DialogResult použijte IntelliSense.

10. Zadejte tečku pro otevření hodnoty DialogResult v okně IntelliSense . Zadejte písmeno O a stisknutím klávesy Tab vložte ok.

    Poznámka:

    První řádek kódu by měl být dokončený. V jazyce C# by měl být podobný následujícímu.

    if (openFileDialog1.ShowDialog() == DialogResult.OK)

    Pro Visual Basic by měl být následující.

    If OpenFileDialog1.ShowDialog() = DialogResult.OK Then

11. Přidejte následující řádek kódu.

    C#

    pictureBox1.Load(openFileDialog1.FileName);  
    

    VB

    PictureBox1.Load(OpenFileDialog1.FileName)
    

    Můžete ho zkopírovat a vložit nebo použít IntelliSense k jeho přidání. Konečná showButton_Click() metoda by měla vypadat podobně jako následující kód.

    C#

    private void showButton_Click(object sender, EventArgs e)
    {
        if (openFileDialog1.ShowDialog() == DialogResult.OK)
        {
            pictureBox1.Load(openFileDialog1.FileName);  
        }
    }
    

    VB

    Private Sub showButton_Click() Handles showButton.Click
        If OpenFileDialog1.ShowDialog() = DialogResult.OK Then
            PictureBox1.Load(OpenFileDialog1.FileName)
        End If
    
    End Sub
    

---

1. Do kódu přidejte následující komentář.

   C#

   private void showButton_Click(object sender, EventArgs e)
   {
       // Show the Open File dialog. If the user clicks OK, load the
       // picture that the user chose.
       if (openFileDialog1.ShowDialog() == DialogResult.OK)
       {
           pictureBox1.Load(openFileDialog1.FileName);
       }
   }
   

   VB

   Private Sub showButton_Click() Handles showButton.Click
   
       ' Show the Open File dialog. If the user clicks OK, load the
       ' picture that the user chose.
       If OpenFileDialog1.ShowDialog() = DialogResult.OK Then
           PictureBox1.Load(OpenFileDialog1.FileName)
       End If
   
   End Sub
   

---

Osvědčeným postupem je vždy okomentovat kód. Komentáře ke kódu usnadňují pochopení a údržbu kódu v budoucnu.

Psaní kódu pro ostatní ovládací prvky

Pokud teď aplikaci spustíte, můžete vybrat Možnost Zobrazit obrázek. Prohlížeč obrázků otevře dialogové okno Otevřít soubor , kde můžete vybrat obrázek, který chcete zobrazit.

V této části přidejte kód pro ostatní obslužné rutiny událostí.

1. V návrháři model Windows Forms poklikejte na tlačítko Vymazat obrázek. Přidejte kód do složených závorek.

   C#

   private void clearButton_Click(object sender, EventArgs e)
   {
       // Clear the picture.
       pictureBox1.Image = null;
   }
   

   VB

   Private Sub clearButton_Click() Handles clearButton.Click
       ' Clear the picture.
       PictureBox1.Image = Nothing
   End Sub   
   

2. Poklikejte na tlačítko Nastavit barvu pozadí a přidejte kód do složených závorek.

   C#

   private void backgroundButton_Click(object sender, EventArgs e)
   {
       // Show the color dialog box. If the user clicks OK, change the
       // PictureBox control's background to the color the user chose.
       if (colorDialog1.ShowDialog() == DialogResult.OK)
           pictureBox1.BackColor = colorDialog1.Color;
   }
   

   VB

   Private Sub backgroundButton_Click() Handles backgroundButton.Click
       ' Show the color dialog box. If the user clicks OK, change the
       ' PictureBox control's background to the color the user chose.
       If ColorDialog1.ShowDialog() = DialogResult.OK Then
           PictureBox1.BackColor = ColorDialog1.Color
       End If
   End Sub
   

3. Poklikejte na tlačítko Zavřít a přidejte kód do složených závorek.

   C#

   private void closeButton_Click(object sender, EventArgs e)
   {
       // Close the form.
       this.Close();
   }
   
   

   VB

   Private Sub closeButton_Click() Handles closeButton.Click
       ' Close the form.
       Close()
   End Sub  
   

4. Poklikejte na zaškrtávací políčko Roztáhnout a přidejte kód do složených závorek.

   C#

   private void checkBox1_CheckedChanged(object sender, EventArgs e)
   {
       // If the user selects the Stretch check box, 
       // change the PictureBox's
       // SizeMode property to "Stretch". If the user clears 
       // the check box, change it to "Normal".
       if (checkBox1.Checked)
           pictureBox1.SizeMode = PictureBoxSizeMode.StretchImage;
       else
           pictureBox1.SizeMode = PictureBoxSizeMode.Normal;
   }
   

   VB

   Private Sub CheckBox1_CheckedChanged() Handles CheckBox1.CheckedChanged
       ' If the user selects the Stretch check box, change 
       ' the PictureBox's SizeMode property to "Stretch". If the user 
       ' clears the check box, change it to "Normal".
       If CheckBox1.Checked Then
           PictureBox1.SizeMode = PictureBoxSizeMode.StretchImage
       Else
           PictureBox1.SizeMode = PictureBoxSizeMode.Normal
       End If
   End Sub   
   

Spusťte aplikaci

Aplikaci můžete kdykoli spustit, i když ji píšete. Po přidání kódu v předchozí části se prohlížeč obrázků dokončí. Stejně jako v předchozích kurzech použijte k spuštění aplikace jednu z následujících metod:

• Vyberte klávesu F5 .
• Na řádku nabídek vyberte Spustit>ladění.
• Na panelu nástrojů vyberte tlačítko Start .

Zobrazí se okno s názvem Prohlížeč obrázků. Otestujte všechny ovládací prvky.

1. Vyberte tlačítko Nastavit barvu pozadí. Otevře se dialogové okno Barva .

   

2. Zvolte barvu, která nastaví barvu pozadí.

3. Výběrem možnosti Zobrazit obrázek zobrazíte obrázek.

   

4. Vyberte a zrušte výběr možnosti Roztažení.

5. Výběrem tlačítka Vymazat obrázek zkontrolujte, že se zobrazení vymaže.

6. Stisknutím klávesy Zavřít aplikaci ukončete.

Další kroky

Blahopřejeme! Dokončili jste tuto sérii kurzů. V integrovaném vývojovém prostředí sady Visual Studio jste provedli tyto úlohy programování a návrhu:

• Vytvořili jste projekt sady Visual Studio, který používá model Windows Forms
• Přidání rozložení pro aplikaci pro prohlížení obrázků
• Přidání tlačítek a zaškrtávacího políčka
• Přidání dialogových oken
• Přidání obslužných rutin událostí pro ovládací prvky
• Napsání kódu jazyka C# nebo Jazyka Visual Basic pro zpracování událostí

Pokračujte ve studiu s další řadou kurzů o tom, jak vytvořit časový matematický kvíz.

Kurz 2: Vytvoření matematického kvízu s časovým limitem