|
SfAutoComplete controls provide a support to bind with different data source such as IList Data Source, Observable Collection.
To add Data source in autocomplete follow the below given procedure:
Step 1: Create the autocomplete sample with all necessary assemblies. Step 2: Create an Observable collection where we have to store the data into it. Also create an instance of Observable collection. Set the instance of Observable collection to Autocomplete Data Source. Step 3: Create a view model class to bind the collection of viewmodel class on the datasource of AutoCompelete. Step 4: By changing DisplayMemberPath and SelectedValuePath we can achieve the data source.
The below code illustrates the way to achieve this. Code snippet:namespace AutoComplete
{
public partial class AutoCompletePage : ContentPage
{
public ObservableCollection<Person> personCollection;
SfAutoComplete autocomplete = new SfAutoComplete();
public AutoCompletePage()
{
//Initialize the autocomplete control
SfAutoComplete autocomplete = new SfAutoComplete();
autocomplete.DisplayMemberPath = "Name";
autocomplete.SelectedValuePath = "Age";
autocomplete.MaximumDropDownHeight = 200;
//Adding collections to the autocomplete.
personCollection = new ObservableCollection<Person>();
personCollection.Add(new Person("Joes", 30));
personCollection.Add(new Person("Anita", 20));
personCollection.Add(new Person("Gorge", 40));
personCollection.Add(new Person("Jessy", 50));
personCollection.Add(new Person("Arya", 60));
personCollection.Add(new Person("James", 35));
personCollection.Add(new Person("Akbar", 25));
personCollection.Add(new Person("Gabriel", 25));
personCollection.Add(new Person("Jeff", 37));
personCollection.Add(new Person("Anderson", 29));
autocomplete.DataSource = personCollection;
//Setting Layout for the autocomplete text box.
StackLayout autocompleteLayout = new StackLayout();
autocompleteLayout.Children.Add(autocomplete);
Content = autocompleteLayout;
}
public class Person : View
{
public Person(String _name, int _age)
{
this.Name = _name;
this.Age = _age;
}
public String Name
{
get { return (String)GetValue(NameProperty); }
set { SetValue(NameProperty, value); }
}
public static readonly BindableProperty NameProperty =
BindableProperty.Create<Person, String>(p => p.Name, "", BindingMode.Default, null, null);
public int Age
{
get { return (int)GetValue(AgeProperty); }
set { SetValue(AgeProperty, value); }
}
public static readonly BindableProperty AgeProperty =
BindableProperty.Create<Person, int>(p => p.Age, 22, BindingMode.Default, null, null);
}
}
}
The following screenshot shows the output of data source with its SelectedIndex.
Example 1:
Example 2:
|
2X faster development
The ultimate Xamarin UI toolkit to boost your development speed.
This page will automatically be redirected to the sign-in page in 10 seconds.
You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.
