WPF学习-自定义控件库！

最新推荐文章于 2024-09-28 18:16:50 发布
最新推荐文章于 2024-09-28 18:16:50 发布
阅读量2.5k 收藏 7
点赞数
分类专栏： # WPF 文章标签： 前端 visual studio code wpf c#
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010839204/article/details/105200633
版权

WPF自定义按钮，增加圆角样式功能！

一、自定义控件库流程（以添加圆角属性为例）

1.创建控件库项目

  1. 新建工程后，默认会有“Themes”文件加，用于保存控件样式。
  2. 右键项目选择添加新建项=> 选择WPF => 选择自定义控件（WPF）=> 输入控件名然后电机添加，创建控件。
  3. 右键项目选择添加资源字典（WPF）=> 输入控件名然后电机添加，创建资源字典。
  4. 创建完毕后的框架如下图：
    在这里插入图片描述

2.控件.cs文件中添加边框圆角属性

    public class MyButton : Button
    {
        static MyButton()
        {
            //                                              新创建的控件名                  模板名，资源字典（如MyButton.xaml），如果要跟旧的一样，直接填“Button”
            DefaultStyleKeyProperty.OverrideMetadata(typeof(MyButton), new FrameworkPropertyMetadata(typeof(MyButton)));
        }

        /// <summary>
        /// 按键圆角属性委托
        /// CornerRadius：用于调用的委托名字
        /// typeof(MyButton)：指定控件
        /// </summary>
        public static readonly DependencyProperty BorderRadiusProperty = DependencyProperty.Register("CornerRadius", typeof(int), typeof(MyButton), new FrameworkPropertyMetadata());

        /// <summary>
        /// 定义按钮圆角属性
        /// </summary>
        public int CornerRadius
        {
            get { return (int)GetValue(BorderRadiusProperty); }
            set { SetValue(BorderRadiusProperty, value); }
        }
    }

3.调用按键资源文件

Generic.xaml中增加如下代码，调用资源文件MyButton.xaml

    <ResourceDictionary.MergedDictionaries>
        <!--引用按键资源字典-->
        <ResourceDictionary Source= "/MyWpfCustomControlLibrary;Component/Themes/MyButton.xaml"/>
    </ResourceDictionary.MergedDictionaries>

4.编辑MyButton.xaml文件，设置样式

vs默认的样式请参考：

Button 样式和模板

添加颜色资源

因为我将通用颜色

    <!--引用颜色资源-->
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source= "/MyWpfCustomControlLibrary;Component/Themes/ColorResource.xaml"/>
    </ResourceDictionary.MergedDictionaries>

设置默认样式

	//将设置默认添加时的样式
    <Style TargetType="local:MyButton">
        <Setter Property="SnapsToDevicePixels" Value="true" />
        <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}" />
        <Setter Property="MinHeight" Value="23" />
        <Setter Property="MinWidth" Value="75" />
        //...后续代码

绑定边框样式数据

在边框属性中，将边框的属性对控件属性进行绑定
其中：
CornerRadius="{Binding Path=CornerRadius,RelativeSource={RelativeSource TemplatedParent}}"，中的CornerRadius 对应.cs文件中创建的委托名
其他属性直接调用的控件原来就有的属性

                        <Border TextBlock.Foreground="{TemplateBinding Foreground}"
                            x:Name="Border"
                            CornerRadius="{Binding Path=CornerRadius,RelativeSource={RelativeSource TemplatedParent}}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                            //...

