En Connect 4, independientemente de la casilla seleccionada en la cuadrícula, encuentra la casilla inferior y cambia su imagen.

Todas las celdas de la cuadrícula son imágenes blancas que inicialmente se establecen en 0 y cuando se hace clic en ellas se establecen en 1 o 2 dependiendo del color.

No puedo encontrar la manera de hacer que, independientemente de qué imagen blanca haga clic el usuario, vaya al final de esa columna, encuentre la última celda con el valor de 0 y rellene esa celda con la baldosa coloreada.

string[] imagePaths = { "empty.png", "Yellow.png", "Red.png" };
const int NumberOfCells = 36;
const int WidthOfBoard = 6;

// jugador predeterminado
string playersTurn = "Red";

int[] boardValues = new int[NumberOfCells];
ImageButton[] buttons = new ImageButton[NumberOfCells];

public MainPage()
{
    InitializeComponent();

    for (int i = 0; i < NumberOfCells; i++)
    {
        buttons[i] = (ImageButton)board.FindByName("cell" + i);
    }

    ResetGame();
    Rules();
}

// poner imagen de una baldosa azul o roja en la cuadrícula y actualizar el turno
private async void Cell_Clicked(object sender, EventArgs e)
{
    ImageButton button = (ImageButton)sender;

    int y = (int)button.GetValue(Grid.ColumnProperty);
    int x = (int)button.GetValue(Grid.RowProperty);

    int index = (y * WidthOfBoard) + x;


    if (boardValues[index] == 0)
    {

        {
            button.TranslationY = -400;
            buttons[index].Source = playersTurn + ".png";

            if (playersTurn == "Yellow")
            {
                boardValues[index] = 1;
                CheckForWinner();
                playersTurn = "Red";
            }
            else
            {
                boardValues[index] = 2;
                CheckForWinner();
                playersTurn = "Yellow";
            }

            turnLabel.Text = playersTurn + " turno";
            await button.TranslateTo(0, 0, 250);
        }
    }

}

Cómo se ve el tablero