Passaggio 1: creare un progetto e aggiungere etichette al form

I passaggi iniziali dello sviluppo di questo quiz consistono nella creazione del progetto e nell'aggiunta di etichette, di un pulsante e di altri controlli a un modulo.Si impostano inoltre le proprietà di ogni controllo che si desidera aggiungere.Il progetto conterrà il modulo, i controlli e, più avanti nell'esercitazione, il codice.Il pulsante avvia il quiz, le etichette mostrano i problemi del quiz e gli altri controlli mostrano le risposte e il tempo rimanente per completarlo.

[!NOTA]

Questo argomento fa parte di una serie di esercitazioni sui concetti di codifica di base.Per una panoramica dell'esercitazione, vedere Esercitazione 2: creare un quiz matematico a tempo

Per creare un progetto e impostare le proprietà per un modulo

Sulla barra dei menu scegliere File, Nuovo, Progetto.
Nell'elenco Modelli installati scegliere C# o Visual Basic.
Nell'elenco di modelli scegliere il modello Applicazione Windows Form, assegnare a esso il nome Quiz matematico e scegliere il pulsante OK.

Verrà visualizzato un modulo con nome Form1.cs o Form1.vb, a seconda del linguaggio di programmazione scelto.
Scegliere il modulo e impostare la proprietà Text su Math Quiz.

La finestra Proprietà conterrà le proprietà per il modulo.
Impostare le dimensioni del modulo su 500 pixel di larghezza per 400 pixel di altezza.

È possibile ridimensionare il modulo trascinando i relativi bordi finché le dimensioni corrette non compaiono nell'angolo inferiore sinistro dell'ambiente di sviluppo integrato (IDE).In alternativa, è possibile modificare i valori della proprietà Size.
Impostare il valore della proprietà FormBorderStyle su Fixed3D e la proprietà MaximizeBox su False.

Questi valori impediranno agli esecutori del quiz di ridimensionare il modulo.

Per creare la casella Tempo rimanente

Aggiungere un controllo Label dalla casella degli strumenti e impostare il valore della proprietà (Name) su timeLabel.

Questa etichetta diventerà una casella nell'angolo superiore destro in cui verrà visualizzato il numero di secondi rimanenti per il quiz.
Impostare la proprietà AutoSize su False in modo da poter ridimensionare la casella.
Impostare la proprietà BorderStyle su FixedSingle per disegnare una riga intorno alla casella.
Impostare la proprietà Size su 200, 30.
Spostare l'etichetta nell'angolo superiore destro del modulo, dove verranno visualizzate righe dello spaziatore blu.

Queste righe consentono di allineare i controlli nel modulo.
Nella finestra Proprietà scegliere la proprietà Text e utilizzare BACKSPACE per cancellare il relativo valore.
Scegliere il segno più (+) accanto alla proprietà Font, quindi modificare il valore della proprietà Size su 15,75.

È possibile modificare diverse proprietà del tipo di carattere, come illustrato di seguito.

Finestra Proprietà con la dimensione del tipo di carattere visualizzata
Aggiungere un altro controllo Label dalla Casella degli strumenti e impostare la dimensione del tipo di carattere su 15,75.
Impostare la proprietà Text su Tempo rimanente.
Spostare l'etichetta in modo che risulti allineata a sinistra dell'etichetta timeLabel.

Per aggiungere controlli per i problemi di addizione

Aggiungere un controllo Label dalla Casella degli strumenti e impostare la relativa proprietà Text su ? (punto interrogativo).
Impostare la proprietà AutoSize su False.
Impostare la proprietà Size su 60, 50.
Impostare la dimensione del carattere su 18.
Impostare la proprietà TextAlign su MiddleCenter.
Impostare la proprietà Location su 50, 75 per posizionare il controllo sul modulo.
Impostare la proprietà (Name) su plusLeftLabel.
Scegliere l'etichetta plusLeftLabel, quindi premere CTRL+C o scegliere Copia dal menu Modifica.
Incollare l'etichetta tre volte premendo CTRL+V o scegliendo Incolla dal menu Modifica.
Disporre le tre nuove etichette in modo che risultino in fila a destra dell'etichetta plusLeftLabel.

