Sven Bardos
Sven Bardos

Reputation: 872

Change foreground of a textbox embedded in a CellTemplate

I'm trying to change the foreground color (text color) of a textbox which is a datatemplate of a GridViewColumn.CellTemplate if the listviewitem is selected:

<ListView ItemsSource="{Binding Components}"
                          Style="{StaticResource PrimaryListViewStyle}"
                          ItemContainerStyle="{DynamicResource ListViewItemContainerStyle}"
                          Width="150"
                          MinHeight="150"
                          SelectionMode="Single"
                          cal:Message.Attach="[Event SelectionChanged]=[Action ActivateAttributesView($this.SelectedItem)]">
                    <ListView.View>
                        <GridView ColumnHeaderContainerStyle="{StaticResource PrimaryGridViewColumnHeaderStyle}">
                            <GridViewColumn Header="Component Name">
                                <GridViewColumn.CellTemplate>

                                   <DataTemplate DataType="{x:Type viewModels:ComponentViewModel}">
                                        <TextBox Text="{Binding Name}">
                                            <TextBox.Resources>
                                                <Style TargetType="{x:Type TextBox}">
                                                    <Style.Triggers>
                                                        <Trigger Property="ListViewItem.IsSelected"
                                                                 Value="False">
                                                            <Setter Property="Foreground"
                                                                    Value="Green" />
                                                        </Trigger>
                                                        <Trigger Property="ListViewItem.IsSelected"
                                                                 Value="True">
                                                            <Setter Property="Foreground"
                                                                    Value="Black" />
                                                        </Trigger>
                                                    </Style.Triggers>
                                                </Style>
                                            </TextBox.Resources>
                                        </TextBox>
                                    </DataTemplate>

                                </GridViewColumn.CellTemplate>
                            </GridViewColumn>
                        </GridView>
                    </ListView.View>
                </ListView>

Here's an image. Unfortunately I#m not allowed to paste the image directly...:

http://de.tinypic.com/r/262s8bb/8

The text in the selected row shall be displayed "black".

Thx.

Upvotes: 1

Views: 741

Answers (3)

StuS
StuS

Reputation: 857

  1. TextBox listen Foreground changed from ListViewItem

           <Style TargetType="TextBox" BasedOn="{StaticResource {x:Type TextBox}}">
                <Setter Property="Foreground" Value="{Binding RelativeSource={RelativeSource AncestorType={x:Type ListViewItem}}, Path=Foreground}" />
            </Style>
    
  2. ListViewItem changed Foreground when IsSelected property changed

           <Style TargetType="ListViewItem">
                <Setter Property="Foreground" Value="Green" />
                <Style.Triggers>
                    <Trigger Property="IsSelected" Value="True">
                        <Setter Property="Foreground" Value="Black" />
                    </Trigger>
                </Style.Triggers>
            </Style>
    

Upvotes: 0

Frank
Frank

Reputation: 4481

Your style has triggers for the TextBox that it is applied to. A TextBox doesn't know if the containing ListViewItem is selected or not, so this won't work.

To get the connection to the containing ListViewItem, you can use a DataTrigger instead, let a RelativeSource expression travel up the visual tree until it finds the ListViewItem and bind to its IsSelected property:

<Style TargetType="{x:Type TextBox}">
    <Setter Property="Foreground" Value="Green" />
    <Style.Triggers>
        <DataTrigger
            Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type ListViewItem}}, Path=IsSelected}"
            Value="True">
            <Setter Property="Foreground"
                    Value="Black" />
        </DataTrigger>
    </Style.Triggers>
</Style>

Upvotes: 2

paparazzo
paparazzo

Reputation: 45096

I think you need a DataTrigger

<Style.Triggers>
    <DataTrigger Binding="{Binding IsSelected}" 
        Value="True">
        <Setter Property="FontFamily" Value="Segoe UI Semilight"/>
        <Setter Property="FontSize" Value="16"/>
    </DataTrigger>
</Style.Triggers>

Upvotes: 0

Related Questions