面板占位符上的插入图像无法正确呈现

Question

我在面板的占位符中使用xtype: 'image'添加insert()组件时遇到了这个奇怪的问题：

面板：

{
  xtype: 'panel',
  collapsed: true,
  region: 'east',
  collapsible: true,
  split: true,
  . . . 
  listeners: {
    afterrender: function (panel) {
      if (panel.placeholder) {
        panel.placeholder.insert(1,
          {
            xtype: 'image',
            src: 'myImage.png',
            margin: '10 0'
          }
        );
        panel.placeholder.setTitle('');
      }
    }
  }
}

问题是，我在占位符中添加的图标没有正确显示，左边设置为9px，当它应该是0时：

但是在展开所述面板然后再次折叠之后，图像被正确显示。可能是什么原因？我正确地插入了吗？

注意： Extjs正在使用图像的边距配置来定位元素。但是，图像的left属性设置为9px。我尝试过：margin: '10 0 10 0'甚至margin: '10 5'或margin: '10 5 10 5'但仍然设置了图片left: 9px，这让我觉得L/R边距没有计算在内对于。但是，在设置margin: 10时，会计算L/R页边距。

编辑：根据@ Tejas1991请求，这是一个有效的fiddle供参考。

尝试运行小提琴。你可以注意到，东面板的图像没有正确定位。现在，尝试展开面板，然后再次折叠它。瞧！

Answer 1

好吧，您似乎必须提供图片的width才能将其正确添加到占位符中。

panel.placeholder.insert(1, {
  xtype: 'image',
  src: 'myImage.png',
  margin: '10 0',
  width: 25
});