LonglistSelector in scrollViewer not scrollable

Question

In my project, I need to show a list of buttons with choices in custommessagebox.

Now, I have no problem in setting it up, but when I create the longlistselector, add it to scrollviewer and show the cusstommessagebox, only a few buttons are shown and i can't scroll for more.

The code I have is following:

    private void btnChronicity_ButtonClicked(object sender, Events.LinkEventArgs e)
    {
        editBox = new CustomMessageBox() 
        {
           ....
        };

        ScrollViewer viewer = new ScrollViewer();
        choiceSelector = new Controls.MessageBocChoiceSelectorControl();
        List<items> chronicity = new List<items>();
        foreach (ChronicityModel chronicity in ...Chronicities)
        {
            chronicity.Add(new items(chronicity.Name, chronicity.Selected, chronicity.Id));
        }

        choiceSelector.ItemSource = chronicity;
        editBox.Content = viewer;
        editBox.Show();
    }

and the choiceselector is usercontrol, which looks like:

<StackPanel>
    <Controls:LongListSelector x:Name="LayoutRoot">
        <Controls:LongListSelector.ItemTemplate>
            <DataTemplate>
                <Controls1:CheckableListButton Header1="{Binding Header}"
                                           Selected="{Binding Selected}"
                                           Link="{Binding Link}"
                                           ButtonClicked="CheckableListButton_ButtonClicked"/>
            </DataTemplate>
        </Controls:LongListSelector.ItemTemplate>
    </Controls:LongListSelector>
</StackPanel>

where listbutton is another control, basically button containing several textBlocks, boolean indicating whether it is selected (another style) or not and a string Link, which is returned in custom click event.

The result looks this way:

But the problem is I can't scroll...

Why is it behaving like that? How to fix it?

EDIT:

As I play with the longlistselector and stuff around I have found out that the scrolling works, the problem is the LongListSelector only loads as much items as fits the messagebox instead all of them..... (when i create smaller messagebox, it shows less items, when i create bigger, it shows more)

So the question shifted a bit to:

HOW TO MAKE LONGLISTSELECTOR SHOW ALL OF THE ITEMS INSTEAD OF JUST AS MUCH AS FITS THE SCREEN.

Answer 1

This is how I used longlistselector in my code and it works perfectly for me with infinite scrolling. See if it helps you.

<Grid Background="#FFE6E2E2" Margin="10,10,0,0">
 <phone:LongListSelector x:Name="lb" Margin="0,0,0,0" ItemTemplate="{StaticResource ItemTemplate}"></phone:LongListSelector>
</Grid>

Answer 2

So there are three distinct problems I see with the code:

1. You are creating a new instance of the ScrollViewer in C#, but you are not actually adding the choiceSelector instance to the viewer instance. Not sure if you just left that out in your sample, or you are not actually adding it.

2. I would not recommend adding a LongListSelector in a ScrollViewer.... because it already scrolls by default. Your problem is that you're putting the LongListSelector in a StackPanel, which will not constrain the height of the LongListSelector in any way.

   Instead I would put the LongListSelector in a Grid control, with the row height defined as *. This will mean that the Grid height is constrained to the parent container.

3. Having said that, have you looked into the ListPicker control from the http://phone.codeplex.com Toolkit? That seems like it is a little closer to what you are looking for.

HTH

Answer 3

Restrict the height of the longlistselector to some 200 or so, which is less than the height of the usercontrol. Make sure you mention the Height = " " property in the xaml of the longlist selector.