WPF ListBox Selecteditem colors

[Guest]

I'm struggling with knowing how to change the colors used when selecting an
item in a databound ListBox. If I have a listbox which uses a datatemplate
for items, I don't know how to use triggers to change the foreground and
background color in the template (if it was a ListBoxItem, I would say
ListBoxitem.IsSelected, but it is a Person for example) based on the item
being selected.

The problem is that the default selection foreground and background color
don't work with my DataTemplate's Gradient colors...text gets hidden

 

[RobinS]

I'm struggling with knowing how to change the colors used when selecting
an
item in a databound ListBox. If I have a listbox which uses a
datatemplate
for items, I don't know how to use triggers to change the foreground and
background color in the template (if it was a ListBoxItem, I would say
ListBoxitem.IsSelected, but it is a Person for example) based on the item
being selected.

The problem is that the default selection foreground and background color
don't work with my DataTemplate's Gradient colors...text gets hidden

You might try posting this to
microsoft.public.windows.developer.winfx.avalon, and/or the WPF group on
the MSDN Forums.

Robin S.

 

[Walter Wang [MSFT]]

Hi,

Sorry for delayed reply.

This question is actually not easy as it looks like. As a workaround, we
could bind the Selected item to a different DataTemplate, Josh Smith has a
blog on this technique:

#Josh Smith on WPF : Specializing the Selected Item's DataTemplate
http://www.infusionblogs.com/blogs/jsmith/archive/2006/08/09/699.aspx

By the way, currently there's no dedicated managed newsgroups for WPF yet,
so posting here is ok for now.


Sincerely,
Walter Wang ([email protected], remove 'online.')
Microsoft Online Community Support

==================================================
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/subscriptions/managednewsgroups/default.aspx#notif
ications. If you are using Outlook Express, please make sure you clear the
check box "Tools/Options/Read: Get 300 headers at a time" to see your reply
promptly.

Note: The MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response from the community or a Microsoft Support
Engineer within 1 business day is acceptable. Please note that each follow
up response may take approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution. The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions or complex
project analysis and dump analysis issues. Issues of this nature are best
handled working with a dedicated Microsoft Support Engineer by contacting
Microsoft Customer Support Services (CSS) at
http://msdn.microsoft.com/subscriptions/support/default.aspx.
==================================================

This posting is provided "AS IS" with no warranties, and confers no rights.

 

[Guest]

Thanks Walter, this was exactly what I needed. The style using a
relativesource binding is something I couldn't really get a grasp on, this is
perfect (though not immediately intuitive).

For others who are intersted here is the datatemplate that solves this issue:
<DataTemplate x:Key="itemTemplate">
<Grid>
<Grid.Resources>
<!-- This style is applied to the StackPanel which contains the
controls only
displayed by the ListBox's selected item. -->
<Style x:Key="selectedPanelStyle">
<Style.Triggers>
<DataTrigger
Binding="{Binding
RelativeSource=
{
RelativeSource
Mode=FindAncestor,
AncestorType={x:Type ListBoxItem}
},
Path=IsSelected
}"
Value="False">
<Setter Property="StackPanel.Visibility" Value="Collapsed" />
</DataTrigger>
</Style.Triggers>
</Style>
</Grid.Resources>

<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>

<!-- This is displayed whether the ListBoxItem is selected or not. -->
<TextBlock Text="{Binding Path=Name}"/>

<!-- This is only displayed when the ListBoxItem is selected. -->
<StackPanel Grid.Row="1" Style="{StaticResource selectedPanelStyle}">
<Button>Edit Item...</Button>
</StackPanel>
</Grid>
</DataTemplate>

Note the: Binding="{Binding
RelativeSource=
{
RelativeSource
Mode=FindAncestor,
AncestorType={x:Type ListBoxItem}
},
Path=IsSelected
}"

That is what allows you to know whether or not the item is selected.