因为有时候需要定制化的控件,需要多个控件的组合及复杂功能的集成,这样可以考虑自定义用户控件。下面分享一个简单的数值增减功能的自定义控件作为说明。

效果图如下:

1、创建自定义用户控件(添加->新建项->用户控件)

2、编写XAML

<UserControl x:Class="XXX.自定义控件.MyNumericUpDown"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:XXX.自定义控件"
mc:Ignorable="d"
d:DesignHeight="" d:DesignWidth="">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="40*"/>
<ColumnDefinition Width="40*"/>
</Grid.ColumnDefinitions> <TextBox Name="TextBox_Num" Grid.Column="" Text="" FontSize="" TextAlignment="Center" MinWidth="" VerticalContentAlignment="Center"/>
<Button Name="Button_Add" Grid.Column="" Content="加" Click="Button_Add_Click" Background="Aqua"/>
<Button Name="Button_Sub" Grid.Column="" Content="减" Click="Button_Sub_Click" Background="Aqua"/> </Grid>
</UserControl>

UI比较简单,我就不解释了...

2、编写后台代码

 /// <summary>
/// MyNumericUpDown.xaml 的交互逻辑
/// </summary>
public partial class MyNumericUpDown : UserControl
{ /// <summary>
/// 当前值
/// </summary>
public int Num
{
get
{
int value = ;
this.Dispatcher.Invoke(new Action(() =>
value = Convert.ToInt32(this.TextBox_Num.Text.Trim())
));
return value;
}
set
{
this.Dispatcher.Invoke(new Action(() =>
{
this.TextBox_Num.Text = value.ToString();
}));
}
} public MyNumericUpDown()
{
InitializeComponent();
} private void Button_Add_Click(object sender, RoutedEventArgs e)
{
int num = int.Parse(this.TextBox_Num.Text.Trim());
if (num > )
{
this.TextBox_Num.Text = (num + ).ToString();
}
} private void Button_Sub_Click(object sender, RoutedEventArgs e)
{
int num = int.Parse(this.TextBox_Num.Text.Trim());
if (num > )
{
if ((num - ) == )
return;
this.TextBox_Num.Text = (num - ).ToString();
}
}
}

逻辑也比较简单,两个按键的点击事件,每次加一或减一。值得说明的是公开的属性(该例只有一个公开属性就是控件的数值Num),属性需要进行读写器的包装,读取器和设置器操作控件TextBox时最好需要Invoke回调UI线程进行操作,否则其他线程操作时就会报错(当然也可以在外部Invoke)。

3、控件调用

用户控件继承UserControl,UserControl继承于ContentControl,所以可以和一般控件一样调用,但是由于命名空间不一致,需要声明命名空间。

xmlns:z="clr-namespace:XXX.自定义控件"  //Windows标签中声明命名空间
<z:MyNumericUpDown x:Name="MyNumericUpDown_PageNum" Width="" Height=""></z:MyNumericUpDown>

其实最好可以把对外需要进行数据绑定的属性写成依赖项属性,这样就能拥有依赖项属性的特点(如绑定),不过比较复杂,下次再具体说明。

WPF自定义控件的制作的更多相关文章

  1. WPF自定义控件与样式(3)-TextBox & RichTextBox & PasswordBox样式、水印、Label标签、功能扩展

    一.前言.预览 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要是对文本 ...

  2. WPF自定义控件与样式(1)-矢量字体图标(iconfont)

    一.图标字体 图标字体在网页开发上运用非常广泛,具体可以网络搜索了解,网页上的运用有很多例子,如Bootstrap.但在C/S程序中使用还不多,字体图标其实就是把矢量图形打包到字体文件里,就像使用一般 ...

  3. WPF自定义控件与样式(2)-自定义按钮FButton

    一.前言.效果图 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 还是先看看效果 ...

  4. WPF自定义控件与样式(15)-终结篇 & 系列文章索引 & 源码共享

    系列文章目录  WPF自定义控件与样式(1)-矢量字体图标(iconfont) WPF自定义控件与样式(2)-自定义按钮FButton WPF自定义控件与样式(3)-TextBox & Ric ...

  5. WPF自定义控件与样式(4)-CheckBox/RadioButton自定义样式

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: Che ...

  6. WPF自定义控件与样式(5)-Calendar/DatePicker日期控件自定义样式及扩展

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 日历控 ...

  7. WPF自定义控件与样式(6)-ScrollViewer与ListBox自定义样式

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: Scr ...

  8. WPF自定义控件与样式(7)-列表控件DataGrid与ListView自定义样式

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: Dat ...

  9. WPF自定义控件与样式(8)-ComboBox与自定义多选控件MultComboBox

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 下拉选 ...

随机推荐

  1. UDP组播

    多播(组播) 组播组可以是永久的也可以是临时的.组播组地址中,有一部分由官方分配的,称为永久组播组.永久组播组保持不变的是它的ip地址,组中的成员构成可以发生变化.永久组播组中成员的数量都可以是任意的 ...

  2. [译]Vulkan教程(25)描述符布局和buffer

    [译]Vulkan教程(25)描述符布局和buffer Descriptor layout and buffer 描述符布局和buffer Introduction 入门 We're now able ...

  3. java8-CompleableFuture的使用1

    背景 硬件的极速发展,多核心CPU司空见惯:分布式的软件架构司空见惯: 功能API大多采用混聚的方式把基础服务的内容链接在一起,方便用户生活. 抛出了两个问题: 如何发挥多核能力: 切分大型任务,让每 ...

  4. 利用Python进行数据分析-Pandas(第七部分-时间序列)

    时间序列(time series)数据是一种重要的结构化数据形式,应用于多个领域,包括金融学.经济学.生态学.神经科学.物理学等.时间序列数据的意义取决于具体的应用场景,主要有以下几种: 时间戳(ti ...

  5. DOM介绍以及使用方法

    DOM的基本讲解 一.DOM (Document Object Model)文档对象模型 1.有属性有方法 var person = { name:'派大星', fav:function(){ } } ...

  6. 【ST开发板评测】Nucleo-F411RE开箱报告

    前言 面包板又举办开发板试用活动了,很荣幸能获得一块ST官方的Nucleo-F411RE开发板,感谢面包板社区和ST意法半导体的赞助,这是我第一次试用官方的开发板,收到板子后查了一些关于ST官方开发板 ...

  7. Linux系统:常用Linux系统管理命令总结

    本文源码:GitHub·点这里 || GitEE·点这里 一.目录指令 1.创建目录make directory mkdir 目录名称 //mkdir spring,创建一个spring文件夹 mkd ...

  8. Kubernetes的ConfigMap对象使用

    ConfigMap和Secret几乎一样,只是Secret会用base64加密,创建方式也可以彩yaml或者文件方式 下面演示一下通过文件创建configmap 创建配置文件my.yaml name: ...

  9. vue-cli引用vant使用rem自适应

    摘要 由于需要用到弹出层但是懒得造轮子所以使用vant 介绍 使用的node包管理器为yarn vue-cli版本4 rem计算方式为index.html的js脚本计算 安装vant yarn add ...

  10. UITableView HeaderView,FooterView 使用SnapKit布局导致约束异常

    今天做一个APP里面设置页面(个人中心) 就是一个列表菜单 顶部是一个头像和账户标题, 底部为一个退出登录按钮 当然我第一时间就想到了UITableView, HeaderView, FooterVi ...