[学习笔记]Devexpress在MVC上扩展组件，Navbar与TreeView

这两个都是导航栏，Navbar是只有二级分类的比较美观大方的，TreeView支持多级导航栏，是传统树状的。

官网教程传送门：
https://demos.devexpress.com/MVCxGridViewDemos/Overview

Navbar

组件在局部页面的实现与设置（基本上用着的设置都在这里了）：

<div class="leftPanel">        @* DXCOMMENT: Configure the left panel's menu *@    @Html.DevExpress().NavBar(settings => {    settings.Name = "LeftNavBar";    settings.AllowExpanding = true; //允许点击展开    settings.AllowSelectItem = true; //允许选择Item    settings.AutoCollapse = true;  //当点击、一级时，自动缩小其他一级    settings.SaveStateToCookies = true;  //允许将方案保存本地    settings.EnableAnimation = true;  //允许动画效果    settings.EnableHotTrack = true;  //允许热跟踪，鼠标悬浮产生效果    settings.Width = System.Web.UI.WebControls.Unit.Percentage(100);  //宽度100%    settings.ControlStyle.Border.BorderWidth = System.Web.UI.WebControls.Unit.Pixel(0);    settings.ControlStyle.Paddings.Padding = System.Web.UI.WebControls.Unit.Pixel(0);}).BindToXML(HttpContext.Current.Server.MapPath("~/App_Data/SideMenu.xml"), "/menu/*").GetHtml()</div>

绑定的XML文件格式：

<?xml version="1.0" encoding="utf-8" ?><menu>  <group Text="Platform">    <item Text="Windows" />    <item Text="Linux" />    <item Text="Mac OS" />  </group>  <group Text="SQL Server">    <item Text="SQL Server 2005" />    <item Text="SQL Server 2008" />    <item Text="SQL Server 2008 R2" />  </group>  <group Text="Browser">    <item Text="Chrome" />    <item Text="Firefox" />    <item Text="Internet Explorer" />    <item Text="Safari" />    <item Text="Opera" />  </group>  <group Text="Language">    <item Text="C#" />    <item Text="Visual Basic" />    <item Text="C++" />    <item Text="Java" />    <item Text="PHP" />  </group></menu>

这里，组件支持直接在页面写入导航栏设置，也支持将导航栏设置映射成Model然后载入。具体设置方式，可以看官网教程。

TreeView

树状导航栏的所有设置可以从数据库中动态读取。

这里是具体实现方式，用了Lambda表达式
比较有趣的设置是：SaveStateToCookies （自动将选择方案保存浏览器本地），CheckNodesRecursive （需要实现动态导航栏时，可以实时检查子节点）；

 @Html.DevExpress().TreeView(settings => {    settings.Name = "leftNavBar";    settings.AllowSelectNode = true;  //允许点击选中当前节点    settings.EnableAnimation = true;  //允许展开动画    settings.EnableHotTrack = true;   //允许热追踪，鼠标悬浮效果    settings.SaveStateToCookies = true;  //允许将方案保存本地    settings.ShowTreeLines = true;  //允许展示树状线    settings.ShowExpandButtons = true;  //允许显示展开按钮    settings.AllowCheckNodes = true;  //允许展示Check按钮    settings.CheckNodesRecursive = true;  //允许使用节点检查    settings.Nodes.Add(node_one => {//增加一级节点        node_one.Name = "search";        node_one.Text = "库存查询";        node_one.ToolTip = "库存产品的数量重量各种数据查询";//鼠标悬浮提示信息        node_one.Expanded = false;  //设置节点不自动展开        node_one.TextStyle.BackColor = System.Drawing.Color.FromArgb(Int32.Parse("EE7AE9", System.Globalization.NumberStyles.HexNumber));        //设置节点背景色        node_one.Image.Url = "~/Content/Images/Test.jpg";//设置节点图片        node_one.Image.Width = 10;        node_one.Nodes.Add(node_two => {//增加二级节点            node_two.Text = "测试1";            node_two.Nodes.Add(node_three => {//增加三级节点                node_three.Text = "测试2";            });        });    });    settings.Nodes.Add(node_one_Two => {//增加一级节点        node_one_Two.Nodes.Add(node_two =>        {            node_two.Text = "测试1";            node_two.Nodes.Add(node_three =>            {                node_three.Text = "测试2";            });        });    });}    ).GetHtml()

总之，我觉得我能想到的功能，Devexpress全都有，如果还有其他有趣的功能，欢迎分享一下奥。