Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to display flatlist using LongListSelector phone control of WP8

In toolkit LongListSelector, there used to be a property IsFlatList which needed to be set to true to display flat list without any grouping. But in the LongListSelector provided in phone control, this property is missing. Here is what I am doing

<phone:LongListSelector Name="myList"  IsGroupingEnabled="False" LayoutMode="List" ItemsSource="{Binding Source ={StaticResource SortedList} }" CacheMode="BitmapCache"  >
                <phone:LongListSelector.ItemTemplate>
                    <DataTemplate>
                        <components:MyControl  CacheMode="BitmapCache" MyItem="{Binding}"/>
                    </DataTemplate>
                </phone:LongListSelector.ItemTemplate>
            </phone:LongListSelector>

If I change the control to ListBox and remove LongListSelector specific property then it display my list.

Can someone please tell me what I am missing? I am following this(Remarks) documentation of LongListSelector

like image 325
ua741 Avatar asked Jan 08 '13 08:01

ua741


2 Answers

In the Windows Phone 8 Version of the LongListSelector setting LayoutMode to List and IsGroupingEnabled to false should display your databound data as a flat list like in the WP7 Toolkit version of the control.

For example,

Given an Entity class

public class Entity
{
    public string Name
    {
        get;
        set;
    }

    public string Info
    {
        get;
        set;
    }

    public int ID
    {
        get;
        set;
    }
}

All I need to do is create an ObservableCollection of Entity on my page and bind it to the itemsource of my LongListSelector (named list).

ObservableCollection<Entity> data = new ObservableCollection<Entity>();
list.ItemsSourdce = data;

Then I create the entities and add them to the collection.

Here is the XAML for my LongListSelector:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <phone:LongListSelector Name="list" HorizontalAlignment="Left" Height="609" VerticalAlignment="Top" Width="456" LayoutMode="List" IsGroupingEnabled="False" >
            <phone:LongListSelector.ItemTemplate>
                <DataTemplate>
                    <StackPanel VerticalAlignment="Top">
                        <TextBlock FontWeight="Bold"  Text="{Binding Name}" />
                        <TextBlock Text="{Binding Info}" />
                    </StackPanel>
                </DataTemplate>
            </phone:LongListSelector.ItemTemplate>
        </phone:LongListSelector>
    </Grid>
like image 72
Strifex Avatar answered Sep 30 '22 22:09

Strifex


LayoutMode ="List" that's all you need.

like image 37
gleb.kudr Avatar answered Sep 30 '22 23:09

gleb.kudr