Extjs desktop startmenu (Start menu)
The level-2 menu of the Start Menu of extjs desktop is just a simple demonstration of the implementation principle. If you need to dynamically generate the menu, you can modify it yourself. The basic principles are as follows:
First, create a js file to generate the Start Menu data:
? Function GetStartMenu (app) {var menuArray = []; var m = {launcher: {text: 'start menu level 1 A', iconCls: 'icon-grie', handler: function () {return false ;}, menu: {minWidth: 127, items: [] }}; m. launcher. menu. items. push ({winId: 'menua01', winUrl: 'abc/abcd.html ', text: 'start menu level 2 a01', maximized: false, iconCls: 'icon-grid ', scope: this, handler: function (src) {var desktop = app. getDesktop (); var win = Desktop. getWindow ('menua01'); if (! Win) {win = desktop. createWindow ({border: false, id: 'menua01', title: 'start menu level 2 a01', width: 600, height: 500, maximized: true, maximizable: true, resizable: true, iconCls: 'icon-grie', hideMode: 'offsets', constrain: true, layout: 'fit ', loader: {url: 'abc/abcd.html ', autoLoad: true, scripts: true});} win. show (); return win ;}}); m. launcher. menu. items. push ({winId: 'menua02', winUrl: 'abc/B Bbb.html ', text: 'start menu level 2 a02', maximized: false, iconCls: 'icon-grid', scope: this, handler: function (src) {var desktop = app. getDesktop (); var win = desktop. getWindow ('menua02'); if (! Win) {win = desktop. createWindow ({border: false, id: 'menua02', title: 'start menu level 2 a02', width: 800, height: 600, maximized: false, maximizable: true, resizable: false, iconCls: 'icon-grie', hideMode: 'offsets', constrain: true, layout: 'fit ', loader: {url: 'abc/bbbb.html ', autoLoad: true, scripts: true});} win. show (); return win ;}}); menuArray. push (m); return menuArray ;}
Introduce the file on the home page, modify app. js, find getModules: function () {and change the content:
GetModules: function (){
Return GetStartMenu (this );
},
You can implement the level-2 menu of the Start Menu.