2012-03-21 13 views
7

2 panele:Sencha Touch 2 lista 100% wysokość

Ext.create('Ext.Container', { 
    fullscreen: true, 
    layout: 'hbox', 
    items: [ 
     { 
      xtype: 'panel', 
      html: 'message list', 
      flex: 1, 
      items: [ 
       { 
        xtype: 'list', 
        itemTpl: '{title}', 
        data: [ 
         { title: 'Item 1' }, 
         { title: 'Item 2' }, 
         { title: 'Item 3' }, 
         { title: 'Item 4' } 
        ] 
       } 
      ] 
     }, 
     { 
      xtype: 'panel', 
      html: 'message preview', 
      flex: 3 
     } 
    ] 
}); 

Nie ma atrybut wysokość określona w wykazie pierwszych paneli obiektu, więc to nie jest dostępne dla wyświetlacza. Jak mogę ustawić 100% wysokość w xtype: "lista"?

Odpowiedz

13

Musisz podać listom kontener układ, aby wiedział, aby rozciągnąć swoje dzieci (lista).

layout: 'fit' 

Korzystanie z dopasowania sprawi, że Twój panel sprawi, że wszystkie dzieci (tylko lista w Twoim przypadku) rozciągną się do rozmiaru panelu.

Example of this on Sencha Fiddle.

.

+0

to wszystko. dzięki –

+0

Dokumenty Sencha wspominają o tym ... "Pamiętaj, że jeśli dodasz więcej niż jeden przedmiot do pojemnika z dopasowanym układem, tylko pierwszy element będzie widoczny." –

+0

O co ci chodzi? –