如何以编程方式更改按钮's图像源

本文关键字:图像 按钮 编程 方式更 | 更新日期: 2023-09-27 18:16:06

我有一个这样的按钮:

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

然后在代码后面的某个地方,我局部地将其图像源更改为这样的内容:

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));

这样做之后,我失去了"鼠标经过"的效果,可能是因为我覆盖了原始按钮的模板。如何在本地再次"告诉"按钮触发鼠标?或者换句话说,如何在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>

如何以编程方式更改按钮's图像源

这可能是因为属性值优先。我在你的模板中添加了一些资源。现在,当您想要更改某些源值时,可以通过访问资源来实现。

还需要注意的是,为了绑定到我们的资源,我们使用的是DynamicResource,否则任何代码级的变化都是不可见的。

下面的变化就像微风一样。

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

然后在代码中,

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));