在编辑WPF DataGrid单元格时显示弹出窗口

Question

与如何在DataGridTemplateColumn.CellEditingTemplate中正确放置弹出窗口？相似，我正在尝试在DataGrid中编辑单元格时，在单元格下方显示弹出窗口，并在不再编辑单元格时消失。最后一件事是弹出窗口的内容根据列是动态的，并且通过绑定动态创建列。

我从以下XAML开始，但我收到了XamlParseException“将值添加到类型为'System.Windows.Controls.ItemCollection'的集合引发了异常”。

<DataGrid ItemsSource="{Binding Path=Options}">
    <DataGridTemplateColumn>
        <DataGridTemplateColumn.CellEditingTemplate>
            <DataTemplate>
                <Grid>
                    <Popup Placement="Bottom" IsOpen="True" Width="200" Height="100">
                        <TextBlock>Somethingn here</TextBlock>
                    </Popup>
                </Grid>
            </DataTemplate>
        </DataGridTemplateColumn.CellEditingTemplate>
    </DataGridTemplateColumn>
</DataGrid>

- Walter Williams

---

最简单的解决方法是将DataGridCell的Focusable属性设置为false，这样Popup就会获得焦点。请参考这个答案https://dev59.com/t0rSa4cB1Zd3GeqPWndN#18027670。 - Abbas

Answer 1

我已经想出了一个目前表现良好的解决方案。它涉及一些事件处理程序，但代码不必访问视图模型，所以希望不会引起MVVM纯粹主义者的愤怒。

XAML:

<Grid>
    <DataGrid ItemsSource="{Binding Path=Options}" BeginningEdit="DataGrid_BeginningEdit" CellEditEnding="DataGrid_CellEditEnding" />
    <Popup Name="pop1">
        <Border Width="300" Height="200" Background="LemonChiffon" BorderThickness="2" BorderBrush="Black" />
    </Popup>
</Grid>

MainWindow.xaml.cs事件处理程序：

private void DataGrid_BeginningEdit (Object sender, DataGridBeginningEditEventArgs e)
{
    DataGrid grid = (DataGrid) sender;
    Popup pop1 = (Popup) grid.FindName("pop1");
    pop1.PlacementTarget = grid.GetCell(e.Row.GetIndex(), e.Column.DisplayIndex);
    pop1.IsOpen = true;
}

private void DataGrid_CellEditEnding (Object sender, DataGridCellEditEndingEventArgs e)
{
    Popup pop1 = (Popup) ((DataGrid) sender).FindName("pop1");
    pop1.IsOpen = false;
}

DataGridExtensions.cs:

/// <summary>
/// Extension methods for DataGrid
/// These methods are thanks to http://blogs.msdn.com/b/vinsibal/archive/2008/11/05/wpf-datagrid-new-item-template-sample.aspx
/// </summary>
public static class DataGridExtensions
{
    /// <summary>
    /// Returns a DataGridCell for the given row and column
    /// </summary>
    /// <param name="grid">The DataGrid</param>
    /// <param name="row">The zero-based row index</param>
    /// <param name="column">The zero-based column index</param>
    /// <returns>The requested DataGridCell, or null if the indices are out of range</returns>
    public static DataGridCell GetCell (this DataGrid grid, Int32 row, Int32 column)
    {
        DataGridRow gridrow = grid.GetRow(row);
        if (gridrow != null)
        {
            DataGridCellsPresenter presenter = GetVisualChild<DataGridCellsPresenter>(gridrow);

            // try to get the cell but it may possibly be virtualized
            DataGridCell cell = (DataGridCell) presenter.ItemContainerGenerator.ContainerFromIndex(column);
            if (cell == null)
            {
                // now try to bring into view and retreive the cell
                grid.ScrollIntoView(gridrow, grid.Columns[column]);

                cell = (DataGridCell) presenter.ItemContainerGenerator.ContainerFromIndex(column);
            }

            return (cell);
        }

        return (null);
    }

    /// <summary>
    /// Gets the DataGridRow based on the given index
    /// </summary>
    /// <param name="idx">The zero-based index of the container to get</param>
    public static DataGridRow GetRow (this DataGrid dataGrid, Int32 idx)
    {
        DataGridRow row = (DataGridRow) dataGrid.ItemContainerGenerator.ContainerFromIndex(idx);
        if (row == null)
        {
            // may be virtualized, bring into view and try again
            dataGrid.ScrollIntoView(dataGrid.Items[idx]);
            dataGrid.UpdateLayout();

            row = (DataGridRow) dataGrid.ItemContainerGenerator.ContainerFromIndex(idx);
        }

        return (row);
    }

    private static T GetVisualChild<T> (Visual parent) where T : Visual
    {
        T child = default(T);

        Int32 numvisuals = VisualTreeHelper.GetChildrenCount(parent);
        for (Int32 i = 0; i < numvisuals; ++i)
        {
            Visual v = (Visual) VisualTreeHelper.GetChild(parent, i);
            child = v as T;
            if (child == null)
                child = GetVisualChild<T>(v);
            else
                break;
        }

        return child;
    }
}

- Walter Williams

Answer 2

我认为一个好的方法是这样设置它

<Grid>
    <DataGrid Name="DataGridList" ItemsSource="{Binding SettingsList, Mode=TwoWay}" AutoGenerateColumns="False" Height="146">
        <!--Resources-->
        <DataGrid.Resources>               
            <!--DataTemplate-->
            <DataTemplate x:Key="DateTemplate" >
                <StackPanel>
                    <TextBlock Text="{Binding YourBinding}"></TextBlock>
                </StackPanel>
            </DataTemplate>              
            <!--EditingDateTemplate-->
            <DataTemplate x:Key="EditingDateTemplate">
                <Grid>
                    <Popup Placement="Bottom" IsOpen="True" Width="200" Height="100">
                        <TextBlock>Something here</TextBlock>
                    </Popup>
                </Grid>
            </DataTemplate>
        </DataGrid.Resources>
        <!--Datagrid-->
        <DataGrid.Columns>
            <DataGridTemplateColumn Header="header 1" CellTemplate="{StaticResource DateTemplate}" CellEditingTemplate="{StaticResource EditingDateTemplate}" />
        </DataGrid.Columns>
    </DataGrid>
</Grid>

- Jim

---

似乎出现了一些奇怪的行添加行为，并且没有创建我的动态列；我也不想用弹出窗口替换正常的单元格编辑行为，而是希望弹出窗口显示补充信息。 - Walter Williams