Informazioni dettagliate: personalizzazione del controllo utente

Articolo
09/12/2008

Aggiornamento: novembre 2007

In questa lezione verrà descritto come personalizzare il controllo utente e renderlo più utile.

Aggiunta di etichette

Nella lezione precedente è stato eseguito il test del controllo utente NamesControl e ne è stato verificato il corretto funzionamento. Sono stati anche evidenziati alcuni miglioramenti che potrebbero essere apportati. Ad esempio, il nome da immettere in ciascuna casella di testo non è indicato con chiarezza e non vi è modo di verificare che un utente immetta tutti e tre i nomi.

Per rendere il controllo utente più utile, è possibile aggiungere etichette per l'identificazione di ciascuna casella di testo. È possibile impostare il testo delle etichette in modo da indicare il nome, il secondo nome e il cognome. Si potrebbe tuttavia cambiare idea in un momento successivo e decidere di specificare ad esempio l'iniziale del secondo nome. È preferibile pertanto creare proprietà per il testo delle etichette in modo da poter modificare il testo in fase di progettazione e specificare un valore predefinito per ciascuna proprietà.

Procedura

Per personalizzare il controllo utente

Aprire il progetto NamesUserControl creato nella lezione precedente. Se il progetto non è stato salvato, tornare prima alla lezione precedente, Test del controllo utente, e completare le procedure indicate.
In Esplora soluzioni selezionare NamesControl.vb, quindi scegliere Finestra di progettazione dal menu Visualizza.
Trascinare i controlli Label dalla Casella degli strumenti nella finestra di progettazione e posizionarne uno su ciascun controllo TextBox.
In Esplora soluzioni selezionare NamesControl.vb, quindi scegliere Codice dal menu Visualizza.

Nell'editor di codice aggiungere il codice riportato di seguito per creare le proprietà del testo dell'etichetta.

Private text1 As String = "First Name"
Property Label1Text() As String
    Get
        Return text1
    End Get
    Set(ByVal value As String)
        text1 = value
        Label1.Text = text1
    End Set
End Property
Private text2 As String = "Middle Name"
Property Label2Text() As String
    Get
        Return text2
    End Get
    Set(ByVal value As String)
        text2 = value
        Label2.Text = text2
    End Set
End Property
Private text3 As String = "Last Name"
Property Label3Text() As String
    Get
        Return text3
    End Get
    Set(ByVal value As String)
        text3 = value
        Label3.Text = text3
    End Set
End Property

Nel codice sono dichiarate tre variabili Private per il testo dell'etichetta e le dichiarazioni includono il valore predefinito da visualizzare.

Nell'editor di codice selezionare (Eventi NamesControl) dalla casella di riepilogo a discesa sulla sinistra, quindi selezionare l'evento Load dalla casella di riepilogo a discesa sulla destra.

Aggiungere il codice seguente al gestore eventi NamesControl_Load.

' Initialize the three labels
Me.Label1.Text = Label1Text
Me.Label2.Text = Label2Text
Me.Label3.Text = Label3Text

Scegliere Genera soluzione dal menu Genera.
In Esplora soluzioni selezionare Form1.vb, quindi scegliere Finestra di progettazione dal menu Visualizza.

Verificare che nelle etichette sia presente il testo predefinito. Provare a modificare la proprietà Label1Text nella finestra Proprietà e verificare che la modifica venga applicata anche al controllo.
Scegliere Chiudi dal menu File per chiudere la finestra di progettazione del form.

Aggiunta della convalida

Un'altra personalizzazione utile consiste nell'aggiunta di codice per la convalida degli elementi immessi, al fine di verificarne la correttezza. Anziché convalidare ciascun singolo controllo TextBox, è possibile scrivere un codice di convalida per l'intero controllo utente.

Per la maggior parte dei controlli è presente un evento Validating che viene generato quando lo stato attivo viene spostato all'esterno del controllo. È necessario immettere il codice di convalida in corrispondenza di tale evento. In questo caso, verrà scritto il codice che consente di verificare che ciascuna casella di testo contenga un nome.

Se una o più caselle di testo sono vuote, è possibile fare in modo che venga visualizzata una finestra di messaggio che ricordi all'utente di immettere il proprio nome. È possibile esporre una proprietà contenente un messaggio predefinito, in modo da consentire all'utente del controllo di modificare il messaggio in base alle proprie esigenze.

Il secondo nome potrebbe inoltre non essere richiesto per l'utente del controllo. È pertanto possibile aggiungere anche una proprietà Boolean per disattivare la convalida della casella di testo MiddleName.

Procedura

Per aggiungere la convalida

Nell'editor di codice aggiungere il codice per due proprietà correlate alla convalida: una per specificare se è richiesto il secondo nome, l'altra per specificare un messaggio da visualizzare in caso di esito negativo della convalida.

Private required As Boolean = True
Property MiddleNameRequired() As Boolean
    Get
        Return required
    End Get
    Set(ByVal value As Boolean)
        required = value
    End Set
End Property
Private errormessage As String = "Please enter your name."
Property ValidationErrorMessage() As String
    Get
        Return errormessage
    End Get
    Set(ByVal value As String)
        errormessage = value
    End Set
End Property

Nell'editor di codice selezionare (Eventi NamesControl) dalla casella di riepilogo a discesa sulla sinistra, quindi selezionare l'evento Validating dalla casella di riepilogo a discesa sulla destra.

Aggiungere il codice seguente al gestore eventi NamesControl_Validating.

If MiddleNameRequired = True Then
    If FirstName.Text = "" Or MiddleName.Text = "" Or _
LastName.Text = "" Then
        MsgBox(ValidationErrorMessage)
    End If
Else
    ' Middle name isn't required.
    If FirstName.Text = "" Or LastName.Text = "" Then
        MsgBox(ValidationErrorMessage)
    End If
End If

Scegliere Genera soluzione dal menu Genera.
In Esplora soluzioni selezionare Form1.vb, quindi scegliere Finestra di progettazione dal menu Visualizza.

Selezionare il controllo utente sul form e verificare che le due nuove proprietà siano visualizzate nella finestra Proprietà.
Dalla Casella degli strumenti trascinare un controllo Button nel form.
Premere F5 per eseguire il programma.

Immettere solo nome e cognome, non il secondo nome. Fare clic sul pulsante. Verrà visualizzata una finestra di messaggio contenente il testo ValidationErrorMessage.
Per salvare il lavoro, scegliere Salva tutto dal menu File.

Passaggi successivi

In questa lezione è stato descritto come personalizzare il controllo utente e renderlo più utile. Nella lezione successiva verrà descritto come utilizzare la grafica per creare testo e immagini.

Lezione successiva: Creazione di immagini: utilizzo di elementi grafici