【我们一起写框架】MVVM的WPF框架（四）—DataGrid
前言
这个框架写到这里，应该有很多同学发现，框架很多地方的细节，其实是违背了mvvm的设计逻辑的。
没错，它的确是违背了。
但为什么明知道违背设计逻辑，还要这样编写框架呢？
那是因为，我们编写的是框架，是使用mvvm的概念编写框架，而并不是要完美的实现mvvm设计。
两者有什么区别呢？区别就是前者是实战，后者只是个理念。
在实战架构中，并不是ui的东西都一定要放在ui层写，逻辑的东西放在逻辑层写的。因为，架构的目的是让程序员更好的写代码，而不是让代码死死的固定在某一层。
所以，我们在编写框架时，设计模式中该切割的东西，就不要犹豫的切割。因为，架构师是设计模式的使用者，而不是被使用者。
举个例子，当你的逻辑全部提取到某一层中以后，你突然发现，该逻辑执行过程中要弹出提示框，但提示框又是属于ui层的，此时你犹豫了，把提示框移动到逻辑层，不符合设计理念，但不在逻辑层做，开发又很难受。
遇到这样的情况，我们该怎么做呢？
很简单，让设计理念去死吧，不要犹豫，直接把弹出提示框封装到逻辑层中即可。
现实中，设计逻辑永远是要向开发逻辑低头的，因为实战永远高于理论。
框架是什么？
框架就是规则，规则在人类社会被称之为法律；换言之，框架是代码界的法律。
人类社会建立法律之初，是抱着人人守法，秩序稳定的理想的。
可现实是残酷的，总有人，因为各种原因，践踏法律。
事实上，代码界也一样，总是会那不守规矩的程序员触犯法律，他们会让代码跨边界引用类库，或者拒绝使用接口声明对象等等。
为什么不能准守规则呢？
因为他们想更快速的完成任务，所以他们不惜触犯法律，也要拼一次一夜暴富。。。
所以，架构师作为代码界的人民警察，一定要做好惩治工作。。。
因为，当一个坏代码出现后，马上就会有若干个类似的坏代码出现，犹如劣币逐良币一样，时间一长，框架就会被破坏。
接着好代码就得依赖着坏代码写。
当坏代码多了到一定程度，好代码就会变成bug了。。。
所以，任重道远，人民警察还需警惕。。。
为什么要编写数据控件
我们之前编写的数据控件功能相对单一；完全可以用属性和事件代替，所以有些同学会觉得，数据控件好像没什么用。
其实不然，现实中我们要处理的逻辑，并不是简单的对象属性一对一绑定就能处理解决的。
我们需要做很多操作，其中也包括ui操作。而数据控件就是用来应对这种复杂的ui操作的。
因为数据控件通过绑定ui控件后，已经将复杂的ui操作，变成了简单的数据逻辑操作了。
如果没有数据控件，那当我们实现一个控件联动时，就得在xaml.cs文件中处理了。
如果该控件联动还要触发数据变化，那我们就又得从xaml.cs文件中，穿越回viewmodel中处理逻辑了；亦或者，我们直接在xaml.cs文件中处理数据逻辑。
不论哪种模式，都会将我们好容易做的逻辑层与ui层混淆到一起。而这个问题，并不是一个弹出框那么简单的ui越界问题，因为它包含了更多复杂的业务逻辑。
数据控件解决这个烦恼。
我们通过数据控件，实现了控件是控件，数据是数据，清晰的，层次分离；并且通过简洁的绑定，实现了数据变化与控件变化同步。
datagrid数据控件
datagrid数据控件可以说是数据控件的精髓了，因为datagrid相对复杂，不像其他的数据控件那样功能单一。
所以，当然我们学习了datagrid数据控件后，就可以更好的理解，数据控件的意义了。
下面我们先看下datagrid数据控件的代码：
public class datagrid<t> : control<t>
{
private action<t> loadaction = null;
public action<t> selectcallback = null;
private func<object, bool> datafilter = null;
#region 分页
private volatile int _currentpage = 1;
public int currentpage
{
get { return _currentpage; }
set
{
_currentpage = value;
if (_currentpage > pagecount)
{
_currentpage = pagecount;
}
if (_currentpage < 1)
{
_currentpage = 1;
}
onpropertychanged();
}
}
private int _pagecount = 1;
public int pagecount { get { return _pagecount; } set { _pagecount = value; onpropertychanged(); } }
private int _recordcount = 0;
public int recordcount
{
get { return _recordcount; }
set
{
_recordcount = value;
if (_recordcount <= skipnumber)
{
pagecount = 1;
}
else
{
pagecount = int.parse(math.ceiling((double)recordcount / (double)skipnumber).tostring());
}
if (_currentpage > pagecount)
{
_currentpage = pagecount;
}
onpropertychanged();
}
}
private int _skipnumber = 30;
public int skipnumber { get { return _skipnumber; } set { _skipnumber = value; onpropertychanged(); } }
private textbox<string> _jumptextbox = new textbox<string>();
public textbox<string> jumptextbox
{
get { return _jumptextbox; }
set { _jumptextbox = value; onpropertychanged(); }
}
#region 跳页
public basecommand jumpcommand
{
get
{
return new basecommand(jumpcommand_executed);
}
}
void jumpcommand_executed(object send)
{
int pagenum = 0;
if (int.tryparse(jumptextbox.text, out pagenum))
{
if (pagenum <= pagecount && pagenum > 0)
{
currentpage = pagenum;
if (loadaction != null)
{
loadaction(condition);
}
}
else
{
messagebox.show("请正确填写跳转页数。", "提示信息");
}
}
else
{
messagebox.show("请正确填写跳转页数。", "提示信息");
}
}
#endregion
#region 上一页
public basecommand previouscommand
{
get
{
return new basecommand(previouscommand_executed);
}
}
void previouscommand_executed(object send)
{
if (currentpage > 1)
{
currentpage -= 1;
if (loadaction != null)
{
loadaction(condition);
}
}
else
{
messagebox.show("已至首页。", "提示信息");
}
}
#endregion
#region 下一页
public basecommand nextcommand
{
get
{
return new basecommand(nextcommand_executed);
}
}
void nextcommand_executed(object send)
{
if (currentpage < pagecount)
{
currentpage += 1;
if (loadaction != null)
{
loadaction(condition);
}
}
else
{
messagebox.show("已至末页。", "提示信息");
}
}
#endregion
#endregion
private observablecollection<t> _itemssource = new observablecollection<t>();
public observablecollection<t> itemssource
{
get { return _itemssource; }
set
{
_itemssource = value;
if (_itemssource != null && _itemssource.count > 0 && selecteditem == null)
{
selecteditem = _itemssource.first();
}
onpropertychanged();
}
}
public void setitemssource(list<t> itemsource)
{
itemssource = new observablecollection<t>(itemsource);
}
public t _selecteditem;
public t selecteditem
{
get { return _selecteditem; }
set
{
_selecteditem = value;
if (selectcallback != null)
{
selectcallback(_selecteditem);
}
onpropertychanged();
}
}
private icollectionview _itemssourceview;
public icollectionview itemssourceview
{
get
{
_itemssourceview = collectionviewsource.getdefaultview(_itemssource);
return _itemssourceview;
}
set
{
_itemssourceview = value;
onpropertychanged();
}
}
private t _condition = (t)activator.createinstance(typeof(t));
public t condition { get { return _condition; } set { _condition = value; onpropertychanged(); } }
#region 方法
public datagrid()
{
}
public void bindsource(action<t> loadaction, t conditionrow = default(t))
{
loadaction = loadaction;
if (loadaction != null)
{
currentpage = 1;
loadaction(conditionrow);
}
}
public void bindsource(action loadaction)
{
loadaction = new action<t>((obj) => {
loadaction();
}); ;
if (loadaction != null)
{
currentpage = 1;
loadaction(default(t));
}
}
public void itemssourcerebind()
{
bindsource(loadaction);
}
public void selecteditemrebind()
{
t newitem = (t)activator.createinstance(typeof(t));
list<system.reflection.propertyinfo> plist = typeof(t).getproperties().tolist();
foreach (var propertyinfo in plist)
{
propertyinfo.setvalue(newitem, propertyinfo.getvalue(selecteditem));
}
selecteditem = newitem;
}
public void setfilter(func<object, bool> datafilter)
{
try
{
datafilter = datafilter;
_itemssourceview = collectionviewsource.getdefaultview(_itemssource);
_itemssourceview.filter = new predicate<object>(datafilter);
}
catch(exception ex)
{
}
}
public void refresh()
{
if (_itemssourceview == null)
{
_itemssourceview = collectionviewsource.getdefaultview(this.itemssource);
}
_itemssourceview.refresh();
}
#endregion
}
从代码中我们可以看到，datagrid控件不仅包含了基础属性，还包含了上一页，下一页，刷新，甚至过滤的功能。
下面，我们看下一下datagrid控件的基础应用。
xaml页面代码如下：
<datagrid margin="5" fontsize="12" itemssource="{binding testdatagrid.itemssource}" autogeneratecolumns="true"
selecteditem="{binding testdatagrid.selecteditem}" > </datagrid>
viewmodel页面代码如下：
public datagrid<user> testdatagrid { get; set; }
testdataproxy proxy = new testdataproxy();
public vm_pagedatagrid()
{
testdatagrid = new datagrid<user>();
int currentpage = testdatagrid.currentpage;
int skipnumber = testdatagrid.skipnumber;
proxy.gedatagriddata(null, currentpage, skipnumber, (list, count, msg) =>
{
testdatagrid.setitemssource(list);
testdatagrid.recordcount = count;
});
testdatagrid.selectcallback = (user) =>
{
messagebox(user.name);
};
}
我们可以看到，基础的datagrid应用很简单，只要设置好绑定，然后将读取的数据赋值给数据控件的itemsource属性即可。（这里我们使用setitemsource方法为itemsource赋值）
然后我们会发现，只要我们操作数据控件的itemsource，不论是增加数据，删除数据，变更数据，页面都会自动的同步刷新。
datagrid的中级应用
我们在上面的代码中可以看到，datagrid数据控件还包含了分页功能。那么如何实现分页功能呢。
很简单，我们只需要在xaml页面多绑定几个属性即可实现。
xaml代码如下：
<stackpanel datacontext="{binding testdatagrid}" orientation="horizontal" dockpanel.dock="bottom" horizontalalignment="right" margin="0,10,0,0">
<button content="上一页" width="60" command="{binding previouscommand}" height="20" margin="20,0,0,0" verticalalignment="top" />
<button content="下一页" width="60" command="{binding nextcommand}" height="20" margin="20,0,0,0" verticalalignment="top" />
<textblock verticalalignment="center" text="每页" margin="20,0,0,0"></textblock>
<textblock verticalalignment="center" text="{binding skipnumber}" margin="0,0,0,0"></textblock>
<textblock verticalalignment="center" text="条"></textblock>
<textblock verticalalignment="center" text="{binding currentpage}" margin="20,0,0,0"></textblock>
<textblock verticalalignment="center" text="/"></textblock>
<textblock verticalalignment="center" text="{binding pagecount}"></textblock>
<textblock verticalalignment="center" text="总记录数：" margin="20,0,0,0"></textblock>
<textblock verticalalignment="center" text="{binding recordcount}"></textblock>
<textbox verticalalignment="center" width="40" height="20" margin="40,0,0,0" text="{binding jumptextbox.text}" ></textbox>
<button content="go" command="{binding jumpcommand}" width="40" height="20" margin="5,0,0,0" verticalalignment="top" />
</stackpanel>
<groupbox dockpanel.dock="top" header="datagrid" margin="10,0,0,0" >
<datagrid margin="5" fontsize="12" itemssource="{binding testdatagrid.itemssource}" autogeneratecolumns="true"
selecteditem="{binding testdatagrid.selecteditem}" >
</datagrid>
</groupbox>
这样我们就实现了分页功能，代码很简单，并且彻底分割了ui和viewmodel。
但是那么复杂的ui，就这样简单的被彻底搞定了吗？
当然是不可能的！ui很复杂，仅仅靠数据控件是无法彻底搞定的。
那么我们应该怎么办呢?
很简单，我们去编写ui控件就好啦。
当然，我们要编写的ui控件不是普通的ui控件，而是配合数据控件应用的ui控件。
这种定制ui控件在功能上与其他自定义控件是一样，但好处就在于，编写方便，易于理解和二次开发。
----------------------------------------------------------------------------------------------------
本篇文章就先讲到这了，下一篇文章我们将一起为框架编写ui控件。
框架代码已经传到github上了，并且会持续更新。
相关文章：
to be continued——datagrid
github地址：https://github.com/kiba518/kibaframework
----------------------------------------------------------------------------------------------------
注：此文章为原创，欢迎转载，请在文章页面明显位置给出此文链接！
若您觉得这篇文章还不错，请点击下右下角的【推荐】，非常感谢！
上一篇： .NET Core 玩一玩 Ocelot API网关
下一篇： 婚后的男人是弱势群体