5.完整MyButton.xaml资源字典如下：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:MyWpfCustomControlLibrary"
                    xmlns:vsm="http://schemas.microsoft.com/netfx/2009/xaml/presentation">
   
    <!--引用颜色资源-->
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source= "/MyWpfCustomControlLibrary;Component/Themes/ColorResource.xaml"/>
    </ResourceDictionary.MergedDictionaries>
    
    <!-- FocusVisual -->
    <Style x:Key="ButtonFocusVisual">
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate>
                    <Border>
                        <Rectangle Margin="2"
                         StrokeThickness="1"
                         Stroke="#60000000"
                         StrokeDashArray="1 2" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <!-- Button -->
    <Style TargetType="local:MyButton">
        <Setter Property="SnapsToDevicePixels" Value="true" />
        <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}" />
        <Setter Property="MinHeight" Value="23" />
        <Setter Property="MinWidth" Value="75" />
        
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <Border TextBlock.Foreground="{TemplateBinding Foreground}"
                            x:Name="Border"
                            CornerRadius="{Binding Path=CornerRadius,RelativeSource={RelativeSource TemplatedParent}}"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">

                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="0:0:0.5" />
                                        <VisualTransition GeneratedDuration="0"
                                      To="Pressed" />
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).
                          (GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                    Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0"
                                             Value="{StaticResource ControlMouseOverColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).
                          (GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                    Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0"
                                             Value="{StaticResource ControlPressedColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).
                          (GradientBrush.GradientStops)[0].(GradientStop.Color)"
                                                    Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0"
                                             Value="{StaticResource PressedBorderDarkColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).
                          (GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                    Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0"
                                             Value="{StaticResource PressedBorderLightColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).
                          (GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                    Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0"
                                             Value="{StaticResource DisabledControlDarkColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames
                          Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)"
                                                    Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0"
                                             Value="{StaticResource DisabledForegroundColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderBrush).
                          (GradientBrush.GradientStops)[1].(GradientStop.Color)"
                                                    Storyboard.TargetName="Border">
                                                <EasingColorKeyFrame KeyTime="0"
                                             Value="{StaticResource DisabledBorderDarkColor}" />
                                            </ColorAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <ContentPresenter Margin="2"
                                HorizontalAlignment="Center"
                                VerticalAlignment="Center"
                                RecognizesAccessKey="True" />
                        </Border>
                    </Grid>
                    
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsDefault" Value="true">
                            <Setter TargetName="Border"  Property="BorderBrush">
                                <Setter.Value>
                                    <LinearGradientBrush StartPoint="0,0"  EndPoint="0,1">
                                        <GradientBrush.GradientStops>
                                            <GradientStopCollection>
                                                <GradientStop Color="{DynamicResource DefaultBorderBrushLightBrush}"  Offset="0.0" />
                                                <GradientStop Color="{DynamicResource DefaultBorderBrushDarkColor}"  Offset="1.0" />
                                            </GradientStopCollection>
                                        </GradientBrush.GradientStops>
                                    </LinearGradientBrush>
                                </Setter.Value>
                            </Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                        
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        
    </Style>

</ResourceDictionary>

6.生成dll

点击生成=> 选择生成项目选项，生成

7.新项目调用

创建新项目，在新项目的引用项右键点击，添加引用
在这里插入图片描述
通过浏览，找到生成的.dll文件，然后将文件添加到系统中，然后系统工具箱会自动显示创建的控件，然后按照正常控件拖拽引用就可以。
在这里插入图片描述
拖拽引用后，xaml文件中会自动添加调用资源：

xmlns:MyWpfCustomControlLibrary="clr-namespace:MyWpfCustomControlLibrary;assembly=MyWpfCustomControlLibrary"

二、自定义ComboBox控件

1.自定义控件编辑模板

  • 组合框样式：编辑ComboBoxStyle
  • 下拉框样式：编辑ComboBoxItemStyle

2.注意事项汇总

自定义格式跨层级绑定外层控件的数据

使用查找绑定的方式绑定数据

CornerRadius="{Binding CornerRadius, RelativeSource={RelativeSource FindAncestor, AncestorLevel=1, AncestorType={x:Type local:UdComboBox}}}"

自定义下拉框样式后出现绑定数据DisplayMemberPath属性无效的情况

这种情况是由于绑定格式时作为内容显示的ContentPresenter没有设置ContentTemplateSelector属性引起的，绑定该属性后解决问题

 ContentTemplateSelector="{TemplateBinding ContentTemplateSelector}"

附件：学习过程中参考的文档如下：

1.自定义控件流程

鱼听禅
关注
专栏目录
WPF--自定义控件的动态添加以及BackgroundWorker的使用
qq_41078703的博客
12-13 1459
昨天在网上看见一位博主写了BackgroundWorker，感觉非常不错。学习加修改之后，随手记录，防止忘记! 在窗口内同一位置，增添旋转效果图，代码如下：<Canvas Grid.Row="2" Grid.Column="1" Name="cavLoading" Visibility="Collapsed" RenderTransformOrigin="0.5,0.5" HorizontalA
WPF自定义控件库项目源码
10-14
在本文中，我们将深入探讨基于WPF（Windows Presentation Foundation）的自定义...总之，`WPF自定义控件库项目源码`是一个宝贵的资源，对于任何想要提升WPF应用界面质量和个性化的开发者来说，都值得深入研究和学习。
WPF 自定义控件
08-18
自定义控件
WPF自定义控件 —— 装饰器
weixin_30414305的博客
09-16 401
顾名思义就是装饰用的，也就是说不改变原有的控件结构，但可以为控件添加一些新的功能，或是为控件的显示外观增加些东西。如MSDN中的例子： 本来TextBox四角没有圆点，但是通过装饰器可以为它加上。所以可以看成在TextBox上加了层。 这样就“无痛”的给控件进行了装饰。当然应用不单单这样加几个点而已，修饰嘛比如拖动控件的修饰 而之前比较著名的层拖拽是Bea Sto...
WPF入门教学二十三 自定义控件开发
最新发布
Life is not divided
09-28 1026
自定义控件提供了更高级的功能，允许开发者继承并扩展WPF框架中的现有控件。完成自定义控件的开发后，可以在其他WPF项目中引用并使用它。
C# WPF 自定义控件库源码.rar
12-10
WPF自定义美化控件，用于界面的美化。可直接在提供的源码基础上开发出属于自己的一套控件库，便于后续系统开发等
WPF自定义控件
wmjcom的专栏
06-15 8102
WPF自定义控件 —— 自绘篇本文示例源代码或素材下载      首先我们来说最简单的画面的呈现。　　一.在自定义控件上画矩形　　增加一个自定义控件类:　　　　打开创建的类重载OnRender函数并注释掉静态构造函数，代码如下　public　class　CustomerRender　:　Control　　　　{　　　　　　　　//static　CustomerRender()　　　　　　　　//{
WPF-自定义控件
05-18
首先，让我们了解什么是WPF自定义控件。在WPF中，自定义控件是通过继承内置的UI元素类（如Control、UserControl或FrameworkElement）并扩展其功能来创建的。这允许开发者自由定制控件的视觉表示、行为以及交互方式。...
WPF 自定义控件库 常用控件封装&常用控件样式重写
03-26
在Windows Presentation Foundation（WPF）框架中，自定义控件库是开发人员为了增强应用程序界面交互性和美观性的重要工具。本资源"GenUI.WPF-master"似乎是一个包含自定义控件和样式重写的项目，旨在提供对常用WPF...
WPF-ControlBase:Wpf封装的自定义控件资源库
05-10
**WPF-ControlBase** 是一个专门针对Windows Presentation Foundation (WPF) 平台设计的自定义控件资源库。这个库旨在提供一系列预封装的、功能丰富的控件，以简化开发人员在创建WPF应用程序时的工作流程。下面将...
WPFDevelopers自定义控件库
03-26
WPF 自定义控件库
WPF自定义控件 自定义依赖属性Demo
03-27
VB.NET做的一个WPF的Demo，做了个控件。像是Windows图标一样.图片加文字，移动到图片上，图片会放大。这个demo也说明了如何建立一个自定义的属性，并把UserControl中的控件属性绑定到自己定义的属性中。
WPF自定义控件（按钮文本框组合框等等）
08-27
WPF 自定义控件（包含全部代码） 自定义按钮、自定义文本框、自定义组合框、自定义日期控件等等
PropertyTools:WPF的自定义控件
05-02
控制 描述 地位 PropertyGrid 显示对象或对象集合的属性的控件。 稳定的 数据网格 具有“ Excel感觉”的数据网格（请注意，控件未虚拟化） 稳定的 树形列表框 看起来和感觉都像TreeView ListBox （支持多选和拖放） 稳定的 颜色选择器 拾色器 稳定的 单选按钮列表 绑定到枚举的单选按钮的集合 稳定的 枚举菜单项 绑定到枚举的可检查菜单项的集合 稳定的 EditableTextBlock 可以更改为TextBox TextBlock ，对于在TreeView中进行就地编辑很有用 稳定的 文件选择器 带有浏览文件按钮的TextBox 稳定的 目录选择器 具有浏览目录按钮的TextBox 稳定的 DockPanelSplitter DockPanel的分配器 稳定的 旋转控制 数字向上/向下微调器控件 稳定的 链接块 TextBlock上的超链接 稳
wpf 各种自定义控件
08-19
wpf 自定义控件
[WPF] 自定义控件库 系列文章
weixin_30585437的博客
05-13 191
Kino.Toolkit.Wpf Kino.Toolkit.Wpf是一组简单实用的WPF控件与工具，用于介绍自定义控件的入门。相关博客地址如下： 开始一个自定义控件库项目 介绍开始一个自定义控件库项目需要考虑的地方，包括版本号、目录结构等。 从ContentControl开始入门自定义控件 ContentControl是WPF中最基础的一种控件，Window、Button、Scroll...
WPF - 自定义控件
xwnxwn的专栏
01-28 342
自定义控件是一个类，它提供自己的样式和模板，这些样式和模板通常在 generic.xaml 中定义。自定义控件用于以下方案 −如果该控件不存在，则必须从头开始创建它。如果要通过添加额外的属性或额外的功能来扩展或向预先存在的控件添加功能，以适合您的特定方案。如果您的控件需要支持主题和样式。如果要跨应用程序共享控件。
WPF有没有自定义控件库
08-17
- *1* *2* *3* [WPF学习-自定义控件库！](https://blog.csdn.net/u010839204/article/details/105200633)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

鱼听禅

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值