<phone:PhoneApplicationPage.Resources><!—定义组头绑定模板--><DataTemplate x:Key="GroupHeader"><Border Background="{StaticResource PhoneAccentBrush}" Margin="{StaticResource PhoneTouchTargetOverhang}" Padding="{StaticResource PhoneTouchTargetOverhang}"><TextBlock Text="{Binding Key}"/></Border></DataTemplate><!—定义组选项绑定模板--><DataTemplate x:Key="GroupItem"><Border Background="{StaticResource PhoneAccentBrush}" Margin="{StaticResource PhoneTouchTargetOverhang}" Padding="{StaticResource PhoneTouchTargetOverhang}"><TextBlock Text="{Binding Key}" Style="{StaticResource PhoneTextLargeStyle}"/></Border></DataTemplate><!—定义列头绑定模板--><DataTemplate x:Key="ListHeader"><TextBlock Text="Header" Style="{StaticResource PhoneTextTitle1Style}"/></DataTemplate><!—定义列表选项绑定模板--><DataTemplate x:Key="ItemTmpl"><Grid><TextBlock Text="{Binding Title}"></TextBlock></Grid></DataTemplate></phone:PhoneApplicationPage.Resources>……<!--添加LongListSelector控件--><Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"><toolkit:LongListSelector x:Name="LongList" Background="Transparent" ItemTemplate="{StaticResource ItemTmpl}"ListHeaderTemplate="{StaticResource ListHeader}" GroupHeaderTemplate="{StaticResource GroupHeader}"GroupItemTemplate="{StaticResource GroupItem}" ></toolkit:LongListSelector></Grid></Grid></phone:PhoneApplicationPage>

