我们想要达到的结果是，绑定多个checkbox然后我们还可以获取它是否被选中，其实很简单，我们只要找到那几个关键的对象就可以了。
下面是ui,其中定义了一个wrappanel来存放checkbox，还有两个按钮，用于测试相关功能。
<window x:class="wpfapplication1.mainwindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:wpfapplication1"
mc:ignorable="d"
title="mainwindow" height="350" width="525">
<grid name="div" >
<stackpanel margin="0,50,0,0" orientation="horizontal" horizontalalignment="center">
<stackpanel>
<button content="动态添加多个checkbox控件" height="20" padding="15,1,15,2" x:name="btnadd" click="btnadd_click"></button>
</stackpanel>
</stackpanel>
<scrollviewer scrollviewer.verticalscrollbarvisibility="auto" height="150">
<border borderbrush="#797979" borderthickness="1" margin="5,0,5,5">
<wrappanel x:name="addcheckbox"/>
</border>
</scrollviewer>
<button x:name="button" content="button" horizontalalignment="left" margin="37,261,0,0" verticalalignment="top" width="75" click="button_click"/>
<button x:name="button1" content="button" horizontalalignment="left" margin="379,50,0,0" verticalalignment="top" width="75" click="button1_click"/>
</grid>
</window>
在动态添加checkbox中我们定义了一个checkbox数组，此后又实例化了thickness对象，它是用于描述矩形周围的粗细，然后我们又循环了数组的长度来进行添加（对其中name为addcheckbox的控件），至此，checkbox已动态添加。
那如何删除呢？我们依旧需要获取那个名为addcheckbox的控件的儿子们（children）来进行remove。请看以下代码片段。
private void button1_click(object sender, routedeventargs e)
{
for (int i = 0; i < addcheckbox.children.count;)
{
this.addcheckbox.children.remove(addcheckbox.children[i]);
}
}
循环其中的值也是非常的简单，因为我们在上面绑定的时候，已经给它的content或者是datacontext都赋值了，所以我们只要获取就ok了。
private void button_click(object sender, routedeventargs e)
{
foreach (uielement item in addcheckbox.children)
{
if (item is checkbox)
{
checkbox checkbox = (item as checkbox);
if (checkbox.ischecked == true)
{
messagebox.show(checkbox.content.tostring());
}
}
}
}
最后生成出来的效果是这样的,是不是非常丑，那我教你如何进行简单的美化。
在我们添加checkbox的时候有两种引入方式，一种是 checkbox.style = resources[“noticebox“] as style; 另一种的话是 style style = (style)this.findresource(“noticebutton“); 那两者有什么区别呢？
第一个是必须将资源文件引用到当前页面，第二种的是在app.xaml进行查找不包括app.xaml中引入的(外部的资源文件)。下面我们写一个checkbox样式在app,xaml中。
<application x:class="wpfapplication1.app"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:wpfapplication1"
startupuri="mainwindow.xaml">
<application.resources>
<style x:key="checkboxswitchstyle" targettype="checkbox">
<setter property="ischecked" value="false"/>
<setter property="cursor" value="hand"/>
<setter property="fontfamily" value="/mestoolintegration;component/fonts/#iconfont"/>
<setter property="background" value="#ffffff"/>
<setter property="template">
<setter.value>
<controltemplate targettype="checkbox">
<border width="54" name="checktruebg" height="22" borderthickness="1" background="#ffffff" cornerradius="10" borderbrush="#acacac" >
<grid>
<border borderthickness="1" background="#acacac" x:name="border" width="20" height="20" cornerradius="9" verticalalignment="center" horizontalalignment="left" margin="0" >
<border.rendertransform>
<translatetransform x="1"/>
</border.rendertransform>
</border>
<textblock x:name="txt" text="{templatebinding content}" fontfamily="iconfont" fontsize="{templatebinding fontsize}" margin="6.996,2.798,0,2.798" verticalalignment="stretch" foreground="#acacac" horizontalalignment="left" >
<textblock.rendertransform>
<translatetransform x="17"></translatetransform>
</textblock.rendertransform>
</textblock>
</grid>
</border>
<controltemplate.triggers>
<trigger property="ischecked" value="true">
<setter property="background" targetname="checktruebg" value="#5fb878"/>
<setter property="foreground" targetname="txt" value="#ffffff"/>
<setter property="background" targetname="border" value="#ffffff"/>
<setter property="text" targetname="txt" value="{binding tag,relativesource={relativesource templatedparent}}"/>
<trigger.enteractions>
<beginstoryboard>
<storyboard>
<doubleanimation storyboard.targetname="border" storyboard.targetproperty="(uielement.rendertransform).(translatetransform.x)" to="32" duration="00:00:0.2"/>
<doubleanimation storyboard.targetname="txt" storyboard.targetproperty="(uielement.rendertransform).(translatetransform.x)" to="0" duration="00:00:0.2"/>
</storyboard>
</beginstoryboard>
</trigger.enteractions>
<trigger.exitactions>
<beginstoryboard>
<storyboard>
<doubleanimation storyboard.targetname="border" storyboard.targetproperty="(uielement.rendertransform).(translatetransform.x)" to="0" duration="00:00:0.2"/>
<doubleanimation storyboard.targetname="txt" storyboard.targetproperty="(uielement.rendertransform).(translatetransform.x)" to="17" duration="00:00:0.2"/>
</storyboard>
</beginstoryboard>
</trigger.exitactions>
</trigger>
<trigger property="ischecked" value="false">
<setter property="text" targetname="txt" value="{binding content,relativesource={relativesource templatedparent}}"/>
</trigger>
</controltemplate.triggers>
</controltemplate>
</setter.value>
</setter>
</style>
</application.resources>
</application>
就这样我们在生成checkbox中进行配置，代码如下。
private void btnadd_click(object sender, routedeventargs e)
{
int num = 6;
checkbox[] check = new checkbox[num];
thickness th = new thickness();
th.bottom = 10;
th.left = 10;
th.right = 10;
th.top = 10;
for (int i = 0; i < check.length; i++)
{
check[i] = new checkbox();
//设置checkbox属性
check[i].margin = th;
check[i].content = i + 1;
check[i].name = "heheda";
check[i].datacontext = "asdas";
check[i].style = (style)this.findresource("checkboxswitchstyle");
this.addcheckbox.children.add(check[i]);
}
}
启动页面我们可以发现引入成功了。
不难发现，看一下代码，我们如何还想写别的样式，这个时候应该怎么办？难道还要往app.xaml里写？这就非常恶心了，所以我们采用引入的方式，这和css有点像！新建一个资源字典。
在其中写入写入以下样式。
<resourcedictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:wpfapplication1">
<style x:key="btninfostyle" targettype="button">
<setter property="width" value="70"/>
<setter property="height" value="25"/>
<setter property="foreground" value="white"/>
<setter property="borderthickness" value="0"/>
<setter property="background" value="#43a9c7"/>
<setter property="template">
<setter.value>
<controltemplate targettype="button">
<border x:name="border" background="{templatebinding background}" borderbrush="{templatebinding borderbrush}" borderthickness="{templatebinding borderthickness}" snapstodevicepixels="true">
<textblock text="{templatebinding content}" foreground="{templatebinding foreground}" verticalalignment="center" horizontalalignment="center"/>
</border>
<controltemplate.triggers>
<trigger property="ismouseover" value="true">
<setter targetname="border" property="background" value="#2f96b4"/>
</trigger>
<trigger property="ispressed" value="true">
<setter targetname="border" property="background" value="#2a89a4"/>
</trigger>
</controltemplate.triggers>
</controltemplate>
</setter.value>
</setter>
</style>
</resourcedictionary>
然后在app.xaml中进行引用，这里需要注意是，有可能我们的style和外部字典都放进去了，它们的关系是style其实也是一个字典，然后就变成了这样。
<application.resources>
<resourcedictionary>
<resourcedictionary.mergeddictionaries>
<resourcedictionary source="dictionary1.xaml"/>
</resourcedictionary.mergeddictionaries>
<style x:key="checkboxswitchstyle" targettype="checkbox">
<setter property="ischecked" value="false"/>
<setter property="cursor" value="hand"/>
<setter property="fontfamily" value="/mestoolintegration;component/fonts/#iconfont"/>
<setter property="background" value="#ffffff"/>
<setter property="template">
<setter.value>
<controltemplate targettype="checkbox">
<border width="54" name="checktruebg" height="22" borderthickness="1" background="#ffffff" cornerradius="10" borderbrush="#acacac" >
<grid>
<border borderthickness="1" background="#acacac" x:name="border" width="20" height="20" cornerradius="9" verticalalignment="center" horizontalalignment="left" margin="0" >
<border.rendertransform>
<translatetransform x="1"/>
</border.rendertransform>
</border>
<textblock x:name="txt" text="{templatebinding content}" fontfamily="iconfont" fontsize="{templatebinding fontsize}" margin="6.996,2.798,0,2.798" verticalalignment="stretch" foreground="#acacac" horizontalalignment="left" >
<textblock.rendertransform>
<translatetransform x="17"></translatetransform>
</textblock.rendertransform>
</textblock>
</grid>
</border>
<controltemplate.triggers>
<trigger property="ischecked" value="true">
<setter property="background" targetname="checktruebg" value="#5fb878"/>
<setter property="foreground" targetname="txt" value="#ffffff"/>
<setter property="background" targetname="border" value="#ffffff"/>
<setter property="text" targetname="txt" value="{binding tag,relativesource={relativesource templatedparent}}"/>
<trigger.enteractions>
<beginstoryboard>
<storyboard>
<doubleanimation storyboard.targetname="border" storyboard.targetproperty="(uielement.rendertransform).(translatetransform.x)" to="32" duration="00:00:0.2"/>
<doubleanimation storyboard.targetname="txt" storyboard.targetproperty="(uielement.rendertransform).(translatetransform.x)" to="0" duration="00:00:0.2"/>
</storyboard>
</beginstoryboard>
</trigger.enteractions>
<trigger.exitactions>
<beginstoryboard>
<storyboard>
<doubleanimation storyboard.targetname="border" storyboard.targetproperty="(uielement.rendertransform).(translatetransform.x)" to="0" duration="00:00:0.2"/>
<doubleanimation storyboard.targetname="txt" storyboard.targetproperty="(uielement.rendertransform).(translatetransform.x)" to="17" duration="00:00:0.2"/>
</storyboard>
</beginstoryboard>
</trigger.exitactions>
</trigger>
<trigger property="ischecked" value="false">
<setter property="text" targetname="txt" value="{binding content,relativesource={relativesource templatedparent}}"/>
</trigger>
</controltemplate.triggers>
</controltemplate>
</setter.value>
</setter>
</style>
</resourcedictionary>
</application.resources>
我把缩进的截图发上来，更直观。
在其中还有内嵌的样式，可以这么写，如果是page的话你就 <page.resources> ，如果是windows的话那就wndows，当然如果需要页面引入字典的话你可以这么做。
<window.resources>
<resourcedictionary>
<resourcedictionary.mergeddictionaries>
<resourcedictionary source="style/test.xaml"/>
</resourcedictionary.mergeddictionaries>
</resourcedictionary>
</window.resources>
那么今天就这样~
黄山市民网：https://www.huangshanshimin.com/
