Esercitazione: Aggiungere codice all'app di Windows Forms per il visualizzatore di immagini (.NET Framework)

In questa serie di tre esercitazioni viene creata un'applicazione Windows Form che carica un'immagine e la visualizza. L'IDE (Integrated Design Environment) di Visual Studio fornisce gli strumenti necessari per creare l'app.

I controlli usano codice C# o Visual Basic per eseguire le azioni associate.

In questa terza esercitazione si apprenderà come:

Aggiungere gestori eventi per i controlli
Scrivere codice per aprire una finestra di dialogo
Scrivere codice per gli altri controlli
Eseguire l'applicazione

Per creare una nuova app Windows Form con .NET, seguire l'esercitazione Creare un'app Windows Form con .NET. Consulta la Guida Desktop su Windows Forms .NET per ulteriori informazioni.

Prerequisiti

Questa esercitazione si basa sulle esercitazioni precedenti, Creare un'applicazione visualizzatore immagini e Aggiungere controlli dell'interfaccia utente al visualizzatore immagini. Completarli prima e iniziare con il progetto creato per tali esercitazioni.

Aggiungere gestori eventi per i controlli

In questa sezione, aggiungete gestori eventi per i controlli che avete aggiunto nella seconda esercitazione, Aggiungere controlli a un'applicazione visualizzatore di immagini. L'applicazione chiama un gestore eventi quando viene eseguita un'azione, ad esempio la selezione di un pulsante.

Apri Visual Studio. Il progetto Visualizzatore immagini si trova in Apri recenti.
Nel Progettazione di Windows Forms, fare doppio clic sul pulsante Mostra un'immagine. È invece possibile selezionare il pulsante Mostra un'immagine nel modulo e quindi premere INVIO.

L'IDE di Visual Studio apre una scheda nella finestra principale. Per C#, la scheda è denominata Form1.cs. Se si usa Visual Basic, la scheda è denominata Form1.vb.

In questa scheda viene visualizzato il file di codice dietro il modulo.

Nota

La scheda Form1.vb potrebbe visualizzare showButton come ShowButton.

Concentrarsi su questa parte del codice.

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

Private Sub showButton_Click() Handles showButton.Click

End Sub

Scegliere di nuovo la scheda Windows Forms Designer, quindi fare doppio clic sul pulsante Cancella l'immagine per aprire il codice. Ripetere per i due pulsanti rimanenti. Ogni volta, l'IDE di Visual Studio aggiunge un nuovo metodo al file di codice del modulo.

Fare doppio clic sul controllo CheckBox in progettazione Windows Forms per aggiungere un metodo checkBox1_CheckedChanged(). Quando si seleziona o si deseleziona la casella di controllo, questo metodo viene chiamato.

Il frammento di codice seguente mostra il nuovo codice visualizzato nell'editor di codice.

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)
{
}

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

I metodi, inclusi i gestori eventi, possono avere qualsiasi nome desiderato. Quando si aggiunge un gestore eventi con l'IDE, viene creato un nome in base al nome del controllo e all'evento gestito.

Ad esempio, l'evento Click per un pulsante denominato showButton viene chiamato showButton_Click() o ShowButton_Click(). Per modificare il nome di una variabile di codice, fare clic con il pulsante destro del mouse sulla variabile nel codice e scegliere Refactor>Rinomina. Questa azione rinomina tutte le istanze di tale variabile nel codice. Per ulteriori informazioni, vedere Rinomina e ristrutturazione.

Scrivere codice per aprire una finestra di dialogo

Il pulsante Mostra un'immagine usa il componente OpenFileDialog per visualizzare un file immagine. Questa procedura aggiunge il codice usato per chiamare tale componente.

L'IDE di Visual Studio offre uno strumento potente denominato IntelliSense. Durante la digitazione, IntelliSense suggerisce il codice possibile.

In Designer di Windows Form, fare doppio clic sul pulsante Mostra un'immagine. L'IDE sposta il cursore all'interno del metodo showButton_Click() o ShowButton_Click().
Digitare un i sulla riga vuota tra le due parentesi graffe { }o tra Private Sub... e End Sub. Viene visualizzata una finestra di IntelliSense.
La finestra di IntelliSense deve evidenziare la parola if. Selezionare il tasto tab due volte per inserire il frammento di if.
Selezionare true e quindi digitare op per sovrascriverlo per C# o Op per Visual Basic.

