Step 4: Add a Click Event Handler to Each Label

The matching game works as follows:

  1. When a player clicks one of the squares with a hidden icon, the program shows the icon to the player by changing the icon color to black.

  2. Then the player clicks another hidden icon.

  3. If the icons match, they stay visible. If not, both icons are hidden again.

To get your program to work that way, you add a Click event handler that changes the color of the label that is clicked.

To add a Click event handler to each label

  1. Go to Windows Forms Designer and click the first Label control to select it. Then hold down the CTRL key while you click each of the other labels to select them. Be sure that every label is selected.

  2. Then go to the Events page in the Properties window. Scroll down to the Click event, and type label_Click in the box, as shown in the following picture.

    Properties window showing Click event

    Properties window showing Click event

  3. Press ENTER. The IDE adds a Click event handler called label_Click() to the code, and hooks it to each of the labels.

  4. Fill in the rest of the code, as follows:

    ''' <summary> 
    ''' Every label's Click event is handled by this event handler 
    ''' </summary> 
    ''' <param name="sender">The label that was clicked</param> 
    ''' <param name="e"></param> 
    ''' <remarks></remarks> 
    Private Sub label_Click(ByVal sender As System.Object, 
                            ByVal e As System.EventArgs) Handles Label9.Click, 
        Label8.Click, Label7.Click, Label6.Click, Label5.Click, Label4.Click, 
        Label3.Click, Label2.Click, Label16.Click, Label15.Click, Label14.Click, 
        Label13.Click, Label12.Click, Label11.Click, Label10.Click, Label1.Click
    
        Dim clickedLabel = TryCast(sender, Label)
    
        If clickedLabel IsNot Nothing Then 
    
            ' If the clicked label is black, the player clicked  
            ' an icon that's already been revealed --  
            ' ignore the click 
            If clickedLabel.ForeColor = Color.Black Then Exit Sub
    
            clickedLabel.ForeColor = Color.Black
        End If 
    End Sub
    
    /// <summary> 
    /// Every label's Click event is handled by this event handler 
    /// </summary> 
    /// <param name="sender">The label that was clicked</param>
    /// <param name="e"></param>
    private void label_Click(object sender, EventArgs e)
    {
        Label clickedLabel = sender as Label;
    
        if (clickedLabel != null)
        {
            // If the clicked label is black, the player clicked 
            // an icon that's already been revealed -- 
            // ignore the click 
            if (clickedLabel.ForeColor == Color.Black)
                return;
    
            clickedLabel.ForeColor = Color.Black;
        }
     }
    

    Note

    You may recognize object sender at the top of the event handler from the Create a Math Quiz tutorial. You hooked up different Label control Click events to a single event handler method, so the same method is called no matter which label the user clicks. The method needs to know which label was clicked, so it uses the name sender for that Label control. The first line of the method tells the program that it's not just an object, but specifically a Label control, and that it uses the name clickedLabel to access its properties and methods.

    This method first checks whether clickedLabel was successfully converted (cast) from an object to a Label control. If unsuccessful, it has a value of null (C#) or Nothing (Visual Basic), and you don't want to execute the remainder of the code in the method. Next, the method checks the clicked label's text color using the ForeColor property. If it's already black, the icon's been clicked, so the method is done. (That's what the return statement does: It tells the program to stop executing the method.) If the icon hasn't been clicked, it changes its text color to black.

  5. Save and run your program. You should see an empty form with a blue background. Click in the form, and one of the icons should become visible. Continue clicking in different places in the form. As you click the icons, they should appear.

To continue or review