Adding Data to a Picker's Items Collection
The Picker view is a control for selecting a text item from a list of data. This article explains how to populate a Picker with data by adding it to the Items collection, and how to respond to item selection by the user.
Populating a Picker with data
Prior to Xamarin.Forms 2.3.4, the process for populating a Picker
with data was to add the data to be displayed to the read-only Items
collection, which is of type IList<string>
. Each item in the collection must be of type string
. Items can be added in XAML by initializing the Items
property with a list of x:String
items:
<Picker Title="Select a monkey"
TitleColor="Red">
<Picker.Items>
<x:String>Baboon</x:String>
<x:String>Capuchin Monkey</x:String>
<x:String>Blue Monkey</x:String>
<x:String>Squirrel Monkey</x:String>
<x:String>Golden Lion Tamarin</x:String>
<x:String>Howler Monkey</x:String>
<x:String>Japanese Macaque</x:String>
</Picker.Items>
</Picker>
The equivalent C# code is shown below:
var picker = new Picker { Title = "Select a monkey", TitleColor = Color.Red };
picker.Items.Add("Baboon");
picker.Items.Add("Capuchin Monkey");
picker.Items.Add("Blue Monkey");
picker.Items.Add("Squirrel Monkey");
picker.Items.Add("Golden Lion Tamarin");
picker.Items.Add("Howler Monkey");
picker.Items.Add("Japanese Macaque");
In addition to adding data using the Items.Add
method, data can also be inserted into the collection by using the Items.Insert
method.
Responding to item selection
A Picker
supports selection of one item at a time. When a user selects an item, the SelectedIndexChanged
event fires, and the SelectedIndex
property is updated to an integer representing the index of the selected item in the list. The SelectedIndex
property is a zero-based number indicating the item that the user selected. If no item is selected, which is the case when the Picker
is first created and initialized, SelectedIndex
will be -1.
Note
Item selection behavior in a Picker
can be customized on iOS with a platform-specific. For more information, see Controlling Picker Item Selection.
The following code example shows the OnPickerSelectedIndexChanged
event handler method, which is executed when the SelectedIndexChanged
event fires:
void OnPickerSelectedIndexChanged(object sender, EventArgs e)
{
var picker = (Picker)sender;
int selectedIndex = picker.SelectedIndex;
if (selectedIndex != -1)
{
monkeyNameLabel.Text = picker.Items[selectedIndex];
}
}
This method obtains the SelectedIndex
property value, and uses the value to retrieve the selected item from the Items
collection. Because each item in the Items
collection is a string
, they can be displayed by a Label
without requiring a cast.
Note
A Picker
can be initialized to display a specific item by setting the SelectedIndex
property. However, the SelectedIndex
property must be set after initializing the Items
collection.