Kengi Chan
Kengi Chan

Reputation: 21

How to set SelectItem Foreground in LongListSelector

i want set the SelectItem Foreground with diff color , in LongListSelector This is my xaml:

<toolkit:LongListSelector x:Name="locations" Background="Transparent" Margin="0"
                    GroupViewOpened="LongListSelector_GroupViewOpened"
                    GroupViewClosing="LongListSelector_GroupViewClosing" 
                    SelectionChanged="locations_SelectionChanged">
                <toolkit:LongListSelector.GroupItemsPanel>
                    <ItemsPanelTemplate>
                        <toolkit:WrapPanel Orientation="Horizontal"/>
                    </ItemsPanelTemplate>
                </toolkit:LongListSelector.GroupItemsPanel>
                <toolkit:LongListSelector.GroupItemTemplate>
                    <DataTemplate>
                        <Border Background="{Binding Converter={StaticResource GroupBackground}}" 
                                    Width="99" Height="99" Margin="6" IsHitTestVisible="{Binding HasItems}">
                            <TextBlock Text="{Binding Key}" 
                                    FontFamily="{StaticResource PhoneFontFamilySemiBold}"
                                    FontSize="48"
                                    Margin="8,0,0,0"
                                    Foreground="{Binding Converter={StaticResource GroupForeground}}"                                        
                                    VerticalAlignment="Bottom"/>
                            <Border.Projection>
                                <PlaneProjection RotationX="-60"/>
                            </Border.Projection>
                        </Border>
                    </DataTemplate>
                </toolkit:LongListSelector.GroupItemTemplate>
                <toolkit:LongListSelector.GroupHeaderTemplate>
                    <DataTemplate>
                        <Border Background="Transparent" Margin="12,8,0,8">
                            <Border Background="{StaticResource HighlightBrush}"    
                                        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>
                        <StackPanel Margin="20,0">
                            <TextBlock Text="{Binding n}" Style="{StaticResource PhoneTextExtraLargeStyle}" 
                                       FontFamily="{StaticResource PhoneFontFamilySemiBold}" 
                                       Margin="12,5"/>
                        </StackPanel>
                    </DataTemplate>
                </toolkit:LongListSelector.ItemTemplate>
            </toolkit:LongListSelector>

the LongListSelector without a "ItemContainerStyle", i don't know how to set a Style Resources, like normal listboxitem.

Upvotes: 2

Views: 1678

Answers (1)

bkaid
bkaid

Reputation: 52083

If you edit your ItemTemplate to use a ContentControl instead of a TextBlock, the selected item will use the phones accent brush (make sure you aren't setting the foreground color for the content control):

<toolkit:LongListSelector.ItemTemplate>
    <DataTemplate>
        <StackPanel Margin="20,0">
            <ContentControl Text="{Binding n}" Style="{StaticResource PhoneTextExtraLargeStyle}" 
                            FontFamily="{StaticResource PhoneFontFamilySemiBold}" 
                            Margin="12,5"/>
        </StackPanel>
    </DataTemplate>
</toolkit:LongListSelector.ItemTemplate>

To be able to set it to a custom color, I ended up overriding the constructor for TemplatedListBoxItem and set the DefaultStyleKey: DefaultStyleKey = typeof(TemplatedListBoxItem); I then set up a style for TemplatedListBoxItem that matches the ListBoxItem style in System.Windows.xaml except for a different selected item visual state color.

Upvotes: 1

Related Questions