wpf中自定义控件的默认样式
问题描述:
我想在wpf中设计一个灵活的图像按钮。
首先,我命名空间 '的ImageButton' 创建一个WPF自定义控件库象下面这样:wpf中自定义控件的默认样式
namespace ImageButton
{
public class ImageButton : Button
{
static ImageButton()
{
DefaultStyleKeyProperty.OverrideMetadata(typeof(ImageButton), new FrameworkPropertyMetadata(typeof(ImageButton)));
}
#region DisplayMode
[System.ComponentModel.Category("ImageButton")]
public ImageDisplayMode DisplayMode
{
get { return (ImageDisplayMode)GetValue(DisplayModeProperty); }
set { SetValue(DisplayModeProperty, value); }
}
public static readonly DependencyProperty DisplayModeProperty =
DependencyProperty.Register("DisplayMode", typeof(ImageDisplayMode), typeof(ImageButton), new FrameworkPropertyMetadata(ImageDisplayMode.ImageAboveText), displaymodevalidate);
public static bool displaymodevalidate(object value)
{
return value is ImageDisplayMode;
}
#endregion
}
}
在命名空间
“的ImageButton” 我定义了一个名为 'ImageDisplayMode' 枚举象下面这样:
public enum ImageDisplayMode
{
ImageAboveText = 1,
TextAboveImage = 2,
ImageBeforeText = 3,
TextBeforeImage = 4
}
和Generic.xaml文件修改象下面这样:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ImageButton">
<Style x:Name="style1" TargetType="{x:Type local:ImageButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:ImageButton}">
<Button Background="Transparent">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Image Grid.ColumnSpan="2" Name="img1" Width="{TemplateBinding ImageWidth}" Stretch="{TemplateBinding ImageStretch}" Height="{TemplateBinding ImageHeight}" Source="{TemplateBinding Image}"/>
<TextBlock Grid.ColumnSpan="2" Grid.Row="1" Name="lbl1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Text="{TemplateBinding Text}"/>
</Grid>
</Button>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
的上面的代码的结果是如下图所示:
[图像]
文本
我想: 当我改变的ImageButton的 'DISPLAYMODE' 属性的值,对于每个可能的值,则控制改变为以下的形式:
1 ---- ---------------------------------
[Image]
文字
2 ---- ---------------------------------
Text
[Image]
3 -------------------------------------
[Image ]文本
4 --------------------------------------
Text [Image ]
我想,我必须在电网Generic.xaml码定义触发象下面这样:
<Grid.Triggers>
<Trigger Property="DisplayMode" Value="2">
<Setter Property="Grid.Row" TargetName="lbl1" Value="0"/>
<Setter Property="Grid.Row" TargetName="img1" Value="1"/>
</Trigger>
</Grid.Triggers>
请告诉我:
如何CA我做到了吗?
非常感谢你
答
感谢fmunkert ...
我将我的触发器ControlTemplate.Triggers和更改Trigger.Value从“2”到“ImageAboveText”(我的自定义枚举的项目之一)如下图所示:
编辑之前:
编辑<Trigger Property="DisplayMode" Value="2">
<Setter Property="Grid.Row" TargetName="lbl1" Value="0"/>
<Setter Property="Grid.Row" TargetName="img1" Value="1"/>
</Trigger>
后:
<Trigger Property="DisplayMode" Value="ImageAboveText">
<Setter Property="Grid.Row" TargetName="lbl1" Value="0"/>
<Setter Property="Grid.Row" TargetName="img1" Value="1"/>
</Trigger>
我的问题成功解决了....
谢谢。
答
添加触发器,以你的风格(即<Style.Triggers>...</Style.Triggers>
)。
I.e.是这样的:
<Style.Triggers>
<Trigger Property="DisplayMode" Value="2">
<Setter Property="Grid.Row" TargetName="lbl1" Value="0"/>
<Setter Property="Grid.Row" TargetName="img1" Value="1"/>
</Trigger>
</Style.Triggers>
谢谢你,我测试你的答案,但有错误:我将我的触发器移动到controltemplate,它的错误已解决,但无法正常工作。 –