1、首先做一個容器

1. {  
2.     xtype: 'box', //或者xtype: 'component',  
3.     width: 100, //圖片寬度  
4.     height: 200, //圖片高度  
5.     autoEl: {  
6.         tag: 'img',    //指定為img標籤  
7.         src: 'myphoto.gif'    //指定url路徑  
8.     }  
9. }  

 這樣就在panel或者其他的容器裡面顯示圖片了

2、圖片的動態更新

1. //動態更新只需要獲取到剛才建立的box的dom的src  
2. myphoto.getEl().dom.src = newSrc  

 這樣就實現了顯示與動態更新

方案二：

使用以下擴充套件便可：

1. Ext.form.Myimg = Ext.extend(Ext.BoxComponent, {     
2.     onRender : function(ct, position){     
3.         if(!this.el){     
4.             this.el = document.createElement('img');                 
5.             this.el.src = this.src;     
6.             if(this.forId){     
7.                 this.el.setAttribute('htmlFor', this.forId);     
8.             }     
9.         }     
10.         Ext.form.Label.superclass.onRender.call(this, ct, position);     
11.     }     
12. });    
13. Ext.reg('myimg', Ext.form.Myimg);  

使用：

1. new Ext.form.Myimg  
2. ({  
3.     width : 120,  
4.     height : 100
   ,  
5.     src:'uu.bmp'  
6. }).render(Ext.getBody());  
7. //or  
8. {  
9.      xtype : 'myimg',  
10.      width : 120,  
11.      height : 100,  
12.      src:'uu.bmp'  
13. }  

方案三：

xtype:'textfield',fieldLabel:'圖片', 
width:130,height:114,style:'background-image:url(./1.jpg);background-repeat: no-repeat;',readOnly:true