[Winodows Phone 7控制項詳解]Silverlight toolkit for Windows Phone 7.1控制項-8

9.LongListSelector

這個控制項是一個歸類列表，並且可以快速選擇按類選擇。這個控制項最主要的是要把需要的資料進行綁定和分類，在sample中有一個People的例子（PeopleByFirstName.cs、PeopleInGroup.cs、Person.cs這幾個檔案可以看出如何?）

        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">            <toolkit:LongListSelector HorizontalAlignment="Left" Margin="12,46,0,0" Name="longListSelector1" VerticalAlignment="Top" Height="517" Width="438" ItemsSource="{StaticResource people}">                <toolkit:LongListSelector.GroupItemsPanel>                    <ItemsPanelTemplate>                        <toolkit:WrapPanel Orientation="Horizontal"/>                    </ItemsPanelTemplate>                </toolkit:LongListSelector.GroupItemsPanel>                <toolkit:LongListSelector.GroupItemTemplate>                    <DataTemplate>                        <Border Background="{Binding Converter={StaticResource groupbrush}}" Width="99" Height="99" Margin="6" IsHitTestVisible="{Binding HasItems}">                            <TextBlock Text="{Binding Key}"                                        FontFamily="{StaticResource PhoneFontFamilySemiBold}"                                       FontSize="36"                                       Margin="{StaticResource PhoneTouchTargetOverhang}"                                       Foreground="{StaticResource PhoneForegroundBrush}"                                                                               VerticalAlignment="Bottom"/>                        </Border>                    </DataTemplate>                </toolkit:LongListSelector.GroupItemTemplate>                <toolkit:LongListSelector.GroupHeaderTemplate>                    <DataTemplate>                        <Border Background="Transparent">                            <Border Background="{StaticResource PhoneAccentBrush}" Width="75" Height="75" HorizontalAlignment="Left">                                <TextBlock Text="{Binding Key}"                                            Foreground="{StaticResource PhoneForegroundBrush}"                                            Style="{StaticResource PhoneTextExtraLargeStyle}"                                           VerticalAlignment="Bottom"/>                            </Border>                        </Border>                    </DataTemplate>                </toolkit:LongListSelector.GroupHeaderTemplate>                <toolkit:LongListSelector.ItemTemplate>                    <DataTemplate>                        <Grid Margin="{StaticResource PhoneTouchTargetOverhang}">                            <Grid.ColumnDefinitions>                                <ColumnDefinition Width="Auto"/>                                <ColumnDefinition Width="*"/>                            </Grid.ColumnDefinitions>                            <Image Width="110" Height="150" Source="{Binding ImageUrl}" VerticalAlignment="Top"/>                            <StackPanel Grid.Column="1" VerticalAlignment="Top">                                <TextBlock Text="{Binding FullName}" Style="{StaticResource PhoneTextLargeStyle}" FontFamily="{StaticResource PhoneFontFamilySemiBold}" Margin="12,-12,12,6"/>                                <TextBlock Text="{Binding Email}" Style="{StaticResource PhoneTextNormalStyle}" TextWrapping="Wrap" FontFamily="{StaticResource PhoneFontFamilySemiBold}"/>                                <StackPanel Orientation="Horizontal">                                    <TextBlock Text="Mobile:" Style="{StaticResource PhoneTextSmallStyle}"/>                                    <TextBlock Text="{Binding Mobile}" Style="{StaticResource PhoneTextSmallStyle}" FontFamily="{StaticResource PhoneFontFamilySemiBold}"/>                                </StackPanel>                                <StackPanel Orientation="Horizontal">                                    <TextBlock Text="Home:" Style="{StaticResource PhoneTextSmallStyle}"/>                                    <TextBlock Text="{Binding Home}" Style="{StaticResource PhoneTextSmallStyle}" FontFamily="{StaticResource PhoneFontFamilySemiBold}"/>                                </StackPanel>                            </StackPanel>                        </Grid>                    </DataTemplate>                </toolkit:LongListSelector.ItemTemplate>            </toolkit:LongListSelector>        </Grid>

　　<toolkit:LongListSelector.GroupItemsPanel>//設定以什麼樣的方式顯示分類列表，如果沒有這個設定，分類列表以直列顯示

 <toolkit:LongListSelector.GroupItemTemplate>//分類列表內的item顯示內容和方式

  <toolkit:LongListSelector.GroupHeaderTemplate>//設定列表分類的頭的顯示內容和方式

    <toolkit:LongListSelector.ItemTemplate>//設定列表裡的內容的顯示方式

    <phone:PhoneApplicationPage.Resources>        <data:PeopleByFirstName x:Key="people"/>        <data:GroupToBrushValueConverter x:Key="groupbrush"/>    </phone:PhoneApplicationPage.Resources>

xmlns:data="clr-namespace:testNewControls.Data"