Coolite Toolkit学习笔记五：常用控件Menu和MenuPanel.doc

Coolite Toolkit学习笔记五：常用控件Menu和MenuPanelCoolite Toolkit里的Menu控件和其他的.NET Web控件不一样，如果只是设计好了Menu或是通过程序初始化菜单项，菜单是不会呈现在界面上的，因为Coolite Toolkit规定Menu控件需要一个容器来做依托，而这个让Menu依托的控件就是MenuPanel，下面拖拽出的MenuPanel控件所生成的html编码： Code从上面可以明显的看出，MenuPanel里可以放置菜单项(MenuItem)，如果有子菜单，那么子菜单则对应于一个Menu控件，子菜单里的菜单项则又是通过菜单项(MenuItem)来体现。如下是我修改后的一个菜单html编码： functiononItemClick(menuItem)Ext.Msg.alert(操作提示,当前点击项内容：+menuItem.text);像Tree、Menu等类似的控件，我个人认为主要就是弄清楚他们内部的层次结构，不管是通过界面设计还是通过直接Code创建他们，最终得到的结果都是一样，如上菜单显示效果，同样可以通过如下程序代码来创建：protectedvoidPage_Load(objectsender,EventArgse)if(!IsPostBack)CreateMenuPanel();privatevoidCreateMenuPanel()MenuPanelmenuPanel=newMenuPanel();menuPanel.Title=帐套管理;menuPanel.Width=newUnit(180);Coolite.Ext.Web.MenuItemaddAccount=newCoolite.Ext.Web.MenuItem(新增帐套);addAccount.Icon=Icon.Add;addAccount.Listeners.Click.Handler=JavaScript:window.location.href=#;Coolite.Ext.Web.MenuItemwhAccount=newCoolite.Ext.Web.MenuItem(维护帐套);whAccount.Icon=Icon.Cmy;Coolite.Ext.Web.MenuItemaccountManage=newCoolite.Ext.Web.MenuItem(帐套管理);accountManage.Icon=Icon.Database;Coolite.Ext.Web.MenusubMenu=newCoolite.Ext.Web.Menu();Coolite.Ext.Web.MenuItembackMenuItem=newCoolite.Ext.Web.MenuItem(备份帐套);backMenuItem.Icon=Icon.DatabaseSave;backMenuItem.Listeners.Click.Handler=JavaScript:window.open(#);subMenu.Items.Add(backMenuItem);Coolite.Ext.Web.MenuItemreMenuItem=newCoolite.Ext.Web.MenuItem(恢复帐套);reMenuItem.Icon=Icon.DatabaseGo;reMenuItem.Listeners.Click.Handler=JavaScript:window.open(#);subMenu.Items.Add(reMenuItem);accountManage.Menu.Add(subMenu);menuPanel.Menu.Items.Add(addAccount);menuPanel.Menu.Items.Add(whAccount);menuPanel.Menu.Items.Add(accountManage)