文档章节

【万里征程——Windows App开发】在应用中集成搜索

NoMasp
 NoMasp
发布于 2015/09/08 21:46
字数 1109
阅读 2
收藏 0

已经刚刚一个月没有更新这个专栏了,今天开始要连续更新几篇啦~

上一篇我们学习的是如何添加设置,这一篇讲的是和设置类似的搜索。

So…… Let’s do it !

先从简单的页面布局开始,想想我们需要什么,一个带搜索事件的Button,还需要一些TextBlock来提示用户,核心部分自然是一个GridView咯。

<Grid Background="Wheat">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>

        <StackPanel Grid.Row="0" Orientation="Vertical">
            <Button Grid.Row="0" Name="btnSearch" VerticalAlignment="Center" HorizontalAlignment="Left" Content="搜索" FontFamily="华文行楷" Click="btnSearch_Click" Margin="12" FontSize="34" Foreground="Red"/>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="搜索关键词" Foreground="Green" FontSize="28" Margin="12"/>
                <TextBlock FontSize="28" Foreground="Green" Name="tBlockKeyword" Margin="12"/>
            </StackPanel>                   
        </StackPanel>

        <GridView Grid.Row="1" Margin="12" x:Name="gridView">
            <GridView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapGrid Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </GridView.ItemsPanel>
            <GridView.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}" FontSize="24" Foreground="Pink" FontFamily="楷体"/>
                </DataTemplate>
            </GridView.ItemTemplate>
        </GridView>
    </Grid>

既然界面完成了,就该去后台捣鼓咯。搜索的核心在于SearchPane,所以先来实例化它。为了简化,我们就将待搜索的内容设置为一串字符串数组好了,当然了,初始化数组的方式大家随意就好了。

SearchPane searchPane = null;
string[] exampleStr = new string[100];

public  void InitExampleStr()
{
     Random ran = new Random();
     int exNumber;
     for(int i=0;i<100;i++)
     {
          exNumber = ran.Next(1000, 9999);
          exampleStr[i] = exNumber.ToString();                             
      }                                                                                     
}

当用户在搜索框中输入的内容发生了更改时就会触发searchPane_QueryChange事件。

当用户在完成输入后按下Enter键或者点击旁边的搜索确认按钮后就会触发searchPane_QuerySubmitted事件。

        void searchPane_QueryChanged(SearchPane sender, SearchPaneQueryChangedEventArgs args)
        {                                     
            this.tBlockKeyword.Text = args.QueryText;
        }

        void searchPane_QuerySubmitted(SearchPane sender, SearchPaneQuerySubmittedEventArgs args)
        {       
            string key = args.QueryText;
            var result = exampleStr.Where(s => s.Contains(key)).ToArray(); 
            this.gridView.ItemsSource = result;
        }

然后我们还需要这两个事件在OnNavigatedTo中绑定以及在OnNavigatedFrom中解绑。

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            this.searchPane.QuerySubmitted += searchPane_QuerySubmitted;
            this.searchPane.QueryChanged += searchPane_QueryChanged;
        }

        protected override void OnNavigatedFrom(NavigationEventArgs e)
        {
            this.searchPane.QuerySubmitted -= searchPane_QuerySubmitted;
            this.searchPane.QueryChanged -= searchPane_QueryChanged;
        }

然后我们需要点击Button控件来调出系统的搜索框,一行代码就足以搞定了。如果不想点击按钮也是可以得哦,可以让用户直接在键盘输入而调出搜索框呢。

        private void btnSearch_Click(object sender, RoutedEventArgs e)
        {
            this.searchPane.Show();
        }
 this.searchPane.ShowOnKeyboardInput = true;

最后别忘了将他们都放到MainPage()中哦,

        public MainPage()
        {
            this.InitializeComponent();
            searchPane = SearchPane.GetForCurrentView();
            InitExampleStr();              
            this.searchPane.PlaceholderText = "请输入关键字";           
            this.searchPane.ShowOnKeyboardInput = true;
        }

