ListPicker doesn't expand in StackPanel on WP7

Question

Another day another problem, this time I think with a simple issue into XAML formatting.

I have a ListPicker in a StackPanel on a XAML page in a WP7 app. Whenever I tap the ListPicker, it expands, but it appears to expand behind the item below it. If I have enough items in the list it opens in full screen mode which works fine.

Any suggestions, pointers would be appreciated;

<Grid Name="grdBought">

<StackPanel Visibility="Visible" Margin="0,0,0,0" Height="480">
    <Button Name="btnSave" Grid.Row="0" Content="Save" Height="100" HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Width="378" Click="btnSave_Click" />

        <StackPanel Grid.Row="1" Orientation="Vertical">


            <toolkit:ListPicker Name="CategoryPicker" Header="Select Category" HorizontalAlignment="Left" ItemsSource="{Binding Categories}" CacheMode="BitmapCache" TabIndex="0" Margin="0,0,0,0" SelectionChanged="CategoryPicker_SelectionChanged" Height="100" Width="195">
                <toolkit:ListPicker.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Vertical" HorizontalAlignment="Left">
                            <TextBlock Text="{Binding CategoryDesc}" FontFamily="{StaticResource PhoneFontFamilySemiBold}" FontSize="{StaticResource PhoneFontSizeMediumLarge}" />
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.ItemTemplate>

                <toolkit:ListPicker.FullModeItemTemplate>
                    <DataTemplate>
                        <StackPanel Name="item" Orientation="Vertical" Margin="0, 0, 0, 0">
                            <TextBlock Margin="0, 0, 0, 0" Text="{Binding CategoryDesc}" FontSize="40" TextWrapping="Wrap" />
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.FullModeItemTemplate>
            </toolkit:ListPicker>


            <StackPanel Name="Items" Grid.Row="1" Orientation="Horizontal">
                <TextBox Name="txtDescription" Height="100" Margin="0,0,0,0" Text="" Width="225" MaxLength="100" FontSize="40" InputScope="Text" />
                <TextBox Name="txtAmount" HorizontalAlignment="Left" Text="0.00" Height="100" Margin="0,0,0,0" TextAlignment="Right" FontSize="40" FontFamily="Segoe WP Semibold" Width="163" KeyUp="txtAmount_KeyUp" />
            </StackPanel>

        </StackPanel>

    <TextBlock Name="tb1" Text="Amount" Height="27" Margin="0,0,0,0" Width="137" />
    <Button Name="button1" Content="Button" Height="72" HorizontalAlignment="Left" Margin="249,0,0,0" VerticalAlignment="Top" Width="160" Click="button1_Click" />

</StackPanel>

I have been through the examples on the windowsphonegeek.com site, but I still can't make it work!

Answer 1

The issue is that you're setting the Height of the ListPicker to 100. Remove that, and just leave as auto. This is an issue b/c when you restrict the height, the listpicker has nowhere to expand (thus, showing the behavior you're seeing)

Answer 2

I guess height is creating an issue, just make sure that height of listpicker is greater than stackpanel.