스크롤되지 않는 목록

두 개의 항목이있는 패널 (레이아웃 : 'vbox')이 있습니다. 패널 및 목록스크롤되지 않는 목록

나는 많은 것들을 시도했지만 아무 일하지

this.currentFolderPnl = new Ext.Panel({ 
    cls:'document-current-folder-panel', 
    html:'/' 
}); 

this.list = new Ext.List({ 
    scroll: 'vertical', 
    cls:'document-list', 
    id: 'document-list', 
    store: app.stores.Document, 
    itemTpl: app.templates.document 
}); 

app.views.DocumentList.superclass.constructor.call(this, { 
    selectedCls : "x-item-selected", 
    dockedItems: [{ 
     xtype: 'toolbar', 
     ui:'dark', 
     title: 'Documents', 
     items:[this.backBtn,{xtype:'spacer'},this.newBtn] 
    }], 
    layout: {type:'vbox',align:'stretch'}, 
    items: [ 
     this.currentFolderPnl, 
     this.list 
    ] 
});

코드입니다. 누군가가 무엇을해야하는지 말해 줄 수 있겠습니까? 자식 요소가 부모 구성 요소보다 크기 (하나의 높이 또는 폭 또는 둘 모두)가 큰 상태에서

감사

출처

2012-03-23 Titouan de Bailleul

스크롤 만 나타날 수있다. vbox 레이아웃을 사용 중이므로 각 구성 요소의 높이가 필요합니다. 따라서 목록 스크롤은 패널 안에 들어갈 때 올 것입니다. 귀하의 경우에 지금

두 가지 옵션이 될 수 있습니다

옵션 1 :

당신은 (여전히 제공하지 않았다) 첫 번째 패널에 높이를 제공하고 다른 패널을 추가 할 수 있습니다

그 후에 세부 사항을 가진 :

{ 
    flex : 1, 
    layout : 'fit', 
    items : [this.list] 
}

이것은 두번째위원회 내의 명부를 적합 하 스크롤은 자동적으로 올 것이다.

옵션 2 : 여기

당신은 기본 레이아웃 (AutoContainerLayout) 즉, 어떤 레이아웃을 제공하지를 사용합니다. 위의 조합이 효과적 일 수 있습니다 (첫 번째 패널의 높이를 더 높이십시오). 목록에서 스크롤을 제거하고 수직 스크롤을 메인 패널에 추가하십시오. 이 방법은 :

this.currentFolderPnl = new Ext.Panel({ 
    ... 
    height : 50 
}); 

this.list = new Ext.List({ 
    scroll: FALSE, 
    .... 
}); 

app.views.DocumentList.superclass.constructor.call(this, {   
    scroll : 'vertical', 
    ... 
});

위 옵션을 테스트하지는 않았지만 정상적으로 작동합니다.

출처

2012-03-24 07:31:47 Swar

스크롤되지 않는 목록

답변

관련 문제