如何在运行时更改按钮的背景图像
本文关键字:按钮 背景 图像 运行时 | 更新日期: 2023-09-27 17:58:55
我遇到了一个问题。我想在运行时更改按钮的背景图像。我得到了改变颜色的解决方案,但我想改变图像。
代码如下
public void buttonCase(object sender, RoutedEventArgs e)
{
Uri uri = null;
var image = new ImageBrush();
if (((App)App.Current).appControler.m_Mode == Controller.textMode.Letters)
{
((App)App.Current).appControler.buttonCase(sender, e);
switch (((App)App.Current).appControler.m_case)
{
case Controller.caseMode.Upper:
b0.FontSize = b1.FontSize = b2.FontSize = b3.FontSize = b4.FontSize = b5.FontSize = b6.FontSize = b7.FontSize
= b8.FontSize = b9.FontSize = bCornerLower.FontSize = 30.0;
uri = new Uri(@"/SourceCode;component/Images/Lower_Case_p.png", UriKind.Relative);
image.ImageSource = new BitmapImage(uri);
btnCase.Background = image;
break;
case Controller.caseMode.Lower:
b0.FontSize = b1.FontSize = b2.FontSize = b3.FontSize = b4.FontSize = b5.FontSize = b6.FontSize = b7.FontSize
= b8.FontSize = b9.FontSize = bCornerLower.FontSize = 40.0;
uri = new Uri(@"/SourceCode;component/Images/Case_p.png", UriKind.Relative);
image.ImageSource = new BitmapImage(uri);
btnCase.Background = image;
break;
}
}
}
类似的东西?
var brush = new ImageBrush();
brush.ImageSource = new BitmapImage(new Uri(@"Images/myImage.png", UriKind.Relative));
myButton.Background = brush;
[Edit]我制作了一个带有两个图像的测试应用程序。我在点击按钮时切换图像,它就工作了。
private bool flag;
private void button1_Click(object sender, RoutedEventArgs e)
{
flag = !flag;
var uriString = flag ? @"Images/logo.png" : @"Images/icon.png";
myButton.Background = new ImageBrush
{ ImageSource = new BitmapImage(new Uri(uriString, UriKind.Relative)) };
}
private void button_Click(object sender, EventArgs e)
{
button.Image=System.Drawing.Image.FromFile("image.png");
}
试试这个
利用VisualStates进行这种UI状态切换。你的代码后面会是这样的:
public void buttonCase(object sender, RoutedEventArgs e)
{
if (((App)App.Current).appControler.m_Mode == Controller.textMode.Letters)
{
((App)App.Current).appControler.buttonCase(sender, e);
switch (((App)App.Current).appControler.m_case)
{
case Controller.caseMode.Upper:
VisualStateManager.GoToState( this, "UpperCase", true );
break;
case Controller.caseMode.Lower:
VisualStateManager.GoToState( this, "LowerCase", true );
break;
}
}
}
你的xaml看起来是这样的:
<UserControl
x:Class="SilverlightApplication2.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:system="clr-namespace:System;assembly=mscorlib">
<UserControl.Resources>
<ControlTemplate x:Key="MySpecialToggleButton" TargetType="ToggleButton">
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CheckStates">
<VisualState x:Name="Checked">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="LowerCaseIcon">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="UpperCaseIcon">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Unchecked"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Image x:Name="UpperCaseIcon" Source="/SilverlightApplication2;component/Images/Lower_Case_p.png" Visibility="Visible"/>
<Image x:Name="LowerCaseIcon" Source="/SilverlightApplication2;component/Images/Case_p.png" Visibility="Collapsed"/>
</Grid>
</ControlTemplate>
</UserControl.Resources>
<StackPanel>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="LetterCaseStates">
<VisualState x:Name="UpperCase"/>
<VisualState x:Name="LowerCase">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="FontSize" Storyboard.TargetName="bCornerLower">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<system:Double>40</system:Double>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<ToggleButton x:Name="btnCase" Click="buttonCase" Template="{StaticResource MySpecialToggleButton}"/>
<Button x:Name="bCornerLower" FontSize="30"/><!-- this one is the styling master, all other buttons follow its styling -->
<Button x:Name="b0" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b1" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b2" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b3" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b4" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b5" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b6" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b7" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b8" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
<Button x:Name="b9" FontSize="{Binding ElementName=bCornerLower, Path=FontSize}"/>
</StackPanel>
我写的代码是为了回答这里的一个类似问题:切换按钮与不同的图像
我知道定义VisualStates可能看起来很麻烦,但最终您可以保持代码的整洁,避免切换所有ui的视觉外观。