EXT中显示图片的组件 - [EXT]

var fileUploadPhotoPreview = new Ext.Component({
            id: 'photoPreview',
            xtype: 'textfield',
            //height: 100,
            //width:100,
            autoEl: {
                tag: 'img', src: 'ws_Dell_11_1920x1200.jpg', id: 'photoPreview'
            },
            listeners: { 'render': function() {
                //以下三种表达方式都可以
                //DrawImage(fileUploadPhotoPreview.el.dom, 100, 100);
                //DrawImage(Ext.getCmp("photoPreview").el.dom, 100, 100) ;
                DrawImage(this.el.dom, 100, 100);
            }
            }
        });

另外：
 //显示缩略图
            function DrawImage(ImgD, width_s, height_s) {
                /*var width_s=139;
                var height_s=104;
                */
                var image = new Image();
                image.src = ImgD.src;
                if (image.width > 0 && image.height > 0) {
                    flag = true;
                    if (image.width / image.height >= width_s / height_s) {
                        if (image.width > width_s) {
                            ImgD.width = width_s;
                            ImgD.height = (image.height * width_s) / image.width;
                        } else {
                            ImgD.width = image.width;
                            ImgD.height = image.height;
                        }
                    }
                    else {
                        if (image.height > height_s) {
                            ImgD.height = height_s;
                            ImgD.width = (image.width * height_s) / image.height;
                        } else {
                            ImgD.width = image.width;
                            ImgD.height = image.height;
                        }
                    }
                }
                /*else{
                ImgD.src="";
                ImgD.alt=""
                }*/
            };

注意：可能存在的一个问题，就是默认图片不要太大，否则显示的时候需要提前下载，下载完毕有可能在显示之后，导致显示出来的是原图，不是缩略图