1

我们知道 ExtJS4 是新的,即使它很小,我们也会遇到一些问题,但我们需要找到解决方案来完成升级。我们正在尝试对图像组件应用填充,但它不起作用。

ExtJS4 代码为:

Ext.onReady(function(){
            Ext.QuickTips.init()        
            var image = {
            xtype : 'image',
            src : 'images.jpg',
            height : 40,
            width : 150,
            border : true,
            style : 'padding-left:60px',
            resizable : false   
            };      
            var pan = Ext.create('Ext.panel.Panel',{
            width : 400,
            height : 400,
            id : 'expan',
            border : true,
            title : 'Ex Panel',
            items : [image],
            renderTo : Ext.Body()
            });
        });

如果我们删除填充,则图像如下所示:

在此处输入图像描述

但是如果我们应用填充,那么图像大小会减小,它看起来像:

在此处输入图像描述

1.为什么会这样?
2.有什么办法可以将此图像移动到面板的中心?

如果有人知道摆脱这种情况的路径。请帮助我。

4

2 回答 2

1

好的开始我猜你正在使用一些用户扩展的组件图像,因为我似乎找不到那个 xtype,但问题是填充直接应用于该组件,所以组件仍然有 150 宽度有或没有填充,

我建议您将组件放入所需大小的面板中,然后将填充添加到该面板中。之后将新创建的面板添加到所需的面板,它会创建更多的组件,但它会给你想要的外观

 {
                xtype:'panel',
                style : 'padding-left:60px',
                width: 210,
                items:[image]
}

这对我有用。

于 2011-08-05T08:04:44.270 回答
0

据我所知,这在 ExtJS 4.1 中也不起作用。对我有用的一种解决方案是使用填充配置属性:

{
xtype : 'image',
src : 'resources/images/Logo.png',
padding : '15px 5px 15px 15px'
}

很想听听任何有更好解决方案的人的意见。

于 2012-12-05T17:25:38.487 回答