2

そのため、この1週間、どこでも検索してきましたが、2つの「Ext.TabPanel」を一緒にスクロールする方法が見つかりません。

私はこのページを2つのアイテムを持つExt.Panelを持つように作成しています:

var MyBorderPanel = new Ext.Panel({
    layout: 'border',
    renderTo: 'command_display',
    cls: 'auto-width-tab-strip',
    height:800,
    items: [
    {
        region: 'west',
        title: 'item1: <?=ui::getURLField("item1")?>',
        split: true,
        width: 500,
        minSize: 100,
        maxSize: 900,
        layout: 'fit', // specify layout manager for items
        items:   // this TabPanel is wrapped by another Panel
        baseTab
    },
    {
        region: 'center',
        title: 'item2 : <?=ui::getURLField("item2")?>',
        split: true,
        margins: '0 0 0 0',
        layout: 'fit', // specify layout manager for items
        items:            // this TabPanel is wrapped by another Panel
        compareTab
    }
]
});

これらの項目:baseTabとcompareTabは次のように記述されます:

var baseTab = new Ext.TabPanel({
    border: false, // already wrapped so don't add another border
    activeTab: 0, // second tab initially active
    items: [
    <?php
        $uihelper->perform("InitItem1Iteration");
        $comma = true;
        while($uihelper->hasNext("Item1Iteration"))
        {
            $uihelper->next("Item1Iteration");
    ?>      
    <?=(!$comma?",":"")?>
    {
        title: 'some php code',
        id: 'some php code',
        autoScroll: true,
        contentEl: 'some php code',
    }
    <?php 
    $comma = false;
    } ?>
    ]
});

Item2も同様です。

今、基本的に私が欲しいのはです。これらの2つのタブパネルにはスロールバーがあるので、一方のtabPanelをスクロールするたびに、もう一方のタブパネルもそれに沿って自動的にスクロールするようにします。

それも可能ですか?

ありがとうアンディ

4

2 に答える 2

0

簡単な答えは...

関心のある特定のコンテナーのスクローラー項目にアクセスする必要があります。

私は次の行の何かで調査を開始します。

listeners: {
    scroller: {
        scroll: function(scroller, offset) {
            console.log(scroller, offset);
        }
    }
}

コンテナにスクローラーが定義されていることは知っていますが、タブパネルには定義されているとは思いません。したがって、この種のリスナーをすべてのアイテムに追加する必要があります (または、アイテムがイベントをバブルする可能性がありますが、テストされていません)。

(もちろん、スクロール イベントをキャプチャできれば、もう一方のパネルを同じオフセットに設定することは難しくありません)

これが少なくともあなたに進むべき方向性を与えることを願っています.

于 2012-09-12T18:48:56.420 に答える
0

@zelexir で言及されているように、スクローラーを見たいと思っています。これは私のサンプルコードのフィドルですhttp://jsfiddle.net/YgTuc/1/これは2つのパネル用ですが、TabPanelのパネルでも同じように機能するはずです。

于 2012-09-13T14:49:30.060 に答える