ControlTemplate中的DataTrigger未设置图像源

Question

I have a ControlTemplate that i defined for showing a View model in my required format. However, I am not able to set the Image's source property from the DataTrigger of the Control Template. Please help me with this.

<ControlTemplate x:Key="GeneralControlTemplate"
                     TargetType="{x:Type local:ComponentStatisticsControl}">
        <Border CornerRadius="3"
                BorderThickness="2"
                BorderBrush="SkyBlue"
                Margin="8,0,0,0">
            <Border.Background>
                <SolidColorBrush x:Name="ControlBackground" Color="Transparent"/>
            </Border.Background>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Label Foreground="Blue"
                       Grid.Row="0"
                       FontSize="14"
                       FontWeight="SemiBold"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Center"
                       Content="{Binding Path=Title, RelativeSource={RelativeSource TemplatedParent}}"/>

                <Grid Grid.Row="1">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <GroupBox Header="Component Info"
                              Grid.Row="0"
                              Foreground="Maroon"
                              FontWeight="SemiBold">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>

                            <Label Content="IP Address"
                                   Grid.Column="0"
                                   Grid.Row="0"/>
                            <Label Content="{Binding Path=AdditionalContent.IPAddress, RelativeSource={RelativeSource TemplatedParent}}"
                                   Grid.Row="0"
                                   HorizontalAlignment="Right"
                                   Grid.Column="1"/>

                            <Label Content="PortNo"
                                   Grid.Column="0"
                                   Grid.Row="1"/>
                            <Label Content="{Binding Path=AdditionalContent.PortNo, RelativeSource={RelativeSource TemplatedParent}}"
                                   Grid.Row="1"
                                   HorizontalAlignment="Right"
                                   Grid.Column="1"/>

                            <Label Content="Status"
                                   Grid.Column="0"
                                   Grid.Row="2"/>
                            <Image Name="imgStatus"
                                   Height="24"
                                   Width="24"
                                   Stretch="Fill"
                                   HorizontalAlignment="Right"
                                   Grid.Column="1"
                                   Grid.Row="2">
                            </Image>
                        </Grid>
                    </GroupBox>
                    <Expander Header="Queue Statistics"
                              Grid.Row="1"
                              ExpandDirection="Down"
                              IsExpanded="True"
                              Foreground="DarkOrange"
                              FontWeight="SemiBold">
                        <ItemsControl ItemsSource="{Binding Path=AdditionalContent.QueueStatistics, RelativeSource={RelativeSource TemplatedParent}}">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Grid.IsSharedSizeScope="True"/>
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate DataType="{x:Type lappmodel:clsQueueStatistics}">
                                    <Grid>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition SharedSizeGroup="ColumnOne"/>
                                            <ColumnDefinition Width="*"/>
                                        </Grid.ColumnDefinitions>
                                        <Label Content="{Binding QName}"/>
                                        <Label Content="{Binding Count}"
                                               Margin="8,0,0,0"
                                               HorizontalAlignment="Right"
                                               Grid.Column="1"/>
                                    </Grid>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </Expander>
                    <GroupBox Header="Connection Statistics"
                              Foreground="DarkOrange"
                              Grid.Row="2"
                              FontWeight="SemiBold">
                        <ItemsControl ItemsSource="{Binding Path=AdditionalContent.ConnectionInformation, RelativeSource={RelativeSource TemplatedParent}}">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel Grid.IsSharedSizeScope="True" Orientation="Horizontal"/>
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate DataType="{x:Type lappmodel:clsComponentConnectionInfo}">
                                    <Border CornerRadius="3"
                                            BorderThickness="1"
                                            BorderBrush="Gray"
                                            x:Name="borderConnectionInfo">
                                        <Border.Background>
                                            <SolidColorBrush Color="Transparent"/>
                                        </Border.Background>
                                        <Grid>
                                            <Grid.Background>
                                                <SolidColorBrush x:Name="gridconnectioninfo" 
                                                                 Color="Transparent"/>
                                            </Grid.Background>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition SharedSizeGroup="ColumnOne"/>
                                                <ColumnDefinition Width="*"/>
                                            </Grid.ColumnDefinitions>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="Auto"/>
                                                <RowDefinition Height="Auto"/>
                                                <RowDefinition Height="Auto"/>
                                                <RowDefinition Height="Auto"/>
                                                <RowDefinition Height="Auto"/>
                                            </Grid.RowDefinitions>
                                            <Label Content="Component"
                                                   Grid.Row="0"/>
                                            <Label Content="{Binding Identifier}"
                                                       Grid.Column="1"
                                                       Grid.Row="0"
                                                       HorizontalAlignment="Right"/>
                                            <Label Content="Component Id"
                                                   Grid.Row="1"/>
                                            <Label Content="{Binding ComponentId}"
                                                   Grid.Column="1"
                                                   Grid.Row="1"
                                                   Foreground="Blue"
                                                   HorizontalAlignment="Right"/>
                                            <Label Content="BytesSent"
                                                   Grid.Row="2"/>
                                            <Label Content="{Binding BytesSent}"
                                                   Grid.Row="2"
                                                   Grid.Column="1"
                                                   HorizontalAlignment="Right"/>

                                            <Label Content="BytesReceived"
                                                   Grid.Row="3"/>
                                            <Label Content="{Binding BytesReceived}"
                                                   Grid.Row="3"
                                                   Grid.Column="1"
                                                   HorizontalAlignment="Right"/>
                                            <Label Content="Connected"
                                                   Grid.Row="4"/>
                                            <Image x:Name="imgConnectedStatus"
                                                   Grid.Row="4"
                                                   Grid.Column="1"
                                                   HorizontalAlignment="Right"
                                                   Height="24"
                                                   Width="24">
                                            </Image>
                                        </Grid>
                                    </Border>
                                    <DataTemplate.Triggers>
                                        <DataTrigger Binding="{Binding IsConnected}" Value="True">
                                            <Setter Property="Source"
                                                    TargetName="imgConnectedStatus"
                                                    Value="/Resources/GreenDot.png"/>
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding IsConnected}" Value="False">
                                            <Setter Property="Source"
                                                    TargetName="imgConnectedStatus"
                                                    Value="/Resources/red-dot2.png"/>
                                            <DataTrigger.EnterActions>
                                                <BeginStoryboard>
                                                    <Storyboard Duration="0:0:0.200"
                                                                AutoReverse="True"
                                                                RepeatBehavior="Forever">
                                                        <ColorAnimation From="Red"
                                                                        To="DarkRed"
                                                                        Storyboard.TargetName="borderConnectionInfo"
                                                                        Storyboard.TargetProperty="Background.Color"/>
                                                    </Storyboard>
                                                </BeginStoryboard>
                                            </DataTrigger.EnterActions>
                                        </DataTrigger>
                                    </DataTemplate.Triggers>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </GroupBox>
                </Grid>
            </Grid>
        </Border>
        <ControlTemplate.Triggers>
            <DataTrigger Binding="{Binding AdditionalContent.IsComponentShutdown, RelativeSource={RelativeSource TemplatedParent}}"
                         Value="False">
                <Setter TargetName="imgStatus"
                        Property="Source"
                        Value="/Resources/GreenDot.png"/>
            </DataTrigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

