0

こんにちは、フィルタ パネルを表示しようとしていますが、うまくいきません。window.js を layout: 'border' に設定しようとしましたが、成功せずに @ sencha でいくつかの例を見つけましたが、sencha レイアウトに失敗しました

私のwindow.js

Ext.define('Shopware.apps.UnSqlReader.view.window.Window', {
extend: 'Enlight.app.Window',
alias: 'widget.main-window-view',
height: '90%',
width: '90%',
layout: 'fit',
title: '{s name=window_title}SQL Reader{/s}',
minimizable: true,
maximizable: true,
menuDisabled: true,
enableCtxMenu: false,
initComponent: function() {
    var me = this;
    me.items = me.getItems();
    me.callParent(arguments);
},
getItems: function() {
    var me = this;
    me.filterGrid = Ext.create('Ext.grid.Panel', {
        height: '90%',
        width: '90%',
        autoScroll: true,
        hidden: true,
        cls: 'enable-scroll-bar',
        layout: 'border',
        split: true,
        overflowX: 'scroll',
        overflowY: 'scroll',
        items: [
        Ext.create('Shopware.apps.UnSqlReader.view.filter.Filter', {
            region: 'west'
        })],
        columns: [],
    });
    return [me.filterGrid, me.grid];
},

私のfilter.js

Ext.define('Shopware.apps.UnSqlReader.view.filter.Filter', {
extend: 'Ext.form.Panel',
title: 'Filter',
collapsible: true,
width: 300,
layout: 'anchor',
region: 'west',
initComponent: function() {
    var me = this;
    console.log('Filter Loaded');
    me.items = [
    me.createFilterButton(),
    me.createResetButton()],
    me.callParent();
},
createFilterButton: function() {
    var me = this;
    me.filterButton = Ext.create('Ext.button.Button', {
        cls: 'secondary small',
        width: 130,
        iconCls: 'sprite-funnel',
        text: 'Set Filter',
        handler: function() {

        }
    });
    return me.filterButton;
},
createResetButton: function() {
    var me = this;
    me.resetButton = Ext.create('Ext.button.Button', {
        cls: 'secondary small',
        width: 130,
        iconCls: 'sprite-funnel--minus',
        text: 'Reset Filter',
        handler: function() {}
    });
    return me.resetButton;
}

グリッドビュー

4

2 に答える 2

3

Border レイアウトを使用するすべてのコンテナには、region:'center' を持つ子アイテムが必要です。中央領域の子項目は、レイアウト内の他の領域によって使用されていない残りのスペースを埋めるために常にサイズ変更されます。

http://docs.sencha.com/extjs/4.1.1/#!/api/Ext.layout.container.Border

于 2015-09-21T14:31:44.853 に答える
1

パネルを既存の単一ページ アプリケーションの上に表示するのに問題がありました。ポップアップ ダイアログのコンテナとしてExt.window.Windowを使用することが、まさに私が求めていたものであることがわかりました。それはうまく表示されました：

Ext.create('Ext.window.Window', {
    title: 'Hello',
    height: 200,
    width: 400,
    layout: 'fit',
    items: {  // Let's put an empty grid in just to illustrate fit layout
        xtype: 'grid',
        border: false,
        columns: [{header: 'World'}],                 // One header just for show. There's no data,
        store: Ext.create('Ext.data.ArrayStore', {}) // A dummy empty data store
    }
}).show();
于 2016-01-05T21:46:12.703 に答える