È possibile utilizzare le righe dello spaziatore per distanziarle e allinearle.
Impostare il valore della proprietà Text della seconda etichetta su + (segno più).
Impostare il valore della proprietà (Name) della terza etichetta su plusRightLabel.
Impostare il valore della proprietà Text della quarta etichetta su = (segno di uguale).
Aggiungere un controllo NumericUpDown dalla Casella degli strumenti, impostare la dimensione del tipo di carattere su 18 e impostare la relativa larghezza su 100.

Più avanti verranno fornite ulteriori informazioni su questo tipo di controllo.
Allineare il controllo NumericUpDown ai controlli Label per il problema di addizione.
Impostare il valore della proprietà (Name) per il controllo NumericUpDown su somma.

È stata creata la prima riga, come illustrato di seguito.

Prima riga del quiz matematico

Per aggiungere controlli per i problemi di sottrazione, moltiplicazione e divisione

Copiare tutti e cinque i controlli per il problema di addizione (i quattro controlli Label e il controllo NumericUpDown) e incollarli.

Il modulo contiene cinque nuovi controlli, ancora selezionati.
Spostare tutti i controlli in modo che risultino allineati sotto i controlli di addizione.

È possibile utilizzare le righe dello spaziatore per distanziare adeguatamente le due righe.
Impostare il valore della proprietà Text per la seconda etichetta su - (segno meno).
Assegnare alla prima etichetta punto interrogativo il nome minusLeftLabel.
Assegnare alla seconda etichetta punto interrogativo il nome minusRightLabel.
Denominare il controllo NumericUpDowndifferenza.
Incollare i cinque controlli altre due volte.
Per la terza riga, assegnare alla prima etichetta il nome timesLeftLabel, impostare la proprietà Text della seconda etichetta su × (segno di moltiplicazione), assegnare alla terza etichetta il nome timesRightLabel e assegnare al controllo NumericUpDown il nome prodotto.
Per la quarta riga, assegnare alla prima etichetta il nome dividedLeftLabel, impostare la proprietà Text della seconda etichetta su ÷ (segno di divisione), assegnare alla terza etichetta il nome dividedRightLabel e assegnare al controllo NumericUpDown il nome quoziente.

[!NOTA]

È possibile copiare il segno di moltiplicazione × e il segno di divisione ÷ da questa esercitazione e incollarli nel modulo.

Per aggiungere un pulsante di avvio e impostare l'ordine dell'indice di tabulazione

Aggiungere un controllo Button dalla Casella degli strumenti e impostare la relativa proprietà (Name) su startButton.
Impostare la proprietà Text su Avvia il quiz.
Impostare la dimensione del carattere su 14.
Impostare la proprietà AutoSize su True, in modo che il pulsante venga ridimensionato automaticamente per adattarsi al testo.
Centrare il pulsante nella parte inferiore del modulo.
Impostare il valore della proprietà TabIndex per il controllo startButton su 1.

[!NOTA]

La proprietà TabIndex imposta l'ordine dei controlli quando l'esecutore del quiz preme TAB.Per verificarne il funzionamento, aprire una finestra di dialogo qualsiasi, ad esempio sulla barra dei menu scegliere File, Apri, quindi premere TAB alcune volte.Osservare il modo in cui il cursore si sposta da un controllo all'altro ogni volta che si preme il tasto TAB.Un programmatore ha deciso l'ordine quando ha creato il modulo.
Impostare il valore della proprietà TabIndex per il controllo somma NumericUpDown su 2, per il controllo differenza su 3, per il controllo prodotto su 4 e per il controllo quoziente su 5.

Il modulo avrà ora il seguente aspetto.

Modulo del quiz matematico iniziale
Per verificare se la proprietà TabIndex funziona come previsto, salvare ed eseguire il programma premendo F5 o scegliendo Debug e Avvia debug sulla barra dei menu e premendo TAB alcune volte.

Per continuare o rivedere l'esercitazione

Per andare al passaggio successivo dell'esercitazione, vedere Passaggio 2: creare un problema di addizione casuale.
Per tornare all'argomento introduttivo, vedere Esercitazione 2: creare un quiz matematico a tempo.

Last updated on 2015-06-14