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 回答