命令检查 DataGrid WPF - Html

在 WPF 中使用 DataGrid 控件来展现大量数据非常方便，但在开发过程中我们可能会遇到以下问题：

• 如何检查用户输入的数据是否合法？
• 如何实现一些列操作的快捷键，比如删除、复制、粘贴等？
• 如何显示一个支持 HTML 的单元格内容？

本文将介绍如何解决以上问题。

检查数据是否合法

我们可以通过 DataGrid 的 CellEditEnding 事件来检查单元格编辑结束后的数据是否合法。首先，我们可以在 XAML 中绑定一个对应单元格的值检查器：

<DataGridTextColumn Binding="{Binding Name}" Header="Name">
    <DataGridTextColumn.CellStyle>
        <Style TargetType="DataGridCell">
            <Setter Property="Validation.ErrorTemplate" Value="{x:Null}" />
            <Setter Property="ToolTip" Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}" />
        </Style>
    </DataGridTextColumn.CellStyle>
</DataGridTextColumn>

在这个例子中，我们使用了默认的数据绑定方式来绑定 Name 属性。然后我们定义了一个 Style 对象，它的目标是 DataGridCell。在这个样式中，我们通过 Validation.ErrorTemplate 将 WPF 默认的错误模板置为空，从而阻止它在单元格周围显示一个红框。另外，我们还绑定了一个 ToolTip，用于显示校验错误的详细信息。

接着，我们需要实现 CellEditEnding 事件。这个事件会在用户完成单元格编辑之后触发。我们可以在这个事件中检查单元格的数据是否合法，如果不合法，就将事件取消：

private void OnCellEditEnding(object sender, DataGridCellEditEndingEventArgs e)
{
    TextBox textBox = e.EditingElement as TextBox;
    if (textBox == null)
    {
        return;
    }
    string newValue = textBox.Text;
    string errorMessage;
    if (!IsValid(newValue, out errorMessage))
    {
        e.Cancel = true;
        ShowErrorMessage(errorMessage);
    }
}

在这个例子中，我们首先从 e.EditingElement 中获取 TextBox 对象，这个对象封装了单元格的编辑器。接着，我们从这个编辑器中获取用户输入的字符串。然后，我们调用 IsValid 方法检查这个字符串是否合法。如果不合法，就将事件取消，并调用 ShowErrorMessage 方法弹出一个错误提示框。

实现快捷键操作

WPF 的 Command 对象提供了一种方便的方式来实现快捷键操作。我们可以在 DataGrid 的 ContextMenu 中定义多个 CommandBinding 对象，然后在这些 CommandBinding 对象对应的 Command 方法中实现我们期望的操作。例如，下面是一个实现删除操作的 CommandBinding 对象：

<DataGrid.ContextMenu>
    <ContextMenu>
        <MenuItem Header="Copy"
                Command="Copy"
                CommandTarget="{Binding PlacementTarget, RelativeSource={RelativeSource AncestorType=ContextMenu}}" />
        <MenuItem Header="Cut"
                Command="Cut"
                CommandTarget="{Binding PlacementTarget, RelativeSource={RelativeSource AncestorType=ContextMenu}}" />
        <MenuItem Header="Paste"
                Command="Paste"
                CommandTarget="{Binding PlacementTarget, RelativeSource={RelativeSource AncestorType=ContextMenu}}" />
        <MenuItem Header="Delete"
                Command="Delete"
                CommandTarget="{Binding PlacementTarget, RelativeSource={RelativeSource AncestorType=ContextMenu}}" />
        <MenuItem Header="Select All"
                Command="ApplicationCommands.SelectAll"
                CommandTarget="{Binding PlacementTarget, RelativeSource={RelativeSource AncestorType=ContextMenu}}" />
    </ContextMenu>
</DataGrid.ContextMenu>

<Grid>
    <Grid.CommandBindings>
        <CommandBinding Command="Delete" Executed="OnDelete" CanExecute="OnCanDelete" />
    </Grid.CommandBindings>
</Grid>

在这个例子中，我们定义了一个 ContextMenu，它包含了 Copy、Cut、Paste、Delete 和 Select All 操作。对于每个操作，我们都绑定了一个 Command。然后，我们在 DataGrid 的 CommandBindings 中定义了一个 CommandBinding 对象，它将 Delete 命令和我们的 OnDelete 方法绑定在一起。CanExecute 方法用于判断当前是否可以执行 OnDelete 方法。

显示 HTML 内容

WPF 的 RichTextBox 控件支持显示 HTML 内容，我们可以利用它来在 DataGrid 单元格中显示 HTML 内容。有两种方式来实现这个功能：一种是使用自定义的编辑器；另一种是在单元格中显示一个嵌套的 RichTextBox。下面是一个实现中的代码片段：

<DataGridTemplateColumn Header="Content">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <RichTextBox IsReadOnly="True"
                        BorderThickness="0"
                        Background="Transparent"
                        VerticalScrollBarVisibility="Hidden"
                        AcceptsReturn="True"
                        TextWrapping="Wrap"
                        xmlns:local="clr-namespace:WpfApplication1"
                        PreviewKeyDown="OnPreviewKeyDown"
                        PreviewTextInput="OnPreviewTextInput">
                <FlowDocument>
                    <Paragraph FontSize="13" Margin="0">
                        <Span>
                            <Run Text="{Binding Content}" xml:space="preserve">
                                <Run.Tag>
                                    <local:AllowHtml />
                                </Run.Tag>
                            </Run>
                        </Span>
                    </Paragraph>
                </FlowDocument>
            </RichTextBox>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

在这个例子中，我们定义了一个 DataGridTemplateColumn，它包含一个 RichTextBox。由于我们希望这个 RichTextBox 只用于显示 HTML 内容，所以我们将它的 IsReadOnly 设置为 True，并分别将 BorderThickness 和 Background 设置为 0 和 Transparent。接着，我们在样式中定义了一些事件处理程序，这些处理程序会在 RichTextBox 中输入 HTML 内容时控制其行为。在这个例子中，我们可以使用 AllowHtml 类来解析 HTML 内容。

结语

DataGrid 是 WPF 中一个非常强大的控件。通过上述介绍，相信大家对于如何实现校验数据、实现快捷键操作和显示 HTML 内容等功能已经有了一定的掌握。当然，DataGrid 还有很多其他的用法，欢迎大家在实际开发中继续探索和应用。