当前位置:编程学习 > JS >>

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 ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,