所以说,总的代码是这样的。

        SearchPane searchPane = null;
        string[] exampleStr = new string[100];

        public MainPage()
        {
            this.InitializeComponent();
            searchPane = SearchPane.GetForCurrentView();
            InitExampleStr();              
            this.searchPane.PlaceholderText = "请输入关键字";           
            this.searchPane.ShowOnKeyboardInput = true;
        }

        public  void InitExampleStr()
        {
            Random ran = new Random();
            int exNumber;
            for(int i=0;i<100;i++)
            {
                exNumber = ran.Next(1000, 9999);
                exampleStr[i] = exNumber.ToString();                             
            }                                                                                     
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            this.searchPane.QuerySubmitted += searchPane_QuerySubmitted;
            this.searchPane.QueryChanged += searchPane_QueryChanged;
        }

        protected override void OnNavigatedFrom(NavigationEventArgs e)
        {
            this.searchPane.QuerySubmitted -= searchPane_QuerySubmitted;
            this.searchPane.QueryChanged -= searchPane_QueryChanged;
        }

        void searchPane_QueryChanged(SearchPane sender, SearchPaneQueryChangedEventArgs args)
        {                                     
            this.tBlockKeyword.Text = args.QueryText;
        }

        void searchPane_QuerySubmitted(SearchPane sender, SearchPaneQuerySubmittedEventArgs args)
        {       
            string key = args.QueryText;
            var result = exampleStr.Where(s => s.Contains(key)).ToArray();             
            this.gridView.ItemsSource = result;
        }

        private void btnSearch_Click(object sender, RoutedEventArgs e)
        {
            this.searchPane.Show();
        }
    }

在清单文件中声明你需要使用“Search”功能后就可以开始调试咯。

这里写图片描述

这里写图片描述

大家肯定都用的音乐播放器肯定都会在搜索框下面给出一些建议吧,或者大家常用的地图等App。

那么我们就对前面的代码进行更新就好啦。

下面这段代码呢,就是根据用户的输入来显示建议列表的方法咯。

        void searchPane_SuggestionsRequested(SearchPane sender, SearchPaneSuggestionsRequestedEventArgs args)
        {

            var deferralSeg= args.Request.GetDeferral();

            var q = from i in exampleStr
                    where i.Contains(args.QueryText)
                    select i;
            var res = q.Take(suggestionLen).ToArray();

            foreach (var item in res)
            {
                args.Request.SearchSuggestionCollection.AppendQuerySuggestion(item);
            }

            deferralSeg.Complete();
        }       

这篇博客,使用大量LINQ技术,如果不太懂的话可以看看这里。
传送门:【LINQ技术】扩展特性和LINQ操作符

使用搜索建议的最大好处在于我们可以选择并非自己输入的内容,这个功能就由下面这段代码提供动力支持。

        void searchPane_ResultSuggestionChosen(SearchPane sender, SearchPaneResultSuggestionChosenEventArgs args)
        {                      
            sender.TrySetQueryText(args.Tag);

            var q = from t in exampleStr
                    where t.Contains(args.Tag)
                    select t;
            this.gridView.ItemsSource = q.ToArray();
        }

我们还可以对前面的searchPane_QuerySubmitted函数做如下修改。

        void searchPane_QuerySubmitted(SearchPane sender, SearchPaneQuerySubmittedEventArgs args)
        {
            //var q = from extStr in exampleStr
            //        where extStr.Contains(args.QueryText)
            //        select extStr;
            //this.gridView.ItemsSource = q.ToArray();

            string key = args.QueryText;
            var result = exampleStr.Where(s => s.Contains(key)).ToArray();
            this.gridView.ItemsSource = result;
        }

最后还需要将他们添加到OnNavigatedTo和OnNavigatedFrom方法中。

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            this.searchPane.QuerySubmitted += searchPane_QuerySubmitted;
            this.searchPane.QueryChanged += searchPane_QueryChanged;
            this.searchPane.SuggestionsRequested += searchPane_SuggestionsRequested;
            this.searchPane.ResultSuggestionChosen += searchPane_ResultSuggestionChosen;
        }

        protected override void OnNavigatedFrom(NavigationEventArgs e)
        {
            this.searchPane.QuerySubmitted -= searchPane_QuerySubmitted;
            this.searchPane.QueryChanged -= searchPane_QueryChanged;
            this.searchPane.SuggestionsRequested -= searchPane_SuggestionsRequested;
            this.searchPane.ResultSuggestionChosen -= searchPane_ResultSuggestionChosen;
        }

