ExtJS：面板中的矩形容器不可見

Question

我想用包含矩形的Ext.Container替換後面板中的html div。 HTML解決方案位於註釋括號內，工作正常，但容器替代方法不可見。螢火蟲沒有顯示錯誤。 {{var}}被解析並且沒有問題。 var任務後來被添加到另一個帶有hbox佈局的面板。不介意高度等不同於這兩種解決方案。首先，我只想讓任何矩形可見。

var bar = Ext.create('Ext.Container', { 
    width: 20, 
    height: 20, 
    items: { 
     xtype: 'draw', 
     sprites: [{ 
      type: 'rect', 
      x: 0, 
      y: 0, 
      width: 20, 
      height: 20, 
      fillStyle: 'blue' 
     }] 
    } 
}); 

var task = Ext.create('Ext.Panel', { 
    border: true, 
    height: '100%', 
    title: '{{name}}', 
    titleCollapse: true, 
    width: 70, 
    listeners: { 
     render: function() { 
      this.getEl().dom.title = '{{name}}. Start: {{start}}. End: {{end}}'; 
     } 
    }, 
    items: [bar] 
    /* html: '<div class="bar" style="margin-top: {{top}}px; height: {{height}}px"></div>'*/ 
}); 

謝謝！

Answer 1

除了繪製成容器的，我用它的樣式屬性：

style: {backgroundColor: '#1d5b94'}