WPF 如何创建自己的自定义控件库
创建步骤
在我们平时的项目中,我们经常需要一套自己的自定义控件库,这个特别是在Prism这种框架下面进行开发的时候,每个人都使用一套统一的控件,这样才不会每个人由于界面不统一而造成的整个软件系统千差万别,所以我们需要创建自己的一套界面库。下面介绍如何在WPF程序下创建自定义控件库。
1 在我们的项目中,在解决方案右键-》新建项目,添加“WPF自定义控件库”。
2 在默认生成的项目下面,会有两个文件,一个是“Generic.xaml”文件,另外一个是继承自Control类的CustomControl1这个文件,默认情况下这个文件的内容为:
public class CustomControl1 : Control { static CustomControl1() { DefaultStyleKeyProperty.OverrideMetadata(typeof(CustomControl1), new FrameworkPropertyMetadata(typeof(CustomControl1))); } }
在这个类里面,我们可以定义需要绑定到前台的各种依赖项属性,从而在后台实现数据的绑定。
3 我们有时需要添加资源字典xaml文件,但是添加的资源字典必须放在Generic.xaml文件下面,比如我们添加了一个Group.xaml的文件,最后在Generic.xaml文件下必须通过ResourceDictionary.MergedDictionaries的方式将Group.xaml放在里面,这个是必须要引起注意的地方,否则添加的自定义控件是不能够进行识别的。
<ResourceDictionary.MergedDictionaries> <ResourceDictionary Source="/X.UI;component/Themes/Group.xaml"></ResourceDictionary> </ResourceDictionary.MergedDictionaries>
4 另外在定义完了Group.xaml文件之后,我们需要定义对应的Group.cs文件从而和前台的Group.xaml文件进行交互,这里我们需要定义很多依赖项属性。
5 编译生成DLL文件。
6 在其他项目中通过引用该程序集,通过clr-namespace和assembly引用该程序集,并达到引用该控件的目的。
下面贴出Group.xaml和Group.cs文件来说明如何创建一个简单的自定义控件库。
Group.xaml:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:X.UI.Controls"> <ResourceDictionary.MergedDictionaries> <ResourceDictionary Source="/X.UI.Controls;Component/Themes/Public.xaml"></ResourceDictionary> <ResourceDictionary Source="/X.UI.Controls;Component/Themes/YouDaoPing.xaml"></ResourceDictionary> </ResourceDictionary.MergedDictionaries> <Style TargetType="local:Group"> <Setter Property="Background" Value="#eee"></Setter> <Setter Property="HeaderBackground" Value="{StaticResource Decorative}"></Setter> <Setter Property="Foreground" Value="{StaticResource DarkColor}"></Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="local:Group"> <Grid Background="{TemplateBinding Background}"> <Grid.RowDefinitions> <RowDefinition Height="40"></RowDefinition> <RowDefinition Height="*"></RowDefinition> </Grid.RowDefinitions> <Border Background="{TemplateBinding HeaderBackground}" Padding="10 0"> <Grid> <ContentPresenter Content="{TemplateBinding Header}" HorizontalAlignment="{TemplateBinding HeaderAlign}" VerticalAlignment="Center"></ContentPresenter> <ContentPresenter Content="{TemplateBinding ToolBar}" HorizontalAlignment="{TemplateBinding ToolBarAlign}" VerticalAlignment="Center"></ContentPresenter> </Grid> </Border> <Border Background="{TemplateBinding Background}" Grid.Row="1"> <ContentPresenter Margin="{TemplateBinding Padding}"></ContentPresenter> </Border> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </ResourceDictionary>
Group.cs文件:
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; using System.Windows; using System.Windows.Controls; using System.Windows.Data; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Imaging; using System.Windows.Navigation; using System.Windows.Shapes; namespace X.UI.Controls { /// <summary> /// 按照步骤 1a 或 1b 操作,然后执行步骤 2 以在 XAML 文件中使用此自定义控件。 /// /// 步骤 1a) 在当前项目中存在的 XAML 文件中使用该自定义控件。 /// 将此 XmlNamespace 特性添加到要使用该特性的标记文件的根 /// 元素中: /// /// xmlns:MyNamespace="clr-namespace:X.UI.Controls" /// /// /// 步骤 1b) 在其他项目中存在的 XAML 文件中使用该自定义控件。 /// 将此 XmlNamespace 特性添加到要使用该特性的标记文件的根 /// 元素中: /// /// xmlns:MyNamespace="clr-namespace:X.UI.Controls;assembly=X.UI.Controls" /// /// 您还需要添加一个从 XAML 文件所在的项目到此项目的项目引用, /// 并重新生成以避免编译错误: /// /// 在解决方案资源管理器中右击目标项目,然后依次单击 /// “添加引用”->“项目”->[选择此项目] /// /// /// 步骤 2) /// 继续操作并在 XAML 文件中使用控件。 /// /// <MyNamespace:CustomControl1/> /// /// </summary> public class Group : System.Windows.Controls.HeaderedContentControl { static Group() { DefaultStyleKeyProperty.OverrideMetadata(typeof(Group), new FrameworkPropertyMetadata(typeof(Group))); } public HorizontalAlignment HeaderAlign { get { return (HorizontalAlignment)GetValue(HeaderAlignProperty); } set { SetValue(HeaderAlignProperty, value); } } // Using a DependencyProperty as the backing store for HeaderAlign. This enables animation, styling, binding, etc... public static readonly DependencyProperty HeaderAlignProperty = DependencyProperty.Register("HeaderAlign", typeof(HorizontalAlignment), typeof(Group), new PropertyMetadata(HorizontalAlignment.Center)); public Panel ToolBar { get { return (Panel)GetValue(ToolBarProperty); } set { SetValue(ToolBarProperty, value); } } // Using a DependencyProperty as the backing store for ToolBar. This enables animation, styling, binding, etc... public static readonly DependencyProperty ToolBarProperty = DependencyProperty.Register("ToolBar", typeof(Panel), typeof(Group), new PropertyMetadata(null)); public HorizontalAlignment ToolBarAlign { get { return (HorizontalAlignment)GetValue(ToolBarAlignProperty); } set { SetValue(ToolBarAlignProperty, value); } } public static readonly DependencyProperty ToolBarAlignProperty = DependencyProperty.Register("ToolBarAlign", typeof(HorizontalAlignment), typeof(Group), new PropertyMetadata(HorizontalAlignment.Right)); public Brush HeaderBackground { get { return (Brush)GetValue(HeaderBackgroundProperty); } set { SetValue(HeaderBackgroundProperty, value); } } // Using a DependencyProperty as the backing store for HeaderBackground. This enables animation, styling, binding, etc... public static readonly DependencyProperty HeaderBackgroundProperty = DependencyProperty.Register("HeaderBackground", typeof(Brush), typeof(Group), new PropertyMetadata(null)); } }
在这里我们也可以着重看一下该文件中注释的部分。
注意事项:
1 创建错误的项目类型
这个问题比较坑,但很容易就忽略了,有时我们发现我们就是创建一个普通的类库,然后按照上面的步骤进行最后发现无论如何都无法显示我们定义的控件,甚至调试代码的时候连OnApplyTemplate方法都不能够进去,真够郁闷的,这是由于创建了错误的类型,那是否有补救的方法呢?这个问题其实很多人可能都碰到过了,可以通过修改AssemblyInfo.cs里面的部分代码就能解决这个问题,另外我们发现如果是定义的普通的类库我们发现默认连右键添加资源字典(xaml)的选项都没有,所以在开发的时候特别需要注意,这里你可以点击这里查看具体解决办法,这里就不再赘述,最后在链接里面的方法的基础上再补充一种实现方式,其实这个问题的核心是当前自定义的控件找不到对应的资源这里可以通过代码进行指定即可。
using System; using System.Windows; using System.Windows.Controls; namespace Y.UI { public class MyTestButton : Button { static MyTestButton() { DefaultStyleKeyProperty.OverrideMetadata(typeof(MyTestButton), new FrameworkPropertyMetadata(typeof(MyTestButton))); } public MyTestButton() { Resources.MergedDictionaries.Add(new ResourceDictionary() { Source = new Uri("pack://application:,,,/Y.UI;component/Themes/Generic.xaml") }); } public override void OnApplyTemplate() { base.OnApplyTemplate(); } } }