UWP中通过C# XAML.cs点击事件处理程序移除UI元素并更新二维数组

嘿，我来帮你搞定这个UWP里的点击移除UI元素并同步更新二维数组的问题！下面是一套实用的实现方案，咱们一步步来：

1. 给Grid内的元素绑定点击事件 #

不管你的UI元素是XAML静态写的，还是后台代码动态生成的，核心是给每个可点击元素绑定Tapped事件（非Button类元素推荐用这个，Button可以用Click），同时把元素在二维数组里的坐标存到元素的Tag属性里——这是关联UI和数据的关键。

比如后台动态生成元素的代码：

// 假设你有rows行cols列的网格，gameGrid是你的二维状态数组
private bool[,] gameGrid;
private const int Rows = 4;
private const int Cols = 4;

public MainPage()
{
    this.InitializeComponent();
    InitGridAndTiles();
}

private void InitGridAndTiles()
{
    // 初始化二维数组
    gameGrid = new bool[Rows, Cols];
    
    // 先给Grid添加行/列定义
    myGrid.RowDefinitions.Clear();
    myGrid.ColumnDefinitions.Clear();
    for (int i = 0; i < Rows; i++)
    {
        myGrid.RowDefinitions.Add(new RowDefinition());
        myGrid.ColumnDefinitions.Add(new ColumnDefinition());
    }

    // 循环生成每个可点击的Tile（这里用Rectangle举例）
    for (int i = 0; i < Rows; i++)
    {
        for (int j = 0; j < Cols; j++)
        {
            var tile = new Rectangle
            {
                Fill = new SolidColorBrush(Colors.Coral),
                Margin = new Thickness(3),
                Tag = new Point(i, j) // 把数组坐标存在Tag里
            };
            tile.Tapped += Tile_Tapped; // 绑定点击事件
            Grid.SetRow(tile, i);
            Grid.SetColumn(tile, j);
            myGrid.Children.Add(tile);
            gameGrid[i, j] = true; // 数组标记该位置有元素
        }
    }
}

如果是XAML里静态定义的元素，直接在标签里加Tapped="Tile_Tapped"，然后设置Tag="0,0"这类坐标字符串，后续在事件里解析就行。

2. 编写点击事件处理逻辑 #

在点击事件里，我们要完成三个核心动作：获取点击元素的数组坐标、移除UI元素、更新二维数组状态。

private void Tile_Tapped(object sender, TappedRoutedEventArgs e)
{
    // 1. 拿到被点击的元素
    var tappedTile = sender as FrameworkElement;
    if (tappedTile == null) return;

    // 2. 从Tag里取出对应的数组坐标
    if (tappedTile.Tag is Point coord)
    {
        int row = (int)coord.X;
        int col = (int)coord.Y;

        // 3. 移除UI元素
        myGrid.Children.Remove(tappedTile);

        // 4. 同步更新二维数组（比如设为false表示该位置已无元素）
        gameGrid[row, col] = false;

        // 这里可以加游戏逻辑，比如判断是否通关、更新分数等
        Debug.WriteLine($"已移除({row},{col})的元素，数组状态：{gameGrid[row,col]}");
    }
}

小提示：如果你的元素是用Grid.Row/Grid.Column布局的，也可以用Grid.GetRow(tappedTile)和Grid.GetColumn(tappedTile)直接获取坐标，不用Tag也能行，不过Tag的方式更灵活，适合元素位置可能动态变化的场景。

3. 避坑注意事项 #

• 确保初始化时二维数组和UI元素状态完全对应，避免出现“UI有元素但数组标记为空”的不一致情况；
• 如果移除元素后需要重新布局其他元素，可能需要调整Grid的行/列定义，或者换用WrapPanel这类自动布局容器；
• 如果需要批量操作元素，记得遍历myGrid.Children时用反向循环（避免移除元素导致索引错乱）。

内容的提问来源于stack exchange，提问作者user2963022