I am working on an online checkers program and I have managed to draw the board and the checkers on each square with success. The only problem now is programming the click events ,I have code that responds to the clicks made to an individual panel to alter the background color to blue and the checker color to white, when a user clicks the same piece of panel , the colors are reversed back to the original. Now my problem is achieving this effect:: If a user clicks on panelA and then the color altercation is applied, when a different panelB is clicked then the coloration applied to panelA should be restored back to the original like in the double clicking effect.

My Attempted Solution

I initialized a List<Panel> clicked_objects object and used it to store the Panel element that was clicked, I expected the count of the list object to increase with each successive click but when I do a MessageBox.Show(clicked_objects.Count.ToString()), It always shows 1. I needed to do this so that immediately a second clicked Panel is added to this list, I can check the count and color the Panel at index 1(new Panel) and decolorize the Panel at index 0(previously clicked Panel). How can I achieve this? Click on One Panel removes the coloration on previously clicked element if any?

Code

public class Checkerpiece
    { 
        //declare a panel array for storing clicked Panels
        List<Panel> clicked_squares=new List<Panel>();
        //The object above can only hold two panel elements
        //colors of the rounded pieces
        Color color;
        //specify where the checker is drawn
        Panel target_square;
        //specify the center of the circle
        float center_x;
        float center_y;
        //specify the radius of the checker piece
        float radii;
        //define some foreground color that will be used to access the color of the checker
        Color foreground;
        //fill the details inside the constructor
        public Checkerpiece(Panel mypanel,Color color)
        {
            this.color = color;
            this.target_square = mypanel;
            this.center_x = mypanel.Width / 2;
            this.center_y = mypanel.Height / 2;
            this.radii = mypanel.Width / 2;
            //register an onclick listener for our checkerpiece object
            this.target_square.Click  = Target_square_Click;
           // this.target_square.MouseClick  = Target_square_MouseClick;
        }

      
        private void Target_square_Click(object sender, EventArgs e)
        {
            clicked_squares.Add(target_square);
           //this keeps showing 1 no mater what panel I click
            MessageBox.Show(clicked_squares.Count.ToString());
         }
          public static void fillCircle(Graphics g, Brush b, float centerX, float centerY, float radius)
        {
            g.FillEllipse(b, centerX - radius, centerY - radius,
                     radius   radius, radius   radius);
        }
        //implement a getter for the color used to used to draw the checker
        public Color getCheckerColor()
        {
            return this.color;
        }
  }

Checker Board class

public partial class Form1 : Form
    {
        private Panel[,] _chessBoardPanels;
        public Form1()
        {
            InitializeComponent();
            
        }
      
       
        private void Form1_Load(object sender, EventArgs e)
        {
            const int tileSize = 100;
            const int gridSize = 8;
            var clr1 = Color.DarkGray;
            var clr2 = Color.White;

            // initialize the "chess board"
            _chessBoardPanels = new Panel[gridSize, gridSize];
            int count = 0;
            // double for loop to handle all rows and columns
            for (var n = 0; n < gridSize; n  )
            {
                for (var m = 0; m < gridSize; m  )
                {
                    // create new Panel control which will be one 
                    // chess board tile
                    var newPanel = new Panel
                    {
                        Size = new Size(tileSize, tileSize),
                        Location = new Point(tileSize * n, tileSize * m)
                      
                };
                    //register an event listener for each square

                   
                    // add to Form's Controls so that they show up
                    Controls.Add(newPanel);

                    // add to our 2d array of panels for future use
                    _chessBoardPanels[n, m] = newPanel;
                    //draw only the red checkers on top of the board
                    
                    // color the backgrounds
                    if (n % 2 ==0)
                        newPanel.BackColor = m % 2 != 0 ? clr1 : clr2;
                        //new Checkerpiece(newPanel, Color.Red).draw();
                    
                    else
                        newPanel.BackColor = m % 2 != 0 ? clr2 : clr1;
                    //draw a new checker piece
                    if (newPanel.BackColor==Color.White &&m<=3)
                        new Checkerpiece(newPanel, Color.Red).draw(); 
                       ;
                    if (newPanel.BackColor == Color.White && m > 4)
                        new Checkerpiece(newPanel, Color.Black).draw();
               
                }
            }
           
        }
}

Output

When I click on a piece, each coloration remains on the previously clicked item which should not be the case

Goal

How can I store the state of a clicked Panel and restore when a new Panel is clicked?

CodePudding user response：

You should manage the pieces from the Board class, the list of Pieces can be checked by their reference, no need to "look" for a matching piece in the collection when you have the object via the clicked event. Use the Board (Form) class to manage the Currently selected pieces and handle the Select/Deselect as you set those properties.