extjs - 按钮的背景图片

Question

我正在尝试设置按钮的图像，但它没有覆盖整个按钮。我的意思是，按钮的背景仍然可见。

我试图在运行时通过为循环中的每个按钮提供不同的图像来做到这一点。

这里是：

for(var i=0; i<tvStore.getCount(); i++)
   {
     var aButton = Ext.create('Ext.Button',
     { 
       margin:8,
      id:'button'+i,
      itemId:i,
      style: 'width: 110px;height:110px;background-image:url(someRandomWebURLToImage) !important',

但图像并未覆盖所有按钮。或者如果图像无法拉伸，那么如何使按钮的背景透明？

谢谢，

Answer 1

您可以使用iconCls属性来指定 CSS，如下所示：

{
    xtype           : 'button',
    iconCls         : 'cart',
    text            : 'Add to Cart',
    iconMask        : true,
    padding         : 10,
    margin          : 10,
    id              : 'addToBagBtn'
}

和 CSS 文件应该有：

.x-tab .x-button-icon.cart, .x-button .x-button-icon.x-icon-mask.cart {
    -webkit-mask-image: url('../../touch/resources/themes/images/default/pictos/shop1.png');
}