3

私はSenchatouch2に取り組んでいます。タブパネルがあり、その中に多くのタブが水平に配置されています。タブがもっとあることをユーザーが認識できるように、常に水平スクロールバーを表示したいと思います。これは、tabBar構成のタブパネルです。スクロールバーインジケーターを常に表示するにはどうすればよいですか?:

Ext.define('Project.view.Result', {
extend: 'Ext.tab.Panel',
id:'searchTab',
    tabBar: {

         scrollable:'horizontal',
         scrollBar:'true',
         docked:'top',
         layout: {
                    pack: 'center',
                 },

    },
items:[
                               {  
                        title: 'A Result',
                        xtype:'AList'
                    },
                    { 
                        title: 'B Result',
                        xtype:'BList' 
                    },

                                ......
                                ......
                               { 
                        title: 'Z Result',
                        xtype:'ZList' 
                    }
                ]
        });

私はcssでこれを試しました:

#searchTab .x-scroll-indicator[style] {
opacity: 0.5 !important;
}

ただし、各タブの下のリストアイテムのスクロールバーが表示されます。ただし、タブバーは対象外です。

4

2 に答える 2

8

css を次のように変更するだけでほぼ完了です。

.x-tabpanel .x-scroll-indicator {
    opacity: 0.5 !important;
}

それが役に立てば幸い :)

于 2012-12-20T13:02:09.830 に答える
1

「Touch 2.3.0 の新機能である各インジケーターには、それを制御できる autoHide 構成があります。autoHide を false に設定すると、そのインジケーターが自動的に非表示にならないように指示されます。コンテナーまたはサブクラスのスクロール可能な構成内でインジケーター構成を使用できます。 ."

http://www.sencha.com/blog/top-support-tips-march-2014

Ext.application({
    name: 'Fiddle',

    launch : function() {
        Ext.Viewport.add({
            xtype: 'container',
            html: 'The y scroll indicator will always show, x will hide as autoHide defaults to true',
            scrollable: {
                direction: 'both',
                indicators: {
                    y: {
                        autoHide: false
                    }
                }
            }
        });
    }
});

https://fiddle.sencha.com/#fiddle/1u9

于 2014-04-22T17:37:04.607 に答える