WPF按钮图像只显示去年控制 [英] WPF Button Image only showing in last control
本文介绍了WPF按钮图像只显示去年控制的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我是相当新的WPF和我可能失去了一些东西简单在这里。如果我有3个控制，只有最后的控制会显示我指定的OriginalImage。
任何帮助将是最AP preciated。谢谢
瑞安
主窗口
＆LT;网格和GT; ＆LT; Grid.RowDefinitions＆GT;
＆LT; RowDefinition HEIGHT =200 */＆GT;
＆LT; RowDefinition高度=60/＆GT;
＆LT; /Grid.RowDefinitions>
＆LT; Grid.ColumnDefinitions＆GT;
＆LT; ColumnDefinition WIDTH =85/＆GT;
＆LT; ColumnDefinition WIDTH =85/＆GT;
＆LT; ColumnDefinition WIDTH =85/＆GT;
＆LT; ColumnDefinition WIDTH =85/＆GT;
＆LT; ColumnDefinition WIDTH =300/＆GT;
＆LT; /Grid.ColumnDefinitions> ＆所述;网格Grid.Row =1＆GT;
＆LT;但是：ListButton OriginalImage =/ CustomItemsPanel;组件/ ListBox中/图片/ add.png
DisableImage =/ CustomItemsPanel;组件/ ListBox中/图片/ addunselect.png /＆GT;
＆LT; /网格和GT;
＆所述;网格Grid.Row =1Grid.Column =1＆GT;
＆LT;但是：ListButton OriginalImage =/ CustomItemsPanel;组件/ ListBox中/图片/ add.png
DisableImage =/ CustomItemsPanel;组件/ ListBox中/图片/ addunselect.png /＆GT;
＆LT; /网格和GT;
＆所述;网格Grid.Row =1Grid.Column =2＆GT;
＆LT;但是：ListButton OriginalImage =/ CustomItemsPanel;组件/ ListBox中/图片/ add.png
DisableImage =/ CustomItemsPanel;组件/ ListBox中/图片/ addunselect.png /＆GT;
＆LT; /网格和GT;
＆LT; /网格和GT;
控制XAML
＆LT; ResourceDictionary中
的xmlns =http://schemas.microsoft.com/winfx/2006/xaml/$p$psentation
的xmlns：X =http://schemas.microsoft.com/winfx/2006/xaml
XMLNS：地方=CLR的命名空间：CustomItemsPanel.ListButton＆GT;＆LT;一个LinearGradientBrush X：键=ButtonBackground终点=0.5,1StartPoint可以=0.5,0＆GT;
＆LT; LinearGradientBrush.GradientStops＆GT;
＆LT;渐变停止颜色=＃FF0E3D70/＆GT;
＆所述;渐变停止颜色=＃FF001832偏移=1/＆GT;
＆LT; /LinearGradientBrush.GradientStops>
＆LT; /一个LinearGradientBrush＆GT;＆LT;一个LinearGradientBrush X：键=ButtonBackgroundMouseOver终点=0.5,1StartPoint可以=0.5,0＆GT;
＆LT; LinearGradientBrush.GradientStops＆GT;
＆LT;渐变停止颜色=＃FF1E62A1/＆GT;
＆所述;渐变停止颜色=＃FF0A3C6D偏移=1/＆GT;
＆LT; /LinearGradientBrush.GradientStops>
＆LT; /一个LinearGradientBrush＆GT;＆LT;一个LinearGradientBrush X：键=ButtonBackgroundSelected终点=0.5,1StartPoint可以=0.5,0＆GT;
＆LT; LinearGradientBrush.GradientStops＆GT;
＆LT;渐变停止颜色=红色/＆GT;
＆所述;渐变停止颜色=＃FF0A2A4C偏移=1/＆GT;
＆LT; /LinearGradientBrush.GradientStops>
＆LT; /一个LinearGradientBrush＆GT;＆LT;风格X：键=切换的TargetType ={X：类型按钮}＆GT;
＆LT; setter属性=内容＆GT;
＆LT; Setter.Value＆GT;
＆lt;图像＆GT;
＆LT; Image.Style＆GT;
＆LT;风格的TargetType ={X：输入图像}＆GT;
＆LT; setter属性=源VALUE ={绑定的RelativeSource = {的RelativeSource FindAncestor，AncestorType = {X：类型本地：ListButton}}，路径= OriginalImage}/＆GT;
＆LT; Style.Triggers＆GT;
＆LT;触发属性=IsEnabledVALUE =FALSE＆GT;
＆LT; setter属性=源VALUE ={绑定路径= DisableImage，的RelativeSource = {的RelativeSource TemplatedParent}}/＆GT;
＆LT; /触发＆GT;
＆LT; /Style.Triggers>
＆LT; /样式和GT;
＆LT; /Image.Style>
＆LT; /图像＆GT;
＆LT; /Setter.Value>
＆LT; /二传手＆GT;
＆LT; setter属性=模板＆GT;
＆LT; Setter.Value＆GT;
＆LT;的ControlTemplate的TargetType ={X：类型按钮}＆GT;
＆LT;电网光标=手＆GT;
＆LT; BORDER NAME =后面的保证金=0,1,0,0的背景={StaticResource的ButtonBackground}＆GT;
＆lt;内容presenter VerticalAlignment =中心的HorizontalAlignment =中心X：名称=内容/＆GT; ＆LT; /边框＆GT;
＆所述;边界了borderThickness =1BorderBrush =＃FF004F92＆GT;
＆LT; BORDER =了borderThickness，0,0,1,0BorderBrush =＃FF101D29/＆GT;
＆LT; /边框＆GT;
＆LT; /网格和GT;
＆LT; ControlTemplate.Triggers＆GT;
＆LT;触发属性=IsMouseOverVALUE =真＆GT;
＆LT;二传手的TargetName =后面的属性=背景VALUE ={StaticResource的ButtonBackgroundMouseOver}/＆GT;
＆LT; /触发＆GT;
＆LT; /ControlTemplate.Triggers>
＆LT; /控件模板＆GT;
＆LT; /Setter.Value>
＆LT; /二传手＆GT;
＆LT; /样式和GT;＆LT;风格的TargetType ={X：类型本地：ListButton}＆GT;
＆LT; setter属性=模板＆GT;
＆LT; Setter.Value＆GT;
＆LT;的ControlTemplate的TargetType ={X：类型本地：ListButton}＆GT;
＆LT;按钮样式={StaticResource的切换}/＆GT;
＆LT; /控件模板＆GT;
＆LT; /Setter.Value>
＆LT; /二传手＆GT;
＆LT; /样式和GT;＆LT; / ResourceDictionary的＆GT;
控制code背后
公共类ListButton：控制
{
公共静态只读的DependencyProperty MouseOverImageProperty;
公共静态只读的DependencyProperty OriginalImageProperty;
公共静态只读的DependencyProperty DisableImageProperty; 静态ListButton（）{ DefaultStyleKeyProperty.OverrideMetadata（typeof运算（ListButton），新FrameworkPropertyMetadata（typeof运算（ListButton）））; MouseOverImageProperty = DependencyProperty.Register（MouseOverImage的typeof（ImageSource的）的typeof（ListButton），新UIPropertyMetadata（NULL））;
OriginalImageProperty = DependencyProperty.Register（OriginalImage的typeof（ImageSource的）的typeof（ListButton），新UIPropertyMetadata（NULL））;
DisableImageProperty = DependencyProperty.Register（DisableImage的typeof（ImageSource的）的typeof（ListButton），新UIPropertyMetadata（NULL））;
} 公众的ImageSource MouseOverImage {
{返回（ImageSource的）的GetValue（MouseOverImageProperty）; }
集合{的SetValue（MouseOverImageProperty，值）; }
} 公众的ImageSource OriginalImage {
{返回（ImageSource的）的GetValue（OriginalImageProperty）; }
集合{的SetValue（OriginalImageProperty，值）; }
} 公众的ImageSource DisableImage
{
{返回（ImageSource的）的GetValue（DisableImageProperty）; }
集合{的SetValue（DisableImageProperty，值）; }
}
}
解决方案
我要回答我的问题。 Bitbonk有我做错了什么，以及如何工作的风格有很大的解释。谢谢！
＆LT;风格X：键=切换的TargetType ={X：类型按钮}＆GT;
＆LT; setter属性=模板＆GT;
＆LT; Setter.Value＆GT;
＆LT;的ControlTemplate的TargetType ={X：类型按钮}＆GT;
＆LT;电网光标=手＆GT;
＆LT; BORDER NAME =后面的保证金=0,1,0,0的背景={StaticResource的ButtonBackground}＆GT;
＆lt;图像名称=imgBut来源={绑定路径=（OriginalImage）的RelativeSource = {的RelativeSource FindAncestor，AncestorType = {X：类型本地：ListButton}}}/＆GT;
＆LT; /边框＆GT;
＆所述;边界了borderThickness =1BorderBrush =＃FF004F92＆GT;
＆LT; BORDER =了borderThickness，0,0,1,0BorderBrush =＃FF101D29/＆GT;
＆LT; /边框＆GT;
＆LT; /网格和GT;
＆LT; ControlTemplate.Triggers＆GT;
＆LT;触发属性=IsMouseOverVALUE =真＆GT;
＆LT;二传手的TargetName =后面的属性=背景VALUE ={StaticResource的ButtonBackgroundMouseOver}/＆GT;
＆LT; /触发＆GT;
＆LT;触发属性=IsEnabledVALUE =FALSE＆GT;
＆LT;二传手的TargetName =imgBut属性=源VALUE ={绑定路径=（DisableImage）的RelativeSource = {的RelativeSource FindAncestor，AncestorType = {X：类型本地：ListButton}}}/＆GT;
＆LT; /触发＆GT;
＆LT; /ControlTemplate.Triggers>
＆LT; /控件模板＆GT;
＆LT; /Setter.Value>
＆LT; /二传手＆GT;
＆LT; /样式和GT;
I am fairly new to WPF and am probably missing something simple here. If I have 3 controls, only the last control will show the OriginalImage that I specify.
Any help would be most appreciated. Thanks Ryan
Main Window
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="200*"/>
<RowDefinition Height="60" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="85" />
<ColumnDefinition Width="85" />
<ColumnDefinition Width="85" />
<ColumnDefinition Width="85" />
<ColumnDefinition Width="300" />
</Grid.ColumnDefinitions>
<Grid Grid.Row="1">
<but:ListButton OriginalImage="/CustomItemsPanel;component/ListBox/Images/add.png"
DisableImage="/CustomItemsPanel;component/ListBox/Images/addunselect.png"
/>
</Grid >
<Grid Grid.Row="1" Grid.Column="1" >
<but:ListButton OriginalImage="/CustomItemsPanel;component/ListBox/Images/add.png"
DisableImage="/CustomItemsPanel;component/ListBox/Images/addunselect.png"
/>
</Grid >
<Grid Grid.Row="1" Grid.Column="2" >
<but:ListButton OriginalImage="/CustomItemsPanel;component/ListBox/Images/add.png"
DisableImage="/CustomItemsPanel;component/ListBox/Images/addunselect.png"
/>
</Grid>
</Grid>
Control XAML
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:CustomItemsPanel.ListButton">
<LinearGradientBrush x:Key="ButtonBackground" EndPoint="0.5,1" StartPoint="0.5,0">
<LinearGradientBrush.GradientStops>
<GradientStop Color="#FF0E3D70"/>
<GradientStop Color="#FF001832" Offset="1"/>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ButtonBackgroundMouseOver" EndPoint="0.5,1" StartPoint="0.5,0">
<LinearGradientBrush.GradientStops>
<GradientStop Color="#FF1E62A1" />
<GradientStop Color="#FF0A3C6D" Offset="1"/>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<LinearGradientBrush x:Key="ButtonBackgroundSelected" EndPoint="0.5,1" StartPoint="0.5,0">
<LinearGradientBrush.GradientStops>
<GradientStop Color="Red" />
<GradientStop Color="#FF0A2A4C" Offset="1"/>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<Style x:Key="Toggle" TargetType="{x:Type Button}">
<Setter Property="Content">
<Setter.Value>
<Image>
<Image.Style>
<Style TargetType="{x:Type Image}">
<Setter Property="Source" Value="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:ListButton}}, Path=OriginalImage}"/>
<Style.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Source" Value="{Binding Path=DisableImage, RelativeSource={RelativeSource TemplatedParent}}"/>
</Trigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid Cursor="Hand">
<Border Name="back" Margin="0,1,0,0" Background="{StaticResource ButtonBackground}">
<ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" x:Name="content" />
</Border>
<Border BorderThickness="1" BorderBrush="#FF004F92">
<Border BorderThickness="0,0,1,0" BorderBrush="#FF101D29" />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter TargetName="back" Property="Background" Value="{StaticResource ButtonBackgroundMouseOver}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type local:ListButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:ListButton}">
<Button Style="{StaticResource Toggle}" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
Control Code Behind
public class ListButton : Control
{
public static readonly DependencyProperty MouseOverImageProperty;
public static readonly DependencyProperty OriginalImageProperty;
public static readonly DependencyProperty DisableImageProperty;
static ListButton() {
DefaultStyleKeyProperty.OverrideMetadata(typeof(ListButton), new FrameworkPropertyMetadata(typeof(ListButton)));
MouseOverImageProperty = DependencyProperty.Register("MouseOverImage", typeof(ImageSource), typeof(ListButton), new UIPropertyMetadata(null));
OriginalImageProperty = DependencyProperty.Register("OriginalImage", typeof(ImageSource), typeof(ListButton), new UIPropertyMetadata(null));
DisableImageProperty = DependencyProperty.Register("DisableImage", typeof(ImageSource), typeof(ListButton), new UIPropertyMetadata(null));
}
public ImageSource MouseOverImage {
get { return (ImageSource)GetValue(MouseOverImageProperty); }
set { SetValue(MouseOverImageProperty, value); }
}
public ImageSource OriginalImage {
get { return (ImageSource)GetValue(OriginalImageProperty); }
set { SetValue(OriginalImageProperty, value); }
}
public ImageSource DisableImage
{
get { return (ImageSource)GetValue(DisableImageProperty); }
set { SetValue(DisableImageProperty, value); }
}
}
解决方案
I am going to answer my own question. Bitbonk has a great explanation for what I was doing wrong and how styles work. Thanks!
<Style x:Key="Toggle" TargetType="{x:Type Button}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid Cursor="Hand">
<Border Name="back" Margin="0,1,0,0" Background="{StaticResource ButtonBackground}">
<Image Name="imgBut" Source="{Binding Path=(OriginalImage), RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:ListButton}}}" />
</Border>
<Border BorderThickness="1" BorderBrush="#FF004F92">
<Border BorderThickness="0,0,1,0" BorderBrush="#FF101D29" />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter TargetName="back" Property="Background" Value="{StaticResource ButtonBackgroundMouseOver}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False" >
<Setter TargetName="imgBut" Property="Source" Value="{Binding Path=(DisableImage), RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:ListButton}}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
这篇关于WPF按钮图像只显示去年控制的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
