如何以编程方式向UWP DataGrid添加行 实现按钮触发新增及编辑后绑定保存

完全可以实现该需求，UWP DataGrid采用数据驱动绑定的设计，不需要直接操作DataGrid的UI行对象，只需操作绑定的数据源集合即可自动同步UI，用户编辑内容也会自动回存到绑定对象。 #

1. 前置准备：定义数据模型与绑定规则 #

1.1 实现数据模型 #

首先你的数据模型需要实现INotifyPropertyChanged接口，保证用户编辑行内容时，数据变更能实时同步回绑定的对象实例：

using System.ComponentModel;
using System.Runtime.CompilerServices;

// 示例数据模型，可根据业务调整字段
public class DataItem : INotifyPropertyChanged
{
    private string _itemName;
    private int _itemValue;

    public string ItemName
    {
        get => _itemName;
        set { _itemName = value; OnPropertyChanged(); }
    }

    public int ItemValue
    {
        get => _itemValue;
        set { _itemValue = value; OnPropertyChanged(); }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

1.2 定义绑定数据源 #

页面的绑定上下文（ViewModel）中使用ObservableCollection<T>作为DataGrid的数据源，该集合实现了集合变更通知接口，新增/删除元素时会自动通知UI更新：

using System.Collections.ObjectModel;

// 页面核心代码示例
public sealed partial class MainPage : Page
{
    // DataGrid绑定的数据源集合
    public ObservableCollection<DataItem> DataGridItems { get; set; } = new ObservableCollection<DataItem>();

    public MainPage()
    {
        this.InitializeComponent();
        this.DataContext = this; // 把当前页面设为绑定上下文，也可替换为独立的ViewModel实例
    }
}

1.3 XAML绑定配置 #

<Page
    ...
    xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls">

    <StackPanel>
        <controls:DataGrid 
            x:Name="MyDataGrid"
            ItemsSource="{Binding DataGridItems}"
            AutoGenerateColumns="False"
            CanUserAddRows="False"> <!-- 关闭默认自带的新增行入口，仅用自定义按钮控制新增 -->
            <controls:DataGrid.Columns>
                <controls:DataGridTextColumn Header="项名称" Binding="{Binding ItemName}" />
                <controls:DataGridTextColumn Header="项数值" Binding="{Binding ItemValue}" />
            </controls:DataGrid.Columns>
        </controls:DataGrid>

        <!-- 触发生成新行的按钮 -->
        <Button Content="新增一行" Click="AddRowBtn_Click" Margin="0 10 0 0" HorizontalAlignment="Left"/>
    </StackPanel>
</Page>

注意：如果需要保留DataGrid自带的底部新增行入口，只需把CanUserAddRows设为True即可，自定义按钮的新增逻辑依然有效，两种方式可以共存。

2. 按钮点击新增行逻辑 #

直接往绑定的ObservableCollection集合里添加一个空的DataItem实例即可，DataGrid会自动生成对应新行：

private void AddRowBtn_Click(object sender, RoutedEventArgs e)
{
    // 新增空数据对象到集合，UI自动同步生成新行
    DataGridItems.Add(new DataItem());
    
    // 可选配置：自动选中新行并进入编辑状态，用户可直接输入
    MyDataGrid.SelectedIndex = DataGridItems.Count - 1;
    MyDataGrid.BeginEdit();
}

3. 编辑自动保存说明 #

因为数据模型已经实现了INotifyPropertyChanged接口，用户完成单元格编辑后，输入的内容会自动同步到对应绑定的DataItem实例，不需要额外编写保存逻辑，直接读取DataGridItems集合就能拿到所有行的最新数据。 #

内容的提问来源于stack exchange，提问作者David Simões