ext 怎样做如图效果 希望给我思路

ext 怎样做如图效果 希望给我思路
给我思路就很感动了,希望正解,给代码我就感动死了 ,
双击左边框里的项也会到右边去

可以参考一下MultiSelect的例子~~ this.selectedRoleStore = new Ext.data.JsonStore({                            fields:['roleId','title']});   this.roleStore=new Ext.data.JsonStore({root : 'result',url:__ctxPath+'/system/list_SysRole.action',            fields:['roleId','title'],            listeners:{                scope:this,            'load':function(store,records){                    for(var i=0;i<records.length;i++){                    var re=records[i];                    var index=this.selectedRoleStore.find('roleId',re.data.roleId);                    if(index!=-1){                       store.remove(re);                    }                    }               }            }});this.multSelectFrom=new Ext.ux.Multiselect({legend:'可选角色',height : 200,width:Ext.getCmp('desktoptab').getInnerWidth()/ 3,store :this.roleStore ,displayField : 'title',valueField : 'roleId'});this.multSelectTo=new Ext.ux.Multiselect({name : 'selectedRoles',legend:'已有角色',height : 200,width:Ext.getCmp('desktoptab').getInnerWidth()/ 3,store :this.selectedRoleStore,tbar : [{text : '清除所选',scope:this,handler : function() {this.selectedRoleStore.removeAll();}}],displayField : 'title',valueField : 'roleId'});{              fieldLabel:'角色',              layout:'form',              border:false,              height:230,  items : {xtype : 'panel',height : 220,border:false,defaults:{anchor:'100%',padding:'2 2 2 2'},layout:'fit',items : [{xtype : 'itemselector',name : 'Roles',fromLegend : '',imagePath : __ctxPath + '/ext3/ux/images/',multiselects : [this.multSelectFrom, this.multSelectTo]}]}                        }