最近在学习itemscontrol这个控件的时候，查看了msdn上面的一个例子，并且自己做了一些修改，这里主要使用了两种方式来进行相应的数据绑定，一种是使用datacontext，另外一种是直接将一个类绑定到前台，其实这两种方式原理差不多都是将数据模型的对象添加到一个observablecollection集合中，然后再绑定到前台,下面分别介绍两种绑定方式：
第一种
是将数据存储在一个observablecollection集合中，然后作为itemscontrol的datacontext对象，下面分别贴出相关的代码：
<window x:class="testgrid.mainwindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:testgrid"
title="mainwindow" height="350" width="525">
<grid>
<itemscontrol margin="10" x:name="myitemscontrol" itemssource="{binding}">
<itemscontrol.template>
<controltemplate targettype="itemscontrol">
<border borderbrush="aqua" borderthickness="1" cornerradius="15">
<itemspresenter/>
</border>
</controltemplate>
</itemscontrol.template>
<itemscontrol.itemspanel>
<itemspaneltemplate>
<wrappanel/>
</itemspaneltemplate>
</itemscontrol.itemspanel>
<itemscontrol.itemtemplate>
<datatemplate datatype="{ x:type local:datasource}">
<datatemplate.resources>
<style targettype="textblock">
<setter property="fontsize" value="18"/>
<setter property="horizontalalignment" value="center"/>
</style>
</datatemplate.resources>
<grid>
<rectangle fill="green"/>
<ellipse fill="red"/>
<stackpanel>
<textblock margin="3,3,3,0" text="{binding path=priority,mode=twoway}"/>
<textblock margin="3,0,3,7" text="{binding path=taskname,mode=twoway}"/>
</stackpanel>
</grid>
</datatemplate>
</itemscontrol.itemtemplate>
<itemscontrol.itemcontainerstyle>
<style>
<setter property="control.width" value="100"/>
<setter property="control.margin" value="5"/>
<style.triggers>
<trigger property="control.ismouseover" value="true">
<setter property="control.tooltip" value="{binding relativesource={x:static relativesource.self}, path=content.description}"/>
</trigger>
</style.triggers>
</style>
</itemscontrol.itemcontainerstyle>
</itemscontrol>
</grid>
</window>
这里需要注意的地方是 itemssource=”{binding}”这句必须添加，否则后台的数据是无法添加到前台的，这个需要注意，这里贴出后台的代码
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 testgrid
{
/// <summary>
/// mainwindow.xaml 的交互逻辑
/// </summary>
public partial class mainwindow : window
{
private observablecollection<datasource> item = null;
public mainwindow()
{
initializecomponent();
item = new observablecollection<datasource>();
item.add(
new datasource()
{
priority = "1",
taskname = "hello"
}
);
item.add(
new datasource()
{
priority = "2",
taskname = "whats"
}
);
item.add(
new datasource()
{
priority = "3",
taskname = "your"
}
);
item.add(
new datasource()
{
priority = "4",
taskname = "name"
}
);
item.add(
new datasource()
{
priority = "5",
taskname = "can"
}
);
item.add(
new datasource()
{
priority = "6",
taskname = "you"
}
);
this.myitemscontrol.datacontext = item;
}
}
}
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 testgrid
{
/// <summary>
/// mainwindow.xaml 的交互逻辑
/// </summary>
public partial class mainwindow : window
{
private observablecollection<datasource> item = null;
public mainwindow()
{
initializecomponent();
item = new observablecollection<datasource>();
item.add(
new datasource()
{
priority = "1",
taskname = "hello"
}
);
item.add(
new datasource()
{
priority = "2",
taskname = "whats"
}
);
item.add(
new datasource()
{
priority = "3",
taskname = "your"
}
);
item.add(
new datasource()
{
priority = "4",
taskname = "name"
}
);
item.add(
new datasource()
{
priority = "5",
taskname = "can"
}
);
item.add(
new datasource()
{
priority = "6",
taskname = "you"
}
);
this.myitemscontrol.datacontext = item;
}
}
}
这里最重要的一句就是 this.myitemscontrol.datacontext = item;这个是将刚才的集合绑定到itemscontrol控件上，这里需要我们的注意。
第二种
另外一种方式的数据绑定就是将一个类绑定到这个itemscontrol控件上，具体的方式如下：
<window x:class="testgrid.mainwindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:testgrid"
title="mainwindow" height="350" width="525">
<window.resources>
<local:mydata x:key="mydatasource"/>
</window.resources>
<grid>
<itemscontrol margin="10" x:name="myitemscontrol" itemssource="{binding source={staticresource mydatasource}}">
<itemscontrol.template>
<controltemplate targettype="itemscontrol">
<border borderbrush="aqua" borderthickness="1" cornerradius="15">
<itemspresenter/>
</border>
</controltemplate>
</itemscontrol.template>
<itemscontrol.itemspanel>
<itemspaneltemplate>
<wrappanel/>
</itemspaneltemplate>
</itemscontrol.itemspanel>
<itemscontrol.itemtemplate>
<datatemplate datatype="{ x:type local:datasource}">
<datatemplate.resources>
<style targettype="textblock">
<setter property="fontsize" value="18"/>
<setter property="horizontalalignment" value="center"/>
</style>
</datatemplate.resources>
<grid>
<rectangle fill="green"/>
<ellipse fill="red"/>
<stackpanel>
<textblock margin="3,3,3,0" text="{binding path=priority,mode=twoway}"/>
<textblock margin="3,0,3,7" text="{binding path=taskname,mode=twoway}"/>
</stackpanel>
</grid>
</datatemplate>
</itemscontrol.itemtemplate>
<itemscontrol.itemcontainerstyle>
<style>
<setter property="control.width" value="100"/>
<setter property="control.margin" value="5"/>
<style.triggers>
<trigger property="control.ismouseover" value="true">
<setter property="control.tooltip" value="{binding relativesource={x:static relativesource.self}, path=content.description}"/>
</trigger>
</style.triggers>
</style>
</itemscontrol.itemcontainerstyle>
</itemscontrol>
</grid>
</window>
这里我们通过资源来引用一个类，让后使用 itemssource=”{binding source={staticresource mydatasource}}”将这个类绑定到itemssource控件上面，这里贴出相关的代码，我们定义了一个mydata的类，将该类作为数据源绑定到前台上，这个类的代码如下
using system;
using system.collections.generic;
using system.collections.objectmodel;
using system.linq;
using system.text;
using system.threading.tasks;
namespace testgrid
{
public class mydata:observablecollection<datasource>
{
public mydata()
{
add (new datasource()
{
priority = "1",
taskname = "my"
}
);
add(new datasource()
{
priority = "2",
taskname = "name"
}
);
add(new datasource()
{
priority = "3",
taskname = "is"
}
);
add(new datasource()
{
priority = "4",
taskname = "ye"
}
);
add(new datasource()
{
priority = "5",
taskname = "bo"
}
);
}
}
}
这里面很重要的一部就是让这个类继承自 observablecollection<datasource>，然后来添加相应的数据源，我们在使用继承的时候需要注意这些技巧。
其实这两种情况都是将一个数据集合绑定到前台，只不过是一些绑定的方式有所不同，实际的原理都是一样的！
以上就是itemscontrol 数据绑定的两种方式的详细内容，更多关于itemscontrol 数据绑定的资料请关注www.887551.com其它相关文章！
黄山市民网：https://www.huangshanshimin.com/
