如何以编程方式更改按钮的图像源？

Question

I have a button like this:

<Button Name="Btn_Import"
        Grid.Row="33"
        Grid.Column="15"
        Grid.ColumnSpan="36"
        Grid.RowSpan="36"
        Click="Btn_Import_Click"
        MouseEnter="import_desc"
        MouseLeave="desc_clear">
    <Button.Template>
        <ControlTemplate>
            <Grid RenderTransformOrigin="0.5,0.5"
                  x:Name="bg">
                <Image Name="import_image"
                       Source="/Images/01_Main_Screen/MS_START_IMPORT_NORMAL.png" />
            </Grid>
            <ControlTemplate.Triggers>
                <Trigger Property="IsMouseOver"
                         Value="True">
                    <!-- hover effect -->
                    <Setter TargetName="import_image"
                            Property="Source"
                            Value="/Images/01_Main_Screen/MS_START_IMPORT_OVER.png" />
                </Trigger>
                <Trigger Property="Button.IsPressed"
                         Value="True">
                    <!-- press effect -->
                    <Setter TargetName="bg"
                            Property="RenderTransform">
                        <Setter.Value>
                            <ScaleTransform ScaleX="0.9"
                                            ScaleY="0.9" />
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Button.Template>
    <Button.Style>
        <!-- initially disabled-->
        <Style TargetType="Button">
            <!--<Setter Property="IsEnabled" Value="False" />-->
            <!--<Setter Property="Opacity" Value="0.3" />-->
        </Style>
    </Button.Style>
</Button>

And then at some point in code behind, I locally change its image source to something else like this:

ControlTemplate ct1 = Btn_Import.Template;
Image btnImage1 = (Image)ct1.FindName("import_image", Btn_Import);
btnImage1.Source = new BitmapImage(new Uri("/Images/01_Main_Screen/MS_START_IMPORT_FINISH.png", UriKind.RelativeOrAbsolute));

After doing this, I lose the 'mouse over' effect probably because I overwrite the original button's template. How to locally again 'tell' the button to trigger on mouse over? Or in other words, how to write this in C#:

<ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" 
          Value="True">
     <!-- hover effect -->
     <Setter TargetName="import_image" Property="Source"
             Value="/Images/01_Main_Screen/MS_START_IMPORT_OVER.png" />
    </Trigger>

Answer 1

It is probably because of property value precedence. I have added some resources in your template. Now when you want to change some source value, do it by accessing the resource.

Also note that for binding to our resources we are using DynamicResource otherwise any code level changes won't be visible.

Below changes are working like a breeze.

<Button.Template>
                <ControlTemplate>

                    <ControlTemplate.Resources>
                        <Image x:Key="NORMAL" Source="images/01_Main_Screen/MS_START_IMPORT_NORMAL.png"/>
                        <Image x:Key="OVER" Source="images/01_Main_Screen/MS_START_IMPORT_OVER.png"/>
                    </ControlTemplate.Resources>

                    <Grid RenderTransformOrigin="0.5,0.5"
                  x:Name="bg">
                        <Label x:Name="import_image" Content="{DynamicResource NORMAL}" HorizontalContentAlignment="Center" HorizontalAlignment="Stretch"/>                        
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver"
                         Value="True">
                            <!-- hover effect -->
                            <Setter TargetName="import_image"
                            Property="Content"
                            Value="{DynamicResource OVER}" />
                            <Setter TargetName="bg"
                            Property="Background"
                            Value="Purple" />
                        </Trigger>
                        <Trigger Property="Button.IsPressed"
                         Value="True">
                            <!-- press effect -->
                            <Setter TargetName="bg"
                            Property="RenderTransform">
                                <Setter.Value>
                                    <ScaleTransform ScaleX="0.9"
                                            ScaleY="0.9" />
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Button.Template>

Then in code,

ControlTemplate ct1 = Btn_Import.Template;
Image normalImage = (Image)ct1.Resources["NORMAL"];
normalImage.Source = new BitmapImage(new Uri("Images/01_Main_Screen/MS_START_IMPORT_FINISH.png", UriKind.RelativeOrAbsolute));