Image is not displaying in Toggle Button in WPF

Question

In my wpf usercontrol, I have a toggle button like this,

          <ToggleButton x:Name="btnExpand" Grid.Row="0" Width="25" Height="25" HorizontalAlignment="Right" Margin="5" >
        <Image Width="20" Height="20">
            <Image.Style>
                <Style TargetType="{x:Type Image}">
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding IsCheckedState}" Value="true">
                            <Setter Property="Source" Value = "pack://application:,,,/MyAssembly;component/SalesModule/Images/expand.png"/>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding IsCheckedState}" Value="false">
                            <Setter Property="Source" Value = "pack://application:,,,/MyAssembly;component/SalesModule/Images/collapse.png"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Image.Style>
        </Image>
    </ToggleButton>

But the images are not showing !!! Both Image's BuildAction is already set to Resource in their properties. Then i cleaned the solution and then rebuilded. Still no use.

Could you please help me to display the image inside the toggle button ??

Answer 1

Bind to the IsChecked property of the parent ToggleButton, and use only one DataTrigger and a regular Style Setter:

<ToggleButton x:Name="btnExpand" Grid.Row="0" Width="25" Height="25" HorizontalAlignment="Right" Margin="5" >
    <Image Width="20" Height="20">
        <Image.Style>
            <Style TargetType="{x:Type Image}">
                <Setter Property="Source" Value="pack://application:,,,/MyAssembly;component/SalesModule/Images/collapse.png"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding IsChecked, ElementName = btnExpand}" Value="true">
                        <Setter Property="Source" Value="pack://application:,,,/MyAssembly;component/SalesModule/Images/expand.png"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Image.Style>
    </Image>
</ToggleButton>