none
ListBoxItem Style and TemplateBinding to its content RRS feed

  • Question

  • My question is the same as the one at this thread:

    http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/cb5508a5-af0d-412e-914f-b0c5f7375ad0

    However, I want to have a re-usable style for my ListBoxItem that will work all the time. Here is the listbox:

    <ListBox x:Name="SpecificationsListBox" 
             ItemsSource="{Binding Specifications}" 
             Background="Transparent" BorderBrush="Transparent"
             Margin="5" VerticalAlignment="Stretch" HorizontalAlignment="Left" MinWidth="250"
             SelectedIndex="0"/>

    Specifications is an ObservableCollection<Specification>. A specification is just an object with a bunch of properties. The "Name" property is what I want to have displayed in the TextBox in my ListBoxItem's style. Here is the style.

    <Style TargetType="{x:Type ListBoxItem}">
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="ListBoxItem">
            <Border Name="Border" Padding="8,8,15,8" Margin="2" SnapsToDevicePixels="true" CornerRadius="0,15,15,0" BorderThickness="1.5">
              <TextBlock x:Name="TextBlock" Text="{Binding Name}" Foreground="#060200"/>
            </Border>
            <ControlTemplate.Triggers>
              <Trigger Property="IsSelected" Value="true">
                <Setter TargetName="TextBlock" Property="FontWeight" Value="ExtraBold"/>
                <Setter TargetName="Border" Property="Background">
                  <Setter.Value>
                    <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1" >
                      <GradientStop Color="#FFF5DEC6" Offset="0"/>
                      <GradientStop Color="#FF7A5424" Offset="0.80"/>
                      <GradientStop Color="#FF432908" Offset="1"/>
                    </LinearGradientBrush>
                  </Setter.Value>
                </Setter>
                <Setter TargetName="Border" Property="BorderBrush" Value="#4D2D08"/>
              </Trigger>
              <Trigger Property="IsSelected" Value="false">
                <Setter TargetName="Border" Property="Background">
                  <Setter.Value>
                    <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1" >
                      <GradientStop Color="#FFF7F1EB" Offset="0"/>
                      <GradientStop Color="#FFBEA485" Offset="1"/>
                    </LinearGradientBrush>
                  </Setter.Value>
                </Setter>
                <Setter TargetName="Border" Property="BorderBrush" Value="#4D2D08"/>
              </Trigger>
            </ControlTemplate.Triggers>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>

    In this case, the binding works great. However, I want to use this style for all ListBoxItems, thus I can't bind directly to Name here. I try changing the Text binding to Text="{TemplateBinding Content}" and nothing shows up. I also see no errors in the output window when trying the template binding. Also, please note that in my Specifications class I have overriden the ToString property so it returns Name. I have also tried using an ItemTemplate for the ListBox, which contains a DataTemplate with only a ListBoxItem inside, where the content is bound to Name. Then the style is applied to the ListBoxItem in the DataTempate. This kind-of-works. However, it seems to have my listboxitem nested in another listboxitem and the style is thus messed up.

    There must be a way to get this to work. Thanks in advance!

    Wednesday, January 26, 2011 2:48 PM

Answers

  • Try:

    <TextBlock x:Name="TextBlock" Text="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" Foreground="#060200"/>

    You may also consider using a ContentPresenter instead of a TextBlock.  This way you can have any type of content and not just text.

    EDIT: Here is a post in which I provided an example that is similar to what you want to accomplish: http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/053d46ea-6f03-431b-a059-871c21fd6b0a

    This exmaple uses a Label, but pay attention ot the style that is being applied and how the bindings are defined.

    • Marked as answer by BBauer42 Wednesday, January 26, 2011 3:55 PM
    Wednesday, January 26, 2011 3:45 PM

All replies