如何给wp(Windows phone)中搜索关键字加亮？

问题来源

最近在群里看到群友讨论在wp中有个搜索功能，要求搜索关键字在搜索结果内容中加亮(即加颜色),由于wp中没有自带这样的控件，于是大家各抒自见，有人说用第三方控件，有人说用richtextbox，也有人说用textblock和run！那究竟哪种实现比较好呢？个人看法，当然是用textblock和run实现起来是最方便的！

实现要求

1、给出关键字(如：我,购物,菜鸟,技术),关键字可以一个或者多个，多个用英文逗号隔开

2、能在搜索结果中对关键字进行加亮

3、能自定义加亮的颜色

4、要求复用性高

实现思路

如果要实现上面三点需求，首先我们想到是使用用户控件实现起来最好了，第一，二，三点分别用一个依赖属性表示，而第四点，既然是用户控件，作为一个控件，当然复用性强！

所以使用用户控件是再适合不过了！

材料准备

首先当然是在vs中新建一个wp的项目，然后添加一个用户控件的页面，这个估计不用我多说了，大家都会的了！在这里我新增一个HighlightControl的用户控件页面，在界面上添加一个TextBlock，命名为tbResult，打开codebehind，分别添加三个依赖属性，分别是TextProperty(搜索结果),HighlightWordProperty(关键字),HighlightWordColorProperty(加亮颜色)，然后添加对应的包装属性，再添加回调方法！这些应该不用详解吧，学过wpf或者silverlight对这些应该很了解了！如果不懂可以评论问问！

