您的位置:首页 > Web前端 > JavaScript

extjs desktop startmenu (开始菜单)

2015-03-16 16:39 183 查看
extjs desktop 的开始菜单 二级菜单,只是简单演示实现原理,如 需要动态生成,自己改造即可,以下基本方法原理:

首先 建立一个js文件 生成开始菜单数据:



function GetStartMenu(app) {
var menuArray = [];

var m = {
launcher: {
text: '开始菜单第一级A',
iconCls: 'icon-grid',
handler: function() {
return false;
},
menu: {
minWidth: 127,
items: []
}
}
};

m.launcher.menu.items.push({
winId: 'menua01',
winUrl: 'abc/abcd.html',
text: '开始菜单第二级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: '开始菜单第二级A01',
width: 600,
height: 500,
maximized: true,
maximizable: true,
resizable: true,
iconCls: 'icon-grid',
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/bbbb.html',
text: '开始菜单第二级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: '开始菜单第二级A02',
width: 800,
height: 600,
maximized: false,
maximizable: true,
resizable: false,
iconCls: 'icon-grid',
hideMode: 'offsets',
constrain: true,
layout: 'fit',
loader: {
url: 'abc/bbbb.html',
autoLoad: true,
scripts: true
}
});
}
win.show();
return win;
}
});

menuArray.push(m);

return menuArray;
}
在主页面引入该文件 然后修改app.js,找到 getModules: function () {  删除里面内容 改为:
   getModules: function () {
           return GetStartMenu(this);
    },

即可实现开始菜单的二级菜单
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息