面板内的面板:autoScroll无法正常工作

时间:2012-06-27 11:32:37

标签: extjs view scroll extjs4 scrollbar

我有这个视图(DetailsContainer,这个问题的代码部分的第一个类),里面有两个项目(MetaDataPanel,Preview),但是自动滚动在MetaDataPanel中不起作用(按照代码)。 所以当我在MetaDataPanel中放入一些项目时,autoscroll不起作用...... PS:MetaDataPanel的内容是通过dinamically生成添加到此Panel的元素... 有什么建议吗?

Ext.define('DP.view.DetailsContainer' ,{ 
id: 'DetailsContainer',
extend: 'Ext.Panel',
alias : 'widget.DetailsContainer',
collapsible: true,
// margins:'5 0 5 5',
split:true,
layout: {
    type: 'accordion',
    align: 'stretch',
    pack  : 'start'
},

initComponent: function() {


    Ext.apply(this, {

        items: [{
            xtype: 'MetaDataPanel',
            flex:1
        },{
            xtype: 'Preview',
            flex:2     
        }]
    });

    this.callParent(arguments);
}
});


Ext.define('DP.view.MetaDataPanel' ,{
id: 'MetaDataPanel',
extend: 'Ext.Panel',
alias : 'widget.MetaDataPanel',
title : 'MetaDati', 
layout: 'fit',
autoScroll:true, //TODO: autoscroll not working
initComponent: function() {
    Ext.apply(this, {
        items: [{
            xtype: 'component' ,
            html: 'Nessun File o Cartella selezionata. Selezionare un elemento per visualizzare i metadati!',
            margin: 5,
            style: {
                color: '#000000'
            }
        }]
    });
    this.callParent(arguments);
}
});

3 个答案:

答案 0 :(得分:7)

在具有适合布局的容器上指定autoScroll是没有意义的。孩子总是适合容器的大小,它永远不会更大,所以你永远不能滚动。你想在内部组件上使用autoScroll。

答案 1 :(得分:3)

我不认为手风琴面板滚动是有意义的。你应该做的是将内部组件设置为滚动。看看你的代码略有改变,以反映这个想法: http://jsfiddle.net/dbrin/jmHEj/

答案 2 :(得分:1)

最容易/懒惰的是将config autoScroll设置为默认值 - 因此它将被继承:

defaults: {autoScroll: true},