比如初始化图片和点击后的图片
public static readonly DependencyProperty NormalImageProperty = DependencyProperty.RegisterAttached(
"NormalImage",
typeof(ImageSource),
typeof(ButtonAttachments),
new PropertyMetadata(null));
public static ImageSource GetNormalImage(DependencyObject obj)
return (ImageSource)obj.GetValue(NormalImageProperty);
public static void SetNormalImage(DependencyObject obj, ImageSource value)
obj.SetValue(NormalImageProperty, value);
public static readonly DependencyProperty PressedImageProperty = DependencyProperty.RegisterAttached(
"PressedImage",
typeof(ImageSource),
typeof(ButtonAttachments),
new PropertyMetadata(null));
public static ImageSource GetPressedImage(DependencyObject obj)
return (ImageSource)obj.GetValue(PressedImageProperty);
public static void SetPressedImage(DependencyObject obj, ImageSource value)
obj.SetValue(PressedImageProperty, value);
图片的位置放置
public static readonly DependencyProperty ImagePositionProperty = DependencyProperty.RegisterAttached(
"ImagePosition",
typeof(PositionEnumType),
typeof(ButtonAttachments),
new PropertyMetadata(PositionEnumType.Right));
public static void SetImagePosition(DependencyObject element, PositionEnumType value)
element.SetValue(ImagePositionProperty, value);
public static PositionEnumType GetImagePosition(DependencyObject element)
return (PositionEnumType) element.GetValue(ImagePositionProperty);
public static readonly DependencyProperty ContentMarginProperty = DependencyProperty.RegisterAttached(
"ContentMargin",
typeof(Thickness),
typeof(ButtonAttachments),
new PropertyMetadata(default(Thickness)));
public static void SetContentMargin(DependencyObject element, object value)
element.SetValue(ContentMarginProperty, value);
public static Thickness GetContentMargin(DependencyObject element)
return (Thickness)element.GetValue(ContentMarginProperty);
接下来是Style的更改。Left表示图片在左边~
<DataTrigger Binding="{Binding Path=(res:ButtonAttachments.ImagePosition),RelativeSource={RelativeSource Self},Mode=OneWay}" Value="Left">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Grid x:Name="MainGrid">
<Border x:Name="BorderBg"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}"
CornerRadius="{Binding Path=(res:ButtonAttachments.CornerRadius),RelativeSource={RelativeSource TemplatedParent}}"/>
<StackPanel VerticalAlignment="{TemplateBinding VerticalAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalAlignment}"
Margin="{TemplateBinding Padding}"
Orientation="Horizontal">
<Image Name="Image"
Stretch="Uniform"
Margin="{Binding Path=(res:ButtonAttachments.ContentMargin), RelativeSource={RelativeSource TemplatedParent}}"
Width="{Binding Path=(res:ButtonAttachments.ImageWidth), RelativeSource={RelativeSource TemplatedParent}}"
Height="{Binding Path=(res:ButtonAttachments.ImageHeight), RelativeSource={RelativeSource TemplatedParent}}"
Source="{Binding Path=(res:ButtonAttachments.NormalImage), RelativeSource={RelativeSource TemplatedParent}}"/>
<ContentPresenter RecognizesAccessKey="True"
VerticalAlignment="Center"/>
</StackPanel>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="Image" Property="Image.Source" Value="{Binding Path=(res:ButtonAttachments.PressedImage), RelativeSource={RelativeSource TemplatedParent}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</DataTrigger>
<Button Style="{StaticResource Style.ImageButton}"
Width="50"
Height="50"
Content="123"
Background="Transparent"
attachment:ButtonAttachments.ContentMargin="0 10 0 0"
attachment:ButtonAttachments.CornerRadius="10"
attachment:ButtonAttachments.ImagePosition="Bottom"
attachment:ButtonAttachments.ImageWidth="18"
attachment:ButtonAttachments.ImageHeight="18"
attachment:ButtonAttachments.NormalImage="{StaticResource Image.HelpNormal}"
attachment:ButtonAttachments.PressedImage="{StaticResource Image.HelpPress}"/>
https://github.com/yinghualuowu/SakuraStyle