下面贴出用户控件codebehind相应代码

 public static readonly DependencyProperty TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(HighlightControl), new PropertyMetadata(new PropertyChangedCallback(HighlightControl.OnTextChanged)));
        public static readonly DependencyProperty HighlightWordProperty = DependencyProperty.Register("HighlightWord", typeof(string), typeof(HighlightControl), new PropertyMetadata(new PropertyChangedCallback(HighlightControl.OnHighlightWordChanged)));
        public static readonly DependencyProperty HighlightWordColorProperty = DependencyProperty.Register("HighlightWordColor", typeof(SolidColorBrush), typeof(HighlightControl), new PropertyMetadata(new SolidColorBrush(Color.FromArgb(255, 0, 155, 227)), new PropertyChangedCallback(HighlightControl.OnHighlightWordColorChanged)));

        public string Text
        {
            get
            {
                return (string)base.GetValue(HighlightControl.TextProperty);
            }
            set
            {
                base.SetValue(HighlightControl.TextProperty, value);
            }
        }

        public SolidColorBrush HighlightWordColor
        {
            get
            {
                return (SolidColorBrush)base.GetValue(HighlightControl.HighlightWordColorProperty);
            }
            set
            {
                base.SetValue(HighlightControl.HighlightWordColorProperty, value);
            }
        }

        public string HighlightWord
        {
            get
            {
                return (string)base.GetValue(HighlightControl.HighlightWordProperty);
            }
            set
            {
                base.SetValue(HighlightControl.HighlightWordProperty, value);
            }
        }


        private static void OnTextChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            HighlightControl control = d as HighlightControl;
            if (e.NewValue == e.OldValue)
            {
                return;
            }
            HighlightControl.UpdateHighlight(control);
        }

        private static void OnHighlightWordChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            HighlightControl control = d as HighlightControl;
            HighlightControl.UpdateHighlight(control);
        }

        private static void OnHighlightWordColorChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            HighlightControl control = d as HighlightControl;
            HighlightControl.UpdateHighlight(control);
        }





        private static void UpdateHighlight(HighlightControl control)
        {
            if (control == null)
            {
                return;
            }
            TextBlock textBlock = control.tbResult;
            if (textBlock.Inlines.Count() > 0)
            {
                textBlock.Inlines.Clear();
            }
            //如果高亮为空，直接显示
            if (string.IsNullOrEmpty(control.HighlightWord))
            {
                Run run = new Run();
                run.Text = control.Text;
                textBlock.Inlines.Add(run);
                return;
            }
            string text = control.Text;
            if (string.IsNullOrEmpty(text))
            {
                return;
            }
            TextBlock tempTextBlock = new TextBlock();//中间变量，方便run交换
            string[] hightwordArray = control.HighlightWord.Split(',');
            List<Run> listHightRun = new List<Run>();//添加已经加亮的run，方便判断
            for (int i = 0; i < hightwordArray.Length; i++)
            {
                if (hightwordArray[i] == "") continue;//这个是放在关键字中有""，导致死循环

                if (i == 0)
                {
                    for (int num = text.IndexOf(hightwordArray[i], 0); num != -1; num = text.IndexOf(hightwordArray[i], 0))
                    {
                        //  MessageBox.Show(num.ToString());
                        if (num != 0)
                        {
                            Run run2 = new Run();
                            run2.Text = text.Substring(0, num);
                            // textBlock.Inlines.Add(run2);
                            tempTextBlock.Inlines.Add(run2);

                        }
                        Run run3 = new Run();
                        run3.Text = text.Substring(num, hightwordArray[i].Length);
                        run3.Foreground = control.HighlightWordColor;
                        listHightRun.Add(run3);
                        //textBlock.Inlines.Add(run3);
                        tempTextBlock.Inlines.Add(run3);
                        text = text.Substring(num + hightwordArray[i].Length);
                        // MessageBox.Show(text);
                    }
                    if (!string.IsNullOrEmpty(text))
                    {
                        Run run4 = new Run();
                        run4.Text = text;
                        tempTextBlock.Inlines.Add(run4);//剩下没有被加亮的文字，加到一个run
                    }

                }
                else
                {
                    // text = control.Text;
                    //  MessageBox.Show("要遍历textBlock长度：" + textBlock.Inlines.Count.ToString());
                    for (int j = 0; j < textBlock.Inlines.Count; j++)
                    {
                        if (listHightRun.Any(h => h.Equals((textBlock.Inlines[j] as Run))))//如果是一个加亮的run，那就不需要遍历了
                        {
                            // MessageBox.Show("jin" + (textBlock.Inlines[j] as Run).Text);
                            Run runExist = (textBlock.Inlines[j] as Run);
                            textBlock.Inlines.Remove(textBlock.Inlines[j]);
                            tempTextBlock.Inlines.Add(runExist);
                            j--;
                            //  MessageBox.Show("移除元素后textBlock长度：" + textBlock.Inlines.Count + "  j： " + j);
                            continue;
                        }
                        string tempStr = (textBlock.Inlines[j] as Run).Text;
                        for (int num = tempStr.IndexOf(hightwordArray[i], 0); num != -1; num = tempStr.IndexOf(hightwordArray[i], 0))
                        {
                            //MessageBox.Show("要遍历的字符串："+tempStr);
                            //MessageBox.Show("关键字是否存在:"+num.ToString());
                            //MessageBox.Show("关键字："+hightwordArray[i]);
                            if (num != 0)
                            {
                                Run run2 = new Run();
                                run2.Text = tempStr.Substring(0, num);

                                tempTextBlock.Inlines.Add(run2);
                            }
                            Run run3 = new Run();
                            run3.Text = tempStr.Substring(num, hightwordArray[i].Length);
                            run3.Foreground = control.HighlightWordColor;
                            listHightRun.Add(run3);
                            tempTextBlock.Inlines.Add(run3);
                            tempStr = tempStr.Substring(num + hightwordArray[i].Length);
                            // (textBlock.Inlines[j] as Run).Text = (textBlock.Inlines[j] as Run).Text.Substring(num + hightwordArray[i].Length);
                        }
                        if (!string.IsNullOrEmpty(tempStr))//剩下没有被加亮的文字，加到一个run
                        {
                            Run run4 = new Run();
                            run4.Text = tempStr;
                            tempTextBlock.Inlines.Add(run4);
                        }
                    }
                }
                textBlock.Inlines.Clear();

                int k = 0;
                while (k < tempTextBlock.Inlines.Count)
                {
                    Run tempRun = tempTextBlock.Inlines[k] as Run;
                    tempTextBlock.Inlines.Remove(tempTextBlock.Inlines[k]);
                    textBlock.Inlines.Add(tempRun);
                    k = 0;

                }

                //tempTextBlock.Inlines.Clear();

            }



        }

测试页面代码

   <!--LayoutRoot 是包含所有页面内容的根网格-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

    

        <!--TitlePanel 包含应用程序的名称和页标题-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock Text="我的应用程序" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
            <TextBlock Text="页面名称" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - 在此处放置其他内容-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            
            <control:HighlightControl Text="这是一个显示加亮在搜索结果中的关键字的用户控件" HighlightWord="高,的,这是,测试,亮,段" HighlightWordColor="Red">
                
            </control:HighlightControl>

        </Grid>

       
    </Grid>

整个实现大概就是这样，最后截一张图给大家看看。

 

总结

问题总有解决的方法的，很多你看似是比较困难的事情，其实都是由最基础的知识去一步步分解出来解决的，所以善于思考，举一反三，才是快速解决问题的根本途径！