我正在开发一个WPF应用程序,其中包含许多按钮,这些按钮需要包含一些文本以及可能的图标。我希望这些按钮具有一致的样式,但可以更改文本和/或图标。我正在使用Mahapps.Metro
进行样式设计,并使用Mahapps.Metro.IconPacks
库进行图标设计。这是我在应用程序中为每个按钮复制的内容:
<Button Padding="15 5"
Margin="5 5 30 5"
Command="{Binding AcceptCommand}"
FontSize="14"
Style="{StaticResource CustomAccentedSquareButtonStyle}"
Grid.Column="2">
<StackPanel Orientation="Horizontal">
<TextBlock Text="Test"
Margin="0 0 5 0"
x:Name="TestTextBlock"/>
<Rectangle Width="12" Height="12"
Fill="{Binding ElementName=TestTextBlock, Path=Foreground}">
<Rectangle.OpacityMask>
<VisualBrush Visual="{StaticResource appbar_check}" Stretch="Fill" />
</Rectangle.OpacityMask>
</Rectangle>
</StackPanel>
和CustomAccentedSquareButtonStyle
:
<Style TargetType="{x:Type Button}" BasedOn="{StaticResource AccentedSquareButtonStyle}"
x:Key="CustomAccentedSquareButtonStyle">
<Setter Property="BorderBrush" Value="{DynamicResource AccentColorBrush2}"/>
<Setter Property="controls:ControlsHelper.ContentCharacterCasing" Value="Normal"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="{DynamicResource AccentColorBrush3}"/>
</Trigger>
</Style.Triggers>
</Style>
因此,我决定尝试制作一个具有某些依赖项属性的自定义按钮,而不是在各处Button
复制相同的代码:
public class CustomButton : Button
{
public Canvas Icon
{
get { return (Canvas)GetValue(IconProperty); }
set { SetValue(IconProperty, value); }
}
public static readonly DependencyProperty IconProperty =
DependencyProperty.Register("Icon", typeof(Canvas), typeof(CustomButton), new PropertyMetadata(defaultValue: null));
public string Text
{
get { return (string)GetValue(TextProperty); }
set { SetValue(TextProperty, value); }
}
public static readonly DependencyProperty TextProperty =
DependencyProperty.Register("Text", typeof(string), typeof(CustomButton), new PropertyMetadata(defaultValue: null));
public int IconWidth
{
get { return (int)GetValue(IconWidthProperty); }
set { SetValue(IconWidthProperty, value); }
}
public static readonly DependencyProperty IconWidthProperty =
DependencyProperty.Register("IconWidth", typeof(int), typeof(CustomButton), new PropertyMetadata(0));
public int IconHeight
{
get { return (int)GetValue(IconHeightProperty); }
set { SetValue(IconHeightProperty, value); }
}
public static readonly DependencyProperty IconHeightProperty =
DependencyProperty.Register("IconHeight", typeof(int), typeof(CustomButton), new PropertyMetadata(0));
}
以及我的自定义Button
的样式:
<Style TargetType="{x:Type customControls:CustomButton}" BasedOn="{StaticResource CustomAccentedSquareButtonStyle}">
<Setter Property="FontSize" Value="14"/>
<Setter Property="Margin" Value="5"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type customControls:CustomButton}">
<customControls:CustomButton Style="{StaticResource CustomAccentedSquareButtonStyle}"
Padding="15 5">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{TemplateBinding Text}"
Margin="0 0 5 0"/>
<Rectangle Width="{TemplateBinding IconWidth}"
Height="{TemplateBinding IconHeight}"
Fill="{TemplateBinding Foreground}">
<Rectangle.OpacityMask>
<VisualBrush Visual="{TemplateBinding Icon}"
Stretch="Fill" />
</Rectangle.OpacityMask>
</Rectangle>
</StackPanel>
</customControls:CustomButton>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
...然后最终使用xaml中的按钮:
<customControls:CustomButton Command="{Binding TestCommand}"
Text="Test"
Icon="{StaticResource appbar_people}"
IconWidth="15"
IconHeight="15"
Grid.Column="1"/>
问题:该图标未显示。文本正在显示,因此设置依赖项属性Text
并在我的ControlTemplate
中将其用于按钮样式显然是可行的。我究竟做错了什么?谢谢!