【C1FlexGrid&C1DataGrid】高亮显示表格中的查找结果

在应用系统中用户往往会有这样的需求，将表格中检索到的数据进行高亮显示。本文主要讲解如何在C1DataGrid/C1FlexGrid for WPF 控件中实现该功能。

首先，在UI中添加以下XAML代码：

<Grid>
<Grid.RowDefinitions >
   <RowDefinition Height="40" />
   <RowDefinition Height="30"/>
   <RowDefinition Height="Auto" />
   <RowDefinition Height="30"/>
   <RowDefinition Height="Auto" />
</Grid.RowDefinitions>
  <Button Content="Find" Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="button1" VerticalAlignment="Top" Width="75" Grid.Row="0" />
  <TextBox Height="24" HorizontalAlignment="Left" Margin="148,9,0,0" Name="textBox1" VerticalAlignment="Top" Width="120" />
  <TextBlock Height="23" HorizontalAlignment="Center" Margin="10,10,0,0" Name="textBlock1" Text="C1Flexgrid" VerticalAlignment="Center" Grid.Row="1" FontSize="15" FontWeight="Bold"  />
  <c1:C1FlexGrid Name="c1FlexGrid1" Grid.Row="2"/>
  <TextBlock Height="23" HorizontalAlignment="Center" Margin="10,10,0,0" Name="textBlock2" Text="C1DataGrid" VerticalAlignment="Center" Grid.Row="3" FontSize="15" FontWeight="Bold"  />
  <c1:C1DataGrid Grid.Row="4" Name="c1DataGrid1" />
</Grid>

然后，我们需要创建一个自定义的CellFactory类型，定义一个包含字符串类型参数的构造函数，并重写CreateCellContent方法，代码如下：

public class MyCellFactory : C1.WPF.FlexGrid.CellFactory
{
  string _text;
  
  public MyCellFactory()
  { }
  
  public MyCellFactory(string text)
  {
   _text = text;
  }
  
  public override void CreateCellContent(C1.WPF.FlexGrid.C1FlexGrid grid, Border bdr, C1.WPF.FlexGrid.CellRange range)
  {
    base.CreateCellContent(grid, bdr, range);
    if (range.Row >= grid.Rows[0].Index && range.Column >= grid.Columns[0].Index)
    {
     //Fetch text from TextBlock
     var tb = bdr.Child as TextBlock;
     if (tb != null)
     {
      if (tb.Text.Contains(_text))
       {
        //Call method from static class to change text Foreground
        Range.Find(_text, tb);
       }
     }
    }
  }
}

接着，我们创建一个静态类，其中包含Find方法，代码如下：

public static class Range
{
  public static void Find(string text, TextBlock _tb)
   {
     var tb = _tb as TextBlock;
     var si = tb.Text.IndexOf(text);
     // TextPointer to the position indicated by the specified offset
     // from the beginning of the current TextPointer
     var sp = tb.ContentStart.GetPositionAtOffset(si + 1);
     var ep = tb.ContentStart.GetPositionAtOffset(si + text.Length + 1);
  
     //Change ForeGround and FontWeight of the specified TextRange
     TextRange tr = new TextRange(sp, ep);
     tr.ApplyPropertyValue(TextElement.ForegroundProperty, Brushes.Red);
     tr.ApplyPropertyValue(TextElement.FontWeightProperty, FontWeights.Bold);
  }
}

完成以上工作之后，我们需要在用户输入检索关键字并点击按钮之后，将自定义的CellFactory类型设置给C1FlexGrid的CellFactory属性，代码如下：

string _text = string.Empty;
button1.Click += (s, e) =>
{
  _text = this.textBox1.Text;
  c1FlexGrid1.CellFactory = new MyCellFactory(_text);
};

以上就是在C1FlexGrid中实现高亮显示检索结果的全部代码。然而，C1DataGrid中没有提供CellFactory的概率， 所以，我们需要使用LoadedCellPresenter事件来捕获TextBlock，并把它以及检索文本传递到Range.Fand()方法中。 为了在每次用户输入检索文本之后都能高亮显示检索结果，我们需要在按钮的单击事件中刷新表格，代码如下：

c1DataGrid1.LoadedCellPresenter += (s, e) =>
 {
  //Get TextBlock using DataGridCellPresenter
  var presenter = ((C1.WPF.DataGrid.DataGridCellPresenter)(e.Cell.Presenter));
  var textblock = ((System.Windows.Controls.TextBlock)(((System.Windows.FrameworkElement)(presenter.Content))));
  if (textblock != null && _text != null)
  {
   if (textblock.Text.Contains(_text))
   {
    //Call method from static class to change text Foreground
    Range.Find(_text, textblock);
   }
  }
};
  
string _text = string.Empty;
  
button1.Click += (s, e) =>
 {
  _text = this.textBox1.Text;
  //refresh both Grids each time button is clicked for a new search
  c1FlexGrid1.CellFactory = new MyCellFactory(_text);
  c1DataGrid1.Refresh();
 };

运行程序，在文本框中输入 Web 和 Webb 测试，结果如下：

源码下载：VS2010 + C1 Studio for WPF

Wpf_C1Flex_TextForeColor.zip (10.19 kb)