Esercitazione: Personalizzare un'app WinForms per quiz matematici

In questa serie di quattro esercitazioni si creerà un quiz matematico. Il quiz contiene quattro problemi matematici casuali che un quiz taker tenta di rispondere entro un determinato periodo di tempo.

Questa esercitazione illustra come migliorare il quiz cancellando i valori predefiniti e personalizzando l'aspetto dei controlli.

In questa esercitazione finale si apprenderà come:

• Aggiungere gestori eventi per cancellare i valori predefiniti del controllo NumericUpDown.
• Personalizzare il quiz.

Prerequisiti

Questa esercitazione si basa sulle esercitazioni precedenti, a partire da Creare un'app WinForms per quiz matematici. Se queste esercitazioni non sono state completate, eseguire prima di tutto queste esercitazioni.

Aggiungere gestori eventi per i controlli NumericUpDown

Il quiz contiene NumericUpDown controlli usati dai gestori di quiz per immettere i numeri. Quando si immette una risposta, è necessario selezionare prima o eliminare manualmente il valore predefinito. Aggiungendo un Enter gestore eventi, è possibile semplificare l'immissione delle risposte. Questo codice seleziona e cancella il valore corrente in ogni controllo NumericUpDown non appena il quiz taker lo seleziona e inizia a immettere un valore diverso.

1. Selezionare il primo controllo NumericUpDown nel modulo. Nella finestra di dialogo Proprietà selezionare l'icona Eventi sulla barra degli strumenti.

   

   Nella scheda Eventi in Proprietà vengono visualizzati tutti gli eventi a cui è possibile rispondere per l'elemento selezionato nel modulo. In questo caso, tutti gli eventi elencati riguardano il controllo NumericUpDown.

2. Selezionare l'evento Invio , immettere answer_Enter e quindi premere INVIO.

   

   Viene visualizzato l'editor di codice e viene visualizzato il gestore eventi Enter creato per il controllo NumericUpDown somma .

3. Nel metodo per il gestore eventi answer_Enter aggiungere il codice seguente:

   C#

   private void answer_Enter(object sender, EventArgs e)
   {
       // Select the whole answer in the NumericUpDown control.
       NumericUpDown answerBox = sender as NumericUpDown;
   
       if (answerBox != null)
       {
           int lengthOfAnswer = answerBox.Value.ToString().Length;
           answerBox.Select(0, lengthOfAnswer);
       }
   }
   

   VB

   ''' <summary> 
   ''' Modify the behavior of the NumericUpDown control
   ''' to make it easier to enter numeric values for
   ''' the quiz.
   ''' </summary> 
   Private Sub answer_Enter(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles sum.Enter
   
       ' Select the whole answer in the NumericUpDown control.
       Dim answerBox = TryCast(sender, NumericUpDown)
   
       If answerBox IsNot Nothing Then
           Dim lengthOfAnswer = answerBox.Value.ToString().Length
           answerBox.Select(0, lengthOfAnswer)
       End If
   
   End Sub
   

---

Importante

Usare il controllo del linguaggio di programmazione in alto a destra di questa pagina per visualizzare il frammento di codice C# o il frammento di codice Visual Basic.

In questo codice:

• La prima riga dichiara il metodo . Include un parametro denominato sender. In C# il parametro è object sender. In Visual Basic è sender As System.Object. Questo parametro fa riferimento all'oggetto di cui viene generato l'evento, noto come mittente. In questo caso l'oggetto mittente è il controllo NumericUpDown.
• La prima riga all'interno del metodo esegue il cast o converte il mittente da un oggetto generico a un controllo NumericUpDown. Tale riga assegna anche il nome answerBox al controllo NumericUpDown. Tutti i controlli NumericUpDown nel modulo useranno questo metodo, non solo il controllo del problema di addizione.
• La riga successiva verifica se answerBox è stato eseguito correttamente come controllo NumericUpDown.
• La prima riga all'interno dell'istruzione if determina la lunghezza della risposta attualmente presente nel controllo NumericUpDown.
• La seconda riga all'interno dell'istruzione if usa la lunghezza della risposta per selezionare il valore corrente nel controllo .

Quando il quiz taker seleziona il controllo, Visual Studio genera questo evento. Questo codice seleziona la risposta corrente. Non appena il quiz taker inizia a immettere una risposta diversa, la risposta corrente viene cancellata e sostituita con la nuova risposta.

1. In progettazione Windows Form selezionare di nuovo il controllo NumericUpDown del problema di addizione.

2. Nella pagina Eventi della finestra di dialogo Proprietà individuare l'evento Click e quindi selezionare answer_Enter dal menu a discesa. Questo gestore eventi è quello appena aggiunto.

3. In Progettazione Windows Form selezionare il controllo NumericUpDown del problema di sottrazione.

4. Nella pagina Eventi della finestra di dialogo Proprietà individuare l'evento Invio e quindi selezionare answer_Enter dal menu a discesa. Questo gestore eventi è quello appena aggiunto. Ripetere questo passaggio per l'evento Click .

5. Ripetere i due passaggi precedenti per i controlli NumericUpDown di moltiplicazione e divisione.

Eseguire l'app

1. Salvare ed eseguire il programma.

2. Avviare un quiz e selezionare un controllo NumericUpDown. Il valore esistente viene selezionato automaticamente e quindi cancellato quando si inizia a immettere un valore diverso.

   

Personalizzare il quiz

In questa ultima parte dell'esercitazione si esamineranno alcuni modi per personalizzare il quiz ed espandere ciò che si è appreso.

Modificare il colore di un'etichetta

• Utilizzare la proprietà BackColor del controllo timeLabel per trasformare questa etichetta in rosso quando rimangono solo cinque secondi in un quiz.

  C#

  timeLabel.BackColor = Color.Red;
  

  VB

  timeLabel.BackColor = Color.Red
  

• Reimpostare il colore quando il quiz è terminato.

Riprodurre un suono per una risposta corretta

Fornire un suggerimento all'esecutore del quiz riproducendo un suono quando viene immessa la risposta corretta in un controllo NumericUpDown. Per implementare questa funzionalità, scrivere un gestore eventi per l'evento di ValueChanged ogni controllo. Questo tipo di evento viene generato ogni volta che un controllore del quiz modifica il valore del controllo.

Passaggi successivi

Complimenti. Questa serie di esercitazioni è stata completata. Queste attività di programmazione e progettazione sono state completate nell'IDE di Visual Studio:

• Creazione di un progetto di Visual Studio che usa Windows Form
• Aggiunta di etichette, un pulsante e controlli NumericUpDown
• Aggiunta di un timer
• Configurare i gestori eventi per i controlli
• Codice C# o Visual Basic scritto per gestire gli eventi

Continuare a imparare con un'altra serie di esercitazioni su come creare un gioco corrispondente.

Esercitazione 3: Creare un gioco corrispondente