extjs中如何显示图片列表
1个回答
展开全部
EXTJS中显示图片方法
userInfoForm.superclass.constructor.call(this, {
bodyStyle: 'padding:10px 10px 10px',
width:250,
region:'west',
closeAction:'true',
title:'个人信息',
buttonAlign:'center',
items:[
{xtype:'panel',
width : 200,
Height : 160,
border:false,
html:'<img src="qing.jpg">'}, 可以显示
{xtype : 'textfield',
fieldLabel : '个人照片',
width : 150,
Height : 180,
inputType : 'image',
fieldLabel :'笑脸豆豆<font color=red>*</font>',
anchor:'97%',
listeners : { // 该项被载入时加载照片
'render' : function(_filed) {
_filed.getEl().dom.src = "qing.jpg";//这里图片的路径可以预先从store中读取,赋给变量然后给它
} //动态显示图片
}
},{
xtype : 'box',
id : 'browseImage',
fieldLabel : "用户头像",
autoEl : {
width : 300,
height : 350,
tag : 'img',
// type : 'image',
src : Ext.BLANK_IMAGE_URL,
style : 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);',
complete : 'off',
id : 'imageBrowse'
}
}
]
});
}
Ext.extend(userInfoForm ,Ext.form.FormPanel,{
});
userInfoForm.superclass.constructor.call(this, {
bodyStyle: 'padding:10px 10px 10px',
width:250,
region:'west',
closeAction:'true',
title:'个人信息',
buttonAlign:'center',
items:[
{xtype:'panel',
width : 200,
Height : 160,
border:false,
html:'<img src="qing.jpg">'}, 可以显示
{xtype : 'textfield',
fieldLabel : '个人照片',
width : 150,
Height : 180,
inputType : 'image',
fieldLabel :'笑脸豆豆<font color=red>*</font>',
anchor:'97%',
listeners : { // 该项被载入时加载照片
'render' : function(_filed) {
_filed.getEl().dom.src = "qing.jpg";//这里图片的路径可以预先从store中读取,赋给变量然后给它
} //动态显示图片
}
},{
xtype : 'box',
id : 'browseImage',
fieldLabel : "用户头像",
autoEl : {
width : 300,
height : 350,
tag : 'img',
// type : 'image',
src : Ext.BLANK_IMAGE_URL,
style : 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);',
complete : 'off',
id : 'imageBrowse'
}
}
]
});
}
Ext.extend(userInfoForm ,Ext.form.FormPanel,{
});
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询