Listpicker Design issue and unable to add 6th listpickerItem ...?

Question

I'm developing WP 8 application.

I need to add dropdown list in my app.I searched and find ListPicker is an alternate for Drop down in WP8.

I try with following code for List Picker:-

 <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <toolkit:ListPicker x:Name="Dropdown"   HorizontalAlignment="Center" VerticalAlignment="Top" ScrollViewer.HorizontalScrollBarVisibility="Visible" >
            <toolkit:ListPickerItem x:Name="one" Content="1"/>
            <toolkit:ListPickerItem x:Name="two" Content="1"/>
            <toolkit:ListPickerItem x:Name="three" Content="3"/>
            <toolkit:ListPickerItem x:Name="four" Content="4"/>
            <toolkit:ListPickerItem x:Name="five" Content="Testing"/>
            <!--<toolkit:ListPickerItem x:Name="seven" Content="Testing"/>-->
        </toolkit:ListPicker>

        <Button x:Name="btn1" HorizontalAlignment="Center" VerticalAlignment="Center" Background="White" Height="100" Width="150" Content="Click" Foreground="Red" Margin="0,-300,0,0" Click="btn1_Click"></Button>
    </Grid>

following image show the out put of this code.

my problem

1.If i click the list. background button show in list Item

2.If i add the 6th List picker Item. on click it's show the following error

An unhandled exception of type 'System.ArgumentException' occurred in System.Windows.ni.dll

How to solve this problem.... Thank you...

Answer 1

Here is another approach to use ListPicker(DropDown) in windows phone. its more flexible way to use listpicker in windows phone. Here is a sample code how to use listpicker, this may help you.

//In your xaml
<toolkit:ListPicker Height="60"  Name="Dropdown" ExpansionMode="FullScreenOnly"  Width="210" >
                <toolkit:ListPicker.ItemTemplate>
                    <DataTemplate>
                        <TextBlock  Text="{Binding}"/>
                    </DataTemplate>
                </toolkit:ListPicker.ItemTemplate>
                <toolkit:ListPicker.FullModeItemTemplate>
                    <DataTemplate>
                        <TextBlock   Text="{Binding}"  Margin="2,10,0,0" FontSize="31"/>
                    </DataTemplate>
                </toolkit:ListPicker.FullModeItemTemplate>
            </toolkit:ListPicker>



 protected override void OnNavigatedTo(NavigationEventArgs e)
   {
    if (e.NavigationMode != NavigationMode.Back)
      {
       //Code behind On page load event.
       List<string> dropDownList = new List<string>();
       dropDownList.Add("item1");
       dropDownList.Add("item2");
       dropDownList.Add("item3");
       dropDownList.Add("item4");
       dropDownList.Add("item5");
       dropDownList.Add("item6");
       dropDownList.Add("item7");
       dropDownList.Add("item8");

    Dropdown.ItemsSource = dropDownList;
   }
 }