AutoCompleteBox如何实现鼠标点击后实现查询功能

在AutoCompleteBox控件中鼠标左键事件被屏蔽了，即使你绑定了鼠标左键事件，也不会响应。

下面我就介绍如何点击鼠标左键事件进行查询：

<sdk:AutoCompleteBox Name="WordTextBox" Height="48" Width="450" FilterMode="StartsWith"  ValueMemberBinding="{Binding Name}" FontSize="28"  ItemTemplate="{StaticResource AutoBoxDataTemplate}"  KeyUp="WordTextBox_KeyUp"  />

 

1.首先绑定数据源到ItemSource上。

     public class DicTag
    {
        public string Code { set; get; }
        public string Name { set; get; }
        public int Size { set; get; }
    }

绑定数据：List<DicTag> list=new List<DicTag>// list是一个包含DicTag的集合类

WordTextBox.ItemSorce=list;

注意：在AutoCompleteBox控件中需要添加 ValueMemberBinding="{Binding Name}"属性(上面红色部分)，其中Name是DicTag类的属性。这样才能把数据绑定到ItemSource，虽然 ValueMemberBinding="{Binding Name}"只进行了Name绑定，但只要在ItemTemplate中只进行了Code，Size的绑定，它们都会被显示出来。这里我们只在ItemTemplate中绑定了Name(见第二步),所以只会显示Name属性的值。 

2.然后对AutoCompleteBox的ItemTemplate模板进行绑定(红色部分)。

  <DataTemplate x:Key="AutoBoxDataTemplate">
            <Grid x:Name="AutoBoxDataPanel" Cursor="Hand"  Width="450"  MouseLeftButtonUp="AutoBoxDataPanel_MouseLeftButtonUp"  >

　　　　　　　　 <TextBlock x:Name="textBlock" Text="{Binding Path=Name}" FontSize="16" >　

　　　<Grid>

</DataTemplate>

3.在ItemTemplate模板中的Grid上写MouseLeftButtonUp事件(第二步中红色部分)。

后台处理事件：

private void AutoBoxDataPanel_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)

{

　　TextBlock block = (sender as Grid).FindName("textBlock") as TextBlock;

　　if (block != null)

　　{

　　　　string key = block.Text;

　　　　WordTextBox.Text=key;

　　　　Serach_Click(sender,e); // 触发搜索按钮

　　}

}

当我们在下拉列表中点击一项时，就会触发这个事件，并把该项的数据得到，提供操作。

4.对于点击回车也触发查询事件的话，需要在AutoCompleteBox控件中写入KeyUp事件。

如果我们不选择用鼠标点击，而是敲击回车键的话，也要达到查询事件的触发，可以在AutoCompleteBox添加KeyUp="WordTextBox_KeyUp"事件

后台事件处理：

       private void WordTextBox_KeyUp(object sender, KeyEventArgs e)
        {
            if (e.Key == Key.Enter)
            {
                string key = WordTextBox.Text.ToString().Trim();
                if (!string.IsNullOrEmpty(key))
                {
                    this.Serach_Click(sender, e); // 触发搜索按钮
                }
            }
        } 

 

 通过以上四步，就可以实现搜索时，点击鼠标和敲击回车时，实现搜索功能。