欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

【我们一起写框架】MVVM的WPF框架(四)—DataGrid

程序员文章站 2022-11-05 12:01:15
前言 这个框架写到这里,应该有很多同学发现,框架很多地方的细节,其实是违背了MVVM的设计逻辑的。 没错,它的确是违背了。 但为什么明知道违背设计逻辑,还要这样编写框架呢? 那是因为,我们编写的是框架,是使用MVVM的概念编写框架,而并不是要完美的实现MVVM设计。 两者有什么区别呢?区别就是前者是 ......

前言

这个框架写到这里,应该有很多同学发现,框架很多地方的细节,其实是违背了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上了,并且会持续更新。

相关文章:

【我们一起写框架】mvvm的wpf框架(一)—序篇

【我们一起写框架】mvvm的wpf框架(二)—绑定

【我们一起写框架】mvvm的wpf框架(三)—数据控件

to be continued——datagrid

github地址:https://github.com/kiba518/kibaframework

----------------------------------------------------------------------------------------------------

注:此文章为原创,欢迎转载,请在文章页面明显位置给出此文链接!
若您觉得这篇文章还不错,请点击下右下角的推荐】,非常感谢!