How to add a button to the last/new row of a datagrid?

问题

I would like to show a popup to help the users to add a new row to a datagrid, by adding a button in the last row of the datagrid. I figured there must be some sort of DataGridTemplateColumnproperty I have to set for the newrow/addrow template?

回答1:

What you can do is to write a style for "DataGridRow" as

Thi is the working example

<Style x:Type="DataGridRow">
<Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGridRow}">
                    <Grid Background="{TemplateBinding Background}">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="auto"/>
                        </Grid.ColumnDefinitions>
                        <ContentPresenter Grid.Column="0" />
                        <Button Visibility = "{Binding IsLastRow}"/>!--can set converter to convert boolean to visibilty as well.
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
</Style>

So the binded property basically check the logic of the last row.(I am not sure wpf datagrid by itself provides some kind of property like "IsLastRow" or not. But if not anytime you can write your own logic).

In ContentTemplate you can define your button handler or command object.

回答2:

You could use a DataGridRow style with a data trigger that changes the template of the last row:

<DataGrid x:Name="dgrid">
    <DataGrid.Resources>
        <Style TargetType="{x:Type DataGridRow}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding}" Value="{x:Static CollectionView.NewItemPlaceholder}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type DataGridRow}">
                                <Border x:Name="DGR_Border" BorderBrush="{TemplateBinding BorderBrush}"
                                                BorderThickness="{TemplateBinding BorderThickness}" 
                                                Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
                                    <Grid>
                                        <SelectiveScrollingGrid>
                                            <SelectiveScrollingGrid.ColumnDefinitions>
                                                <ColumnDefinition Width="Auto"/>
                                                <ColumnDefinition Width="*"/>
                                            </SelectiveScrollingGrid.ColumnDefinitions>
                                            <SelectiveScrollingGrid.RowDefinitions>
                                                <RowDefinition Height="*"/>
                                                <RowDefinition Height="Auto"/>
                                            </SelectiveScrollingGrid.RowDefinitions>
                                            <DataGridCellsPresenter Grid.Column="1" ItemsPanel="{TemplateBinding ItemsPanel}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                                            <DataGridDetailsPresenter Grid.Column="1" Grid.Row="1" SelectiveScrollingGrid.SelectiveScrollingOrientation="{Binding AreRowDetailsFrozen, ConverterParameter={x:Static SelectiveScrollingOrientation.Vertical}, Converter={x:Static DataGrid.RowDetailsScrollingConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" Visibility="{TemplateBinding DetailsVisibility}"/>
                                            <DataGridRowHeader Grid.RowSpan="2" SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" Visibility="{Binding HeadersVisibility, ConverterParameter={x:Static DataGridHeadersVisibility.Row}, Converter={x:Static DataGrid.HeadersVisibilityConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}"/>
                                        </SelectiveScrollingGrid>
                                        <Button Content="Add New" />
                                    </Grid>
                                </Border>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </DataGrid.Resources>
</DataGrid>

Or - if you want to put the Button in a specific column - you could use a DataGridTemplateColumn with a CellTemplate that uses a similar data trigger:

<DataGrid x:Name="dgrid">
    <DataGrid.Columns>
        <DataGridTemplateColumn>
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <Grid>
                        <TextBlock>...</TextBlock>
                        <Button x:Name="btn" Content="Add" Visibility="Collapsed" />
                    </Grid>
                    <DataTemplate.Triggers>
                        <DataTrigger Binding="{Binding Path=DataContext, RelativeSource={RelativeSource AncestorType=DataGridRow}}"
                                             Value="{x:Static CollectionView.NewItemPlaceholder}">
                            <Setter TargetName="btn" Property="Visibility" Value="Visible" />
                        </DataTrigger>
                    </DataTemplate.Triggers>
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>
    </DataGrid.Columns>
</DataGrid>

来源：https://stackoverflow.com/questions/41320877/how-to-add-a-button-to-the-last-new-row-of-a-datagrid

标签

wpf

xaml

datagrid