使用MahApps.Metro进行下拉式增量搜索

Question

有人可以指导我正确的方向，以便如何从文本输入中实现增量搜索，在文本输入字段下的下拉列表中显示替代项吗？

问题领域

我们已经能够在对话框中实现增量搜索，但是还不太了解如何从文本字段设计和实现它。 我们需要结合哪些组件/控件/元素，以及如何将它们连接起来？ 我们正在使用MahApps.Metro的1.1.2版本，并认为切换到预Alpha版本有点麻烦。

一个小例子

假设我们正在寻找名称，并且已经在字段中输入了sa ，那么我们希望使用带有该前缀的名称进行下拉，例如Samantha ， Sara ， Sarah ， Savannah ， more ...

Answer 1

为了实现它，您将需要一个文本框和一个弹出窗口。 有一个非常粗糙的示例，说明如何实现所需的功能。 一个ViewModel：

[PropertyChanged.ImplementPropertyChanged]
class SearchViewModel
{
    private readonly string[] items;
    public string[] SearchResults { get; private set; }
    public bool IsSearchShown { get; set; }
    public string SearchText { get; set; }

    private void OnSearchTextChanged() 
    {
        UpdateSearchResults();
        IsSearchShown = true;
    }

    public string SelectedSearchItem { get; set; }

    private void OnSelectedSearchItemChanged()
    {
        SearchText = SelectedSearchItem;
        IsSearchShown = false;
    }

    private void UpdateSearchResults()
    {
        SearchResults = items.Where(item => item.StartsWith(SearchText)).ToArray();
    }

    public SearchViewModel(string[] items)
    {
        this.items = items;
        SearchResults = new string[0];
    }
}

查看xaml：

<Grid>
    <TextBox Text="{Binding SearchText,UpdateSourceTrigger=PropertyChanged}" x:Name="searchTextBox"/>
    <Popup IsOpen="{Binding IsSearchShown}" PlacementTarget="{Binding ElementName=searchTextBox}">
        <ListBox ItemsSource="{Binding SearchResults}" SelectedItem="{Binding SelectedSearchItem}"/>
    </Popup>
</Grid>

为了简化我使用Fody.PropertyChanged的代码，请考虑到它将对OnSelectedSearchItemChanged和OnSearchTextChanged的调用注入到SelectedSearchItem和SearchText属性设置器中。