標題欄不在Sencha 2.x中顯示列表視圖

Question

我在tabpanel中有列表項。標題欄不顯示在瀏覽列表頁面中。如果任何人有解決方案，請讓我知道。提前致謝。

Main.js

Ext.define('myapp.view.Main', { extend: 'Ext.tab.Panel', xtype: 'main', requires: [ 'Ext.TitleBar', 'Ext.Video', 'myapp.view.Browse' ], config: { tabBarPosition: 'bottom', items: [{ xtype: 'browseView', title: 'Blog', iconCls: 'star' } ] } });

Browse.js

Ext.define('myapp.view.Browse', { extend: "Ext.Container", 
xtype: "browseView", 
id: 'browseView', 
requires: ["Ext.dataview.List", "myapp.view.Header"], 
config: { 
    layout: { 
     type: 'fit' //set containers layout 
    }, 
    items: [{ 
     xtype: "headerview" 
    }, { 
     store: "Browse", 
     xtype: 'list', //add xtype 
     onItemDisclosure: false, 
     itemTpl: [ 
      '<img src="{Image_path}" width="80" height="90" style="float:left; margin-right:10px;" /><h4 style="color:blue;">{Name}</h4><p>{Description}</p><div style="clear: both"></div>' 
     ] 
    }] 
} }); 

Header.js

Ext.define('myapp.view.Header', { 
extend: 'Ext.Panel', 
xtype: "headerview", 
config: { 
    height: '60', 
    layout: { 
     type: 'hbox', 
     align: 'stretch' 
    }, 
    defaults: { 
     flex: '1' 
    }, 
    style: 'text-align:left;width: 100%', 
    items: [{ 
     html: '<div class="header_bg"><img src="img/logo.png" alt="logo"/></div>' 
    }] 
} }); 

Answer 1

注意

1）對於2個項目，您應該使用hbox/vbox，fit適用於單個項目，並且該單一項目需要全尺寸的屏幕。

2）爲browseView中的兩個項目給出高度。

所以你browseView代碼

Ext.define('Rest.view.Browse',{ 
extend: "Ext.Container", 
xtype: "browseView", 
id: 'browseView', 
requires: ["Ext.dataview.List", "Rest.view.Header"], 
config: { 
    items: [{ 
     xtype: "headerview", 
     height : '40%' 
    }, { 
     store: "Browse", 
     height : '60%', 
     xtype: 'list', //add xtype 
     onItemDisclosure: false, 
     itemTpl: [ 
      '<img src="{Image_path}" width="80" height="90" style="float:left; margin-right:10px;" /><h4 style="color:blue;">{Name}</h4><p>{Description}</p><div style="clear: both"></div>' 
     ] 
    }] 
} 
});