Image is not displaying in Toggle Button in WPF-CodePudding

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 ??

CodePudding user response：

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>