然后调试就会是这个效果咯。

这里写图片描述



感谢您的访问,希望对您有所帮助。 欢迎大家关注、收藏以及评论。


为使本文得到斧正和提问,转载请注明出处:
http://blog.csdn.net/nomasp


版权声明:本文为 NoMasp柯于旺 原创文章,未经许可严禁转载!欢迎访问我的博客:http://blog.csdn.net/nomasp

本文转载自:http://blog.csdn.net/nomasp/article/details/45787997

NoMasp
粉丝 7
博文 334
码字总数 0
作品 0
镇江
程序员
私信 提问
加载中

评论(0)

nomasp 博客导读:Lisp/Emacs、Algorithm、Android

版权声明:转载请联系本人,感谢配合!本站地址:http://blog.csdn.net/nomasp https://blog.csdn.net/NoMasp/article/details/44966625 Profile Introduction to Blog 您能看到这篇博客导读...

nomasp
2015/09/17
0
0
浙江万里学院-阿里云大数据应用学院2018级新生开学典礼隆重举行

2018年10月11日,由浙江万里学院、阿里云、慧科集团三方共建的阿里云大数据应用学院2018级新生开学典礼在浙江万里学院隆重举行。浙江万里学院阿里云大数据应用学院不仅是浙江省首个,也是目前...

昕华
2018/10/12
0
0
人工智能看片彻底火了!11家公司融资5亿 腾讯阿里抢入局

  近日,国内医疗AI创企医拍智能(原名“拍医拍”)宣布完成数千万元A+轮融资,其业务范围也进行了拓宽,由原有的医疗单据拍照识别拓展到CT、X光等医疗影像的识别与诊断,正式进军AI医疗影...

数愿大数据人工智能竞赛平台
2017/08/17
0
0
『远山淡影』——逝去往昔的记忆拼图

远山淡影,书名就很有禅意,有种中国泼墨山水画的意境,不禁让人遐想。这是今年诺贝尔奖文学奖获得者石黑一雄出道的作品,也是我读的第一本他的书。 远山淡影封面 故事有两条线,一条线是悦子...

知猪侠_CD
2017/11/26
0
0
从未卜先知的信号灯说起,阿里城市大脑的智慧交通实践

     大数据文摘出品   记者:龙牧雪、郑璇真   “马路上最常见的信号灯,其实已经有一百多年的历史,而在这一百多年里,竟然没有什么变化。”   在2018世界交通大会上,阿里云机器...

大数据文摘
2018/07/04
0
0

没有更多内容

加载失败,请刷新页面

加载更多

00-Java 面试准备

面试之前 面试前准备简历需要注意的几个方面: 写简历、改简历,这个一定要干的。简历有两个作用,一个是吸引别人,能让别人邀请你去面试,这是前提;另一个是引导面试的人,让面试的人问你所...

源程序
今天
54
0
OSChina 周二乱弹 —— 大王(@罗马的王)颜值制霸Osc社区

Osc乱弹歌单(2020)请戳(这里) 【今日歌曲】 @巴拉迪维 :Lunik的单曲《Seeing You Soar》 I hope you’re smiling,When seeing me soar. #今日歌曲推荐# 《Seeing You Soar》- Lunik 手...

小小编辑
今天
83
0
wordcount代码

1.写出map类 public class WCMapper extends Mapper<LongWritable,Text,Text,LongWritable>{ @Override protected void map(LongWritable key,Text value,Context context)throws IOExcepti......

七宝1
今天
59
0
Spring Batch 小任务(Tasklet)步骤

Chunk-Oriented Processing不是处理 step 的唯一方法。 考虑下面的一个场景,如果你仅仅需要调用一个存储过程,你可以在 ItemReader 中实现这个调用,然后在存储过程完成调用后返回 null。这...

honeymoose
今天
67
0
Linux日志分析

1. Linux日志文件的类型 2. 系统服务日志 2.1 syslogd的简介 2.2 syslogd的配置和使用 2.3 日志的安全性设置 2.4 远程日志记录服务 3. 日志的轮替 3.1 logrotate简介 3.2 logrotate的配置 3....

JiaMing
昨天
67
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部