IntelliSense visualizza openFileDialog1.
Seleziona Tab per aggiungere openFileDialog1.
Digitare un punto (.) o punto, immediatamente dopo openFileDialog1. IntelliSense fornisce tutte le proprietà e i metodi del componente OpenFileDialog. Iniziare a digitare ShowDialog e selezionare scheda. Il metodo ShowDialog() mostra la finestra di dialogo apri file.
Aggiungere parentesi () immediatamente dopo "g" in ShowDialog. Il codice deve essere openFileDialog1.ShowDialog().
Per C#, aggiungere uno spazio e quindi aggiungere due segni di uguale (==). Per Visual Basic, aggiungere uno spazio e quindi usare un singolo segno di uguale (=).
Aggiungere un altro spazio. Usare IntelliSense per immettere DialogResult.
Digitare un punto per aprire il valore DialogResult nella finestra di IntelliSense. Immettere la lettera O e scegliere la scheda tasto per inserire OK.

Nota

La prima riga di codice deve essere completata. Per C#, dovrebbe essere simile al seguente.

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

Per Visual Basic, deve essere il seguente.

If OpenFileDialog1.ShowDialog() = DialogResult.OK Then

Aggiungere la riga di codice seguente.

pictureBox1.Load(openFileDialog1.FileName);

PictureBox1.Load(OpenFileDialog1.FileName)

È possibile copiare e incollare o usare IntelliSense per aggiungerlo. Il metodo showButton_Click() finale dovrebbe essere simile al codice seguente.

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

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

End Sub

Aggiungere il commento seguente al codice.

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);
    }
}

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

È una buona pratica commentare sempre il proprio codice. I commenti di codice semplificano la comprensione e la gestione del codice in futuro.

Scrivere codice per gli altri controlli

Se si esegue ora l'applicazione, è possibile selezionare Mostra un'immagine. Visualizzatore immagini apre la finestra di dialogo Apri File, in cui è possibile selezionare un'immagine da visualizzare.

In questa sezione aggiungere il codice per gli altri gestori eventi.

In Progettazione Windows Formfare doppio clic sul pulsante Cancella'immagine. Per C#, aggiungere il codice tra parentesi graffe. Per Visual Basic, aggiungere il codice tra Private Sub e End Sub.

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

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

Fai doppio clic sul pulsante 'Imposta il colore di sfondo' e aggiungi il codice.

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

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

Fare doppio clic sul pulsante Chiudi e aggiungere il codice.

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

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

Fare doppio clic sulla casella di controllo Stretch e aggiungere il codice.

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

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

Eseguire l'applicazione

È possibile eseguire l'applicazione in qualsiasi momento durante la scrittura. Dopo aver aggiunto il codice nella sezione precedente, il Visualizzatore immagini è completo. Come nelle esercitazioni precedenti, usare uno dei metodi seguenti per eseguire l'applicazione:

Selezionare il tasto F5.
Nella barra dei menu selezionare Debug>Avvia debug.
Nella barra degli strumenti, selezionare il pulsante Start.

Viene visualizzata una finestra con il titolo Visualizzatore immagini. Testare tutti i controlli.

Selezionare il Pulsante per impostare il colore di sfondo. Verrà visualizzata la finestra di dialogo Colore.
Scegliere un colore per impostare il colore di sfondo.
Selezionare Mostra un'immagine per visualizzare un'immagine.
Seleziona e deseleziona Stretch.
Selezionare il pulsante Cancella immagine per assicurarsi che lo schermo venga pulito.
Selezionare Chiudi per uscire dall'app.

Felicitazioni! Hai completato questa serie di esercitazioni. Queste attività di programmazione e progettazione sono state eseguite nell'IDE di Visual Studio:

Creazione di un progetto di Visual Studio che usa Windows Form
Aggiunto il layout per l'applicazione di visualizzazione delle immagini
Pulsanti aggiunti e una casella di controllo
Aggiunte finestre di dialogo
Aggiunti gestori eventi per i controlli
Codice C# o Visual Basic scritto per gestire gli eventi

Passaggio successivo

Continuare a imparare con un'altra serie di esercitazioni su come creare un quiz matematico a tempo.

Esercitazione 2: Creare un quiz matematico a tempo

Commenti e suggerimenti

Questa pagina è stata utile?

Last updated on 2025-08-07