How To Use Auto Suggest Box Control In Universal Window App

Prerequisites-

  • Visual Studio 2015

Now, let's get started with the steps, given below-

Step 1 - Create Windows Universal Project

Open Visual Studio 2015 and click File -> New -> Project Option for New Universal app.

New


Step 2- Giving the Project Name

New Project Window will open. You can select an Installed -> Template -> Visual C# -> Windows -> Universal and select a Blank App (Universal Windows).

Type Project Name AutoSuggestApp and click OK button.

AutoSuggestApp

Step 3 - Setting the platform Versions

Here, we choose the Target Version and Minimum Version for our Universal Windows Application. Click OK button.

Versions

Step 4 - Choose Designer Window

Now, we go to the Solution Explorer and open the MainPage.xaml for design.

 Solution Explorer

Step 5 - Designing the App

In the MainPage.xaml designing page, drag the Auto Suggest control from the tool box. Go to Property Window and change the name to Autosuggestcontrol

Designing

Next, change the Placeholder Text to search here.

Placeholder

Step 6 - Add the Coding

To add coding, double click on Auto Suggestion Control and add the mentioned source code.

Coding

  1. private string[] Autoitems = new string[] { "Sunday""Monday""Tuesday""Wednesday""Thursday""Friday""Saturday"};   
  1. private void Autosuggestcontrol_TextChanged(object sender, SelectionChangedEventArgs e) {  
  2.     var Auto = (AutoSuggestBox) sender;  
  3.     var Suggestion = Autoitems.Where(p => p.StartsWith(Auto.Text, StringComparison.OrdinalIgnoreCase)).ToArray();  
  4.     Auto.ItemsSource = Suggestion;  
  5. }  
Step 7 - Run the Application

Now, we are ready to run our project. Thus, click the Local Machine to run the Application.

Application

Output

Output

Output

Conclusion

I hope, you understood Auto Suggest Box control in Universal Window and how to run it.