0

通常、アコーディオン パネルは最初の子パネルを展開し、残りのパネルのタイトルは一番下にスタックされます。しかし、私にとっては、下部に表示されるパネルのタイトルはありません。ただ空です。スクリーンショットを参照してください。

ここに画像の説明を入力

しかし、実際には 3 つのフォーム パネルがあります。

Ext.create('Ext.container.Viewport', {
    layout: 'border',
    items: [{
        region: 'center',
        html: '<h3>Some text. Lorem ipsom?</h3>'
    },{
        region: 'east',
        layout: 'accordion',
    width: 300,
    items: [loginForm, regForm, passForm]
    }]
});

どうしてこれなの？どうすればこれを修正できますか?

を使用してExt 4.0.7います。完全なソースはここにあります。

4

2 に答える 2

0

アコーディオン レイアウトでは、loginForm に指定したパネルの高さを指定しないでください。

高さ: 150,

于 2012-10-19T11:52:24.070 に答える
0

これはヘッダーの div 要素が原因です。通常、ビューポートは にレンダリングされdocument.bodyます。既存の要素が見つかった場合、それを置き換えることはできません。むしろ、出力を追加します。ここで起こったことは、2 つのコンポーネント/要素がレンダリングされることです。最初に既存のヘッダー div、次にビューポート。ヘッダー div は、ビューポートの上にスペースをとります。この同じスペースは、下部のビューポートでは見えなくなります。それを解決するには、既存の要素 html をパネルとしてビューポートに配置します。その領域を に保ちますnorth。

Ext.create('Ext.container.Viewport', {
    layout: 'border',
    items: [{
            region: 'north',
            html: header.html // <------- Add html of `div#head` here
            height: 300  // <------- put a height too.

        },{
            region: 'center',
            html: '<h3>Some text. Lorem ipsom?</h3>'
        },{
            region: 'east',
            layout: 'accordion',
            width: 300,
            items: [
                    loginForm, regForm, passForm
            ]
        }]
});
于 2012-10-19T14:33:01.373 に答える