AutoSuggestBox provides a list suggestions based on what user type. Suggestions works when text has been changed by the user and take care of providing relevant suggestions for the control to display.

Three type of actions mostly use in AutoSuggestBox,

Getting Stated:

Here are the steps to get started with Windows Universal App:

First drag and drop AutoSuggestBox control on page from toolbox.

  1. <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
  3. <AutoSuggestBox HorizontalAlignment="Left" x:Name="txtAutoSuggestBox" TextChanged="AutoSuggestBox_TextChanged" QuerySubmitted="AutoSuggestBox_QuerySubmitted" SuggestionChosen="AutoSuggestBox_SuggestionChosen" QueryIcon="Find" PlaceholderText="Search" VerticalAlignment="Top" Width="294" />
  5. </Grid>
  1. public sealed partial class MainPage: Page
  3. {
  4. public MainPage()
  5. {
  7. suggestions = new ObservableCollection < string > ();
  9. this.InitializeComponent();
  11. }
  13. private ObservableCollection < String > suggestions;
  15. private void AutoSuggestBox_TextChanged(AutoSuggestBox sender, AutoSuggestBoxTextChangedEventArgs args)
  17. {
  19. if (args.Reason == AutoSuggestionBoxTextChangeReason.UserInput)
  21. {
  23. suggestions.Clear();
  25. suggestions.Add(sender.Text + "1");
  27. suggestions.Add(sender.Text + "2");
  29. suggestions.Add(sender.Text + "3");
  31. suggestions.Add(sender.Text + "4");
  33. suggestions.Add(sender.Text + "5");
  35. suggestions.Add(sender.Text + "6");
  37. suggestions.Add(sender.Text + "7");
  39. suggestions.Add(sender.Text + "8");
  41. suggestions.Add(sender.Text + "9");
  43. sender.ItemsSource = suggestions;
  45. }
  47. }
  49. private void AutoSuggestBox_QuerySubmitted(AutoSuggestBox sender, AutoSuggestBoxQuerySubmittedEventArgs args)
  51. {
  53. if (args.ChosenSuggestion != null)
  55. txtAutoSuggestBox.Text = args.ChosenSuggestion.ToString();
  57. else
  59. txtAutoSuggestBox.Text = sender.Text;
  61. }
  63. private void AutoSuggestBox_SuggestionChosen(AutoSuggestBox sender, AutoSuggestBoxSuggestionChosenEventArgs args)
  65. {
  67. txtAutoSuggestBox.Text = "Choosen";
  69. }
  71. }
Output:

Enter a number in text box then suggestions also displaying.

Conclusion:

For more information, download attached source code of this sample. If any question, then please leave a comment in C# corner comment section.

Read more articles on Universal Windows Apps: