The easiest way is to create a specific control with an Image
property:
public class ImageButton : Button
{
static ImageButton()
{
DefaultStyleKeyProperty.OverrideMetadata(typeof (ImageButton),
new FrameworkPropertyMetadata(typeof (ImageButton)));
}
public ImageSource Image
{
get { return (ImageSource)GetValue(ImageProperty); }
set { SetValue(ImageProperty, value); }
}
public static readonly DependencyProperty ImageProperty =
DependencyProperty.Register("Image", typeof(ImageSource), typeof(ImageButton), new PropertyMetadata(default(ImageSource)));
}
Then you just create a style for it in generic.xaml, and bind to the Image
property instead of setting the image explicitly:
<Style x:Key="{x:Type my:ImageButton}" TargetType="{x:Type my:ImageButton}">
<!-- Some setters -->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type my:ImageButton}">
<Grid>
<Image Source="{TemplateBinding Image}" Stretch="Fill"/>
</Grid>
<ControlTemplate.Triggers>
<!-- Some triggers ( IsFocused, IsMouseOver, etc.) -->
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Then you can just use it like this:
<my:ImageButton Image="Image.png" />
If you need more images for different states of the button, you can add more dependency properties to the control.
Another possible approach is to use what I call a "parameterized style", to avoid creating a specific control; see this blog post for details.
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…