Extjs4---自己写了个类似web desktop的小程序
我看了Extjs4的web desktop挺好的,就自己写了一个类似的,希望和大家交流一下,希望能给出好的建议
这个1.0版本,没用连接数据库,不断更新中
添加程序的方法:
1、“安装”:把自己的建的view放到app.view中
2、“注册”:在Application中“注册”到桌面快捷方式
app.js:
[javascript]
Ext.Loader.setConfig({enabled:true});
Ext.application({
name:'WD',
appFolder:'app',
launch:function(){
Ext.create('Ext.container.Viewport',{
layout:'border',
items:[{
//桌面
xtype:'center'
},{
//任务栏
xtype:'south'
}
]
});
},
controllers:['Controller']
});
Method.js:用于放controller中公共的方法
[javascript]
Ext.define('WD.controller.Method',{
//打开应用
openApplication:function(name,url){
console.log(name); //程序名称
console.log(url); //打开程序的url
//找到对应程序的view
var view = 'WD.view.'+url.substr(0,1).toUpperCase()+url.substr(1);
console.log(view);
//判断该程序是否已经打开
var newApplication = Ext.getCmp(url);
//如果没有打开,新建一个并显示
if(!newApplication){
render: this.openAddButton(name,url)
Ext.create(view,{}).show();
}else{
//如果已经打开,则直接显示
newApplication.show();
}
/*
if(url == 'myComputer'){
var myComputer = Ext.getCmp('myComputer');
if(!myComputer){
render: this.openAddButton(url,name)
Ext.create('WD.view.MyComputer',{}).show();
}else{
myComputer.show();
}
}else if(url == 'myDocument'){
var myDocument = Ext.getCmp('myDocument');
if(!myDocument){
render: this.openAddButton(url,name)
Ext.create('WD.view.MyDocument',{}).show();
}else{
myDocument.show();
}
}
*/
},
//打开程序时添加状态栏按钮
openAddButton:function(name,url){
Ext.getCmp("south").add([{
xtype:'button',
id:url+"Button",
text:name,
handler:function(){
Ext.getCmp(url).show();
}
}]);
}
});
Controller.js
[javascript] view plaincopy
Ext.define('WD.controller.Controller',{
extend:'Ext.app.Controller',
views:['Center','South'],
models:[],
stores:['ApplicationStore','BookStore'],
init:function(){
var method = Ext.create('WD.controller.Method');
this.control({
//桌面监听事件
'center':{
&
补充:web前端 , JavaScript ,