【资料图】

一、搜索栏SearchHandler的基本原理，如下图所示

• 搜索栏主要有两部分组成：UI控件和SearchHandler派生类。其中UI控件负责数据展示，并提供查询搜索和点击选择项的UI交互功能；SearchHandler派生类响应控件的查询和点击事件，并提供数据源、筛选结果和导航跳转功能。
• SearchHandler派生类有两个重写方法：OnQueryChanged和OnItemSelected。当UI控件输入查询关键词时，触发OnQueryChanged方法，在方法中对数据源进行筛选，并将筛选结果重新渲染到UI控件。当UI控件点击选择后，触发OnItemSelected方法，将方法中进行导航跳转。

二、搜索栏的使用

1、定义SearchHandler派生类，保存在Controls文件夹下

public class MonkeySearchHandler:SearchHandler{    //数据源，本例硬编码写死    public List Monkeys { get; set; } = new List    {        new Monkey { Name="zs",Age=18 },        new Monkey { Name="ls",Age=28 },        new Monkey { Name="ww",Age=38 },        new Monkey { Name="zl",Age=23 },        new Monkey { Name="qq",Age=29 }    };    //根据UI控件查询关键词筛选数据源    //参数oldValue为旧的查询关键词，newValue为新的查询关键词    protected override void OnQueryChanged(string oldValue, string newValue)    {        base.OnQueryChanged(oldValue, newValue);        if (string.IsNullOrWhiteSpace(newValue))        {            ItemsSource = null;        }        else        {            ItemsSource = Monkeys                .Where(m => m.Name.ToLower().Contains(newValue.ToLower()))                .ToList();        }    }    //根据UI控件选择项进行导航，使用查询参数传递路由参数。导航跳转的MonkeyDetail页面，如何接收参数，详见导航章节    //参数item为选择项    protected override async void OnItemSelected(object item)    {        base.OnItemSelected(item);        await Task.Delay(1000);        await Shell.Current.GoToAsync($"monkeydetail?name={((Monkey)item).Name}&age={((Monkey)item).Age}");    }}

2、在XAML页面中使用搜索栏，本例中为Monkey页面

                                                                                                                                                                                    ......

3、UI控件的其它属性设置