[UWPアプリ][AutoSuggestBox] 候補を表示する

「候補項目を追加する」の記事で、項目の追加方法を紹介しました。

しかし、この方法ではどのような文字が入力されてもすべての項目が表示されてしまいます。

入力された文字に合う候補を表示するには、TextChangedイベントの中でItemSourceに項目を設定します。

public sealed partial class MainPage : Page
{
    List<string> items = new List<string>();

    public MainPage()
    {
        this.InitializeComponent();
        
        items.Add("apple");
        items.Add("orange");
        items.Add("banana");

    }

    private void autoSuggest_TextChanged(AutoSuggestBox sender, AutoSuggestBoxTextChangedEventArgs args)
    {
        if (args.Reason == AutoSuggestionBoxTextChangeReason.UserInput)
        {
            sender.ItemsSource = items.FindAll(x => x.StartsWith(sender.Text));
        }
    }
}

上記のTextChangedイベント内にあるif文ではユーザーによる入力かどうかを判断しています。

ユーザーによる入力だった場合には、items.FindAllメソッドを使用して、入力した文字ではじまるアイテムをすべて取得してItemsSourceに設定しています。

実行例は以下の通りです。例として「b」を入力すると、候補として「banana」が表示されます。

候補の表示

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

This site uses Akismet to reduce spam. Learn how your comment data is processed.