javascript - 带有手风琴布局的固定搜索栏 - EXT JS4

Question

我需要在我的菜单栏顶部有一个固定的搜索栏。这是我到目前为止所拥有的：

Ext.define('Cam.view.menu.LeftSidebar', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.leftsidebar',
    views: 'Cam.view.menu.Search',
    defaults: {
        // applied to each contained panel
        bodyStyle: 'padding:0px;'
    },
    layout: {
        // layout-specific configs go here
        type: 'accordion',
        titleCollapse: true,
        animate: true,
        activeOnTop: true
    },
    title: _SIDEBAR_LEFT_TITLE,
    items: [
    {
        title: 'Menu Search',
        items: [{xtype: 'menusearch'
                }]
    },
    {
        title: _SIDEBAR_LEFT_PREVIOUS,
        xtype: 'menuhistory',
        itemId: 'menuhistory'
    },
    {
        title: 'Menu',
        items: [{xtype: 'screenmenu'}]
    }]
});

到目前为止，它按我想要的方式折叠，但 xtype:'menusearch' 是我想要固定在顶部的。和 xtype:'menuhistory' 是活跃的。

对此有什么帮助吗？

Answer 1

你可以这样做：

Ext.require('*');

Ext.onReady(function() {

    Ext.create('Ext.panel.Panel', {
        width: 400,
        height: 400,
        renderTo: document.body,
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        items: [{
            xtype: 'textfield',
            fieldLabel: 'Search'
        }, {
            flex: 1,
            xtype: 'container',
            layout: 'accordion',
            items: [{
                title: 'Item 1',
                html: 'I1'
            }, {
                title: 'Item 2',
                html: 'I2'
            }, {
                title: 'Item 3',
                html: 'I3'
            }]
        }]
    });

});