I am trying to set the Source property for imgStatus in the ControlTemplate triggers. But, there is no change in the Image.

Answer 1

By looking at the following link http://social.msdn.microsoft.com/Forums/vstudio/en-US/a3bf91a8-e618-41c6-a1ad-be9e19581fd6/datatrigger-inside-controltemplate-issue

It became clear that i should not use TemplatedParent. Setting the {RelativeSource Self} in the binding solved the problem.

        <ControlTemplate.Triggers>
            <DataTrigger Binding="{Binding AdditionalContent.IsComponentShutdown, RelativeSource={RelativeSource Self}}"
                         Value="False">
                <Setter TargetName="imgStatus"
                        Property="Source"
                        Value="/Resources/GreenDot.png"/>
            </DataTrigger>
        </ControlTemplate.Triggers>

Answer 2

fine , wierd contorl design ...

    <DataTrigger Binding="{Binding Path=DataContext.IsConnected, 
         RelativeSource={RelativeSource AncestorType=ItemsControl}}" Value="True">
            <Setter Property="Source"
                    TargetName="imgConnectedStatus"
                    Value="/Resources/GreenDot.png"/>
     </DataTrigger>

since you are using a DataTrigger from an item's precpective , the DataTemplates DataContext is an object from your ItemsSource , RelativeSource to the containing control , Path to it's DataContext.Property