using System;using System.Collections.Generic;using System.Linq;using System.Windows;using System.Windows.Controls;using Microsoft.Phone.Controls;namespace LongListSelectorDemo{public partial class MainPage : PhoneApplicationPage{public MainPage(){InitializeComponent();//使用List<T>来初始化数据
List<Item> mainItem = new List<Item>();for (int i = 0; i < 10; i++){mainItem.Add(new Item() { Content = "A类别", Title = "测试A " + i.ToString() });mainItem.Add(new Item() { Content = "B类别", Title = "测试B" + i.ToString() });mainItem.Add(new Item() { Content = "C类别", Title = "测试C" + i.ToString() });}//使用Linq来查询List<Item>数据 按照Content来进行分组var selected = from c in mainItem group c by c.Content into n select new GroupingLayer<string, Item>(n);this.LongList.ItemsSource = selected;}//继承Linq的IGrouping接口  来存储分组的数据public class GroupingLayer<TKey, TElement> : IGrouping<TKey, TElement>{//分组数据private readonly IGrouping<TKey, TElement> grouping;//初始化public GroupingLayer(IGrouping<TKey, TElement> unit){grouping = unit;}//唯一的键值public TKey Key{get { return grouping.Key; }}//重载判断相等方法public override bool Equals(object obj){GroupingLayer<TKey, TElement> that = obj as GroupingLayer<TKey, TElement>;return (that != null) && (this.Key.Equals(that.Key));}public IEnumerator<TElement> GetEnumerator(){return grouping.GetEnumerator();}System.Collections.IEnumerator System.Collections.IEnumerable.GetEnumerator(){return grouping.GetEnumerator();}}//List选项的类  Content表示类别 Title表示选项的标题public class Item{public string Title { get; set; }public string Content { get; set; }}}}

namespace LongListSelectorDemo{/// <summary>/// 选项实体类/// </summary>public class Item{public string Name { get; set; }public string Content { get; set; }//获取名字的首个字符用来作为分组的依据public static string GetFirstNameKey(Item item){char key;key = char.ToLower(item.Name[0]);if (key < 'a' || key > 'z'){key = '#';}return key.ToString();}}}

using System.Collections.Generic;namespace LongListSelectorDemo{/// <summary>/// 组集合/// </summary>public class ItemInGroup: List<Item>{public ItemInGroup(string category){Key = category;}//组的键public string Key { get; set; }//组是否有选项public bool HasItems { get { return Count > 0; } }}}

using System.Collections.Generic;namespace LongListSelectorDemo{/// <summary>/// 总数据集合/// </summary>public class Items: List<ItemInGroup>{//索引private static readonly string Groups = "#|a|b|c|d|e|f|g|h|i|j|k|l|m|n|o|p|q|r|s|t|u|v|w|x|y|z";public Items(){//获取要绑定的数据源
List<Item> items = new List<Item>();items.Add(new Item { Name = "a测试", Content = "a内容" });items.Add(new Item { Name = "b测试", Content = "b内容" });items.Add(new Item { Name = "c测试", Content = "c内容" });items.Add(new Item { Name = "d测试", Content = "d内容" });items.Add(new Item { Name = "e测试", Content = "e内容" });items.Add(new Item { Name = "f测试", Content = "f内容" });items.Add(new Item { Name = "g测试", Content = "g内容" });//组的字典列表
Dictionary<string, ItemInGroup> groups = new Dictionary<string, ItemInGroup>();//初始化组列表，即用字母列表来分组foreach (string c in Groups.Split('|')){ItemInGroup group = new ItemInGroup(c.ToString());//添加组数据到集合this.Add(group);groups[c.ToString()] = group;}//初始化选项列表，即按照选项所属的组来放进它属于的组里面foreach (Item item in items){//添加选项数据到集合
groups[Item.GetFirstNameKey(item)].Add(item);}}}}

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"><toolkit:LongListSelector x:Name="longListSelector" Background="Transparent"Margin="0,-8,0,0"><toolkit:LongListSelector.GroupItemsPanel><ItemsPanelTemplate><toolkit:WrapPanel Orientation="Horizontal"/></ItemsPanelTemplate></toolkit:LongListSelector.GroupItemsPanel><toolkit:LongListSelector.GroupItemTemplate><DataTemplate><Border Background="Red" Width="99" Height="99" Margin="6" IsHitTestVisible="{Binding HasItems}"><TextBlock Text="{Binding Key}" FontFamily="{StaticResource PhoneFontFamilySemiBold}"FontSize="48"Margin="8,0,0,0"Foreground="White"                                        VerticalAlignment="Bottom"/></Border></DataTemplate></toolkit:LongListSelector.GroupItemTemplate><toolkit:LongListSelector.GroupHeaderTemplate><DataTemplate><Border Background="Transparent" Margin="12,8,0,8"><Border Background="{StaticResource PhoneAccentBrush}"     Padding="8,0,0,0" Width="62" Height="62"                  HorizontalAlignment="Left"><TextBlock Text="{Binding Key}" Foreground="#FFFFFF" FontSize="48"FontFamily="{StaticResource PhoneFontFamilySemiLight}"HorizontalAlignment="Left"VerticalAlignment="Bottom"/></Border></Border></DataTemplate></toolkit:LongListSelector.GroupHeaderTemplate><toolkit:LongListSelector.ItemTemplate><DataTemplate><Grid Margin="12,8,0,8"><Grid.ColumnDefinitions><ColumnDefinition Width="Auto"/><ColumnDefinition Width="*"/></Grid.ColumnDefinitions><StackPanel Grid.Column="1" VerticalAlignment="Top"><TextBlock Text="{Binding Name}" Style="{StaticResource PhoneTextLargeStyle}" FontFamily="{StaticResource PhoneFontFamilySemiBold}" Margin="12,-12,12,6"/><TextBlock Text="{Binding Content}" Style="{StaticResource PhoneTextNormalStyle}" TextWrapping="Wrap" FontFamily="{StaticResource PhoneFontFamilySemiBold}"/></StackPanel></Grid></DataTemplate></toolkit:LongListSelector.ItemTemplate></toolkit:LongListSelector></Grid>

using Microsoft.Phone.Controls;namespace LongListSelectorDemo{public partial class MainPage : PhoneApplicationPage{// Constructorpublic MainPage(){InitializeComponent();longListSelector.ItemsSource = new Items();}}}