Building a Bingo Board Control in C#

In this blog post, we’ll delve into the implementation details of a Bingo board control developed in C#. This control is part of an upcoming Bingo application designed to enhance game management through features like dynamic state handling, interactive user interfaces, and visual feedback such as blinking effects. Soon to be available for download, this control offers a comprehensive solution for organizing Bingo games effectively. Let’s explore the code sample and understand how it achieves these functionalities.

Overview

The Bingo board control is designed to facilitate a Bingo game environment, where users can interact with labels representing Bingo numbers and row headers. Key functionalities include toggling label colors, managing lists of removed balls, enabling/disabling rows, and providing visual cues for called numbers.

Setting Up the Environment

First, let’s initialize our Bingo board control. This control is implemented as a Form in C#, making use of Windows Forms for the user interface components.

public partial class BingoBoard : Form
{
    // Constants and fields
    private readonly Color SuperDarkGray = Color.FromArgb(64, 64, 64);
    private List<int> ballsToRemove = new List<int>();
    private List<string> disabledRows = new List<string>();
    private Label? lastCalledNumberLabel;
    private Timer blinkTimer;

    // Constructor
    public BingoBoard()
    {
        InitializeComponent();

        // Initialize the blink timer
        blinkTimer = new Timer();
        blinkTimer.Interval = 500; // 500 milliseconds
        blinkTimer.Tick += BlinkTimer_Tick; // Attach event handler
    }
}
    

Here, we define constants for colors and initialize necessary fields such as lists for removed balls and disabled rows. The blinkTimer is set up to handle blinking effects when a number is called.

Handling User Interactions

Toggling Box Labels

private void boxLabel_Click(object? sender, EventArgs e)
{
    if ((sender is Label clickedBox) && (IsGameStarted == false))
    {
        int number = GetNumberFromLabel(clickedBox);

        if (clickedBox.ForeColor == SuperDarkGray)
        {
            clickedBox.ForeColor = Color.White;
            ballsToRemove.Add(number); // Add to list if not present
        }
        else
        {
            clickedBox.ForeColor = SuperDarkGray;
            ballsToRemove.Remove(number); // Remove from list if already present
        }
    }
}
    

In the boxLabel_Click method, we handle click events on labels representing Bingo numbers. Depending on the current color of the label (SuperDarkGray or White), we toggle the foreground color and manage the ballsToRemove list accordingly.

Toggling Row Header Labels

private void RowHeaderLabel_Click(object? sender, EventArgs e)
{
    if ((sender is Label clickedLabel) && (IsGameStarted == false))
    {
        if (clickedLabel.BackColor == Color.LightGray)
        {
            clickedLabel.ForeColor = SuperDarkGray;
            clickedLabel.BackColor = Color.FromArgb(10, 10, 10);

            string? rowLetter = clickedLabel.Tag?.ToString();
            if (!string.IsNullOrEmpty(rowLetter)) DisableRow(rowLetter);
        }
        else
        {
            clickedLabel.BackColor = Color.LightGray;
            clickedLabel.ForeColor = Color.Red;

            string? rowLetter = clickedLabel.Tag?.ToString();
            if (!string.IsNullOrEmpty(rowLetter)) EnableRow(rowLetter);
        }
    }
}
    

The RowHeaderLabel_Click method handles click events on row header labels. It toggles between different colors (LightGray, darker shades) based on the current state and manages row enabling/disabling.

Helper Methods

Retrieving Numbers from Labels

private int GetNumberFromLabel(Label label)
{
    if (int.TryParse(label.Text, out int number))
    {
        return number;
    }
    else
    {
        throw new InvalidOperationException("Label text is not a valid number.");
    }
}
    

The GetNumberFromLabel method parses the text of a label into an integer, validating if it’s a valid number.

Enabling and Disabling Rows

private void DisableRow(string rowLetter)
{
    if (!disabledRows.Contains(rowLetter))
    {
        disabledRows.Add(rowLetter);
    }
}

private void EnableRow(string rowLetter)
{
    if (disabledRows.Contains(rowLetter))
    {
        disabledRows.Remove(rowLetter);
    }
}
    

These methods handle enabling and disabling rows based on the row identifier (rowLetter), updating the disabledRows list accordingly.

Visual Feedback

Blinking Last Called Number

private void BlinkLastNumber()
{
    if (lastCalledNumberLabel != null)
    {
        if (!blinkTimer.Enabled) blinkTimer.Start();
        lastCalledNumberLabel.Visible = true;
    }
}

private void BlinkTimer_Tick(object? sender, EventArgs e)
{
    if (lastCalledNumberLabel != null)
    {
        lastCalledNumberLabel.Visible = !lastCalledNumberLabel.Visible;
    }
}

public void StopBlinkingLastNumber()
{
    if (blinkTimer.Enabled)
    {
        blinkTimer.Stop();
        if (lastCalledNumberLabel != null) lastCalledNumberLabel.Visible = true;
    }
}
    

These methods implement a blinking effect for the last called Bingo number label using a timer (blinkTimer). BlinkLastNumber starts the blinking effect, BlinkTimer_Tick toggles the label visibility, and StopBlinkingLastNumber stops the blinking effect.

Conclusion

In conclusion, this Bingo board control in C# demonstrates how to manage game state and user interactions effectively. It utilizes event handling, list management, and visual feedback techniques to create a dynamic and interactive Bingo game environment. Feel free to adapt and expand upon this code for your own Bingo game projects!

---

This blog post provides a comprehensive overview of implementing a Bingo board control in C#, focusing on key functionalities and code explanations. If you have any questions or suggestions for improvement, feel free to leave a comment below!

Have questions or thoughts about creating interactive Bingo boards in C#? Whether you’re diving into game development or refining your UI skills, I’d love to hear from you! Drop your comments below and let’s discuss how we can enhance your Bingo game experience together.