При двойном вызове метода items.add два элемента перекрываются на карте. - PullRequest
Новая
       3

При двойном вызове метода items.add два элемента перекрываются на карте.

0 голосов
/ 22 сентября 2011

Вот мой код добавления товара: 

myapp.cards.vehicleInfo.items.add(
       new Ext.List({ ...})
)

Если после этого я сделаю следующее: 

myapp.cards.vehicleInfo.items.add(
        new Ext.Panel(
        {html: 'test' }
        )
    );

Панель с надписью «test» появится в верхней части моего списка (перекрытие), а не вертикально под ним.Я попытался сделать между ними компонент, добавив два элемента.

Есть идеи?Если я выполняю только одно или другое из вышеперечисленного, оно работает как положено, но если я делаю оба вместе, это приводит к описанному выше поведению.

Спасибо

Ответы [ 2 ]

1 голос
/ 10 октября 2011

Вы должны проверить опцию макета в контейнере, к которому вы добавляете панели.У меня была та же проблема на прошлой неделе, и установка свойства макета для layout: {type: 'vbox', align: 'stretch'} предоставила мне хороший макет в один столбец.Я не уверен, если это проблема, но все равно попробуйте :))

1 голос
/ 22 сентября 2011

Вы должны закрепить панель на дне. 

myapp.cards.vehicleInfo.dockedItems.add( new Ext.Panel(
    {html: 'test' }
    )
);

Обновление 

Ext.regModel('Contact', {
    fields: ['firstName', 'lastName']
});

var store1 = new Ext.data.JsonStore({
    model  : 'Contact',
    data: [
        {firstName: 'Tommy',   lastName: 'Maintz'},
        {firstName: 'Rob',     lastName: 'Dougan'},
        {firstName: 'Ed',      lastName: 'Spencer'},
        {firstName: 'Jamie',   lastName: 'Avins'},
        {firstName: 'Aaron',   lastName: 'Conran'},
        {firstName: 'Dave',    lastName: 'Kaneda'},
        {firstName: 'Michael', lastName: 'Mullany'},
        {firstName: 'Abraham', lastName: 'Elias'},
        {firstName: 'Jay',     lastName: 'Robinson'},
        {firstName: 'Tommy',   lastName: 'Maintz'},
        {firstName: 'Rob',     lastName: 'Dougan'},
        {firstName: 'Ed',      lastName: 'Spencer'},
        {firstName: 'Jamie',   lastName: 'Avins'},
        {firstName: 'Aaron',   lastName: 'Conran'},
        {firstName: 'Dave',    lastName: 'Kaneda'},
        {firstName: 'Michael', lastName: 'Mullany'},
        {firstName: 'Abraham', lastName: 'Elias'},
        {firstName: 'Jay',     lastName: 'Robinson'}
    ]
});

new Ext.Application({
    launch: function() {
       var panel =  new Ext.Panel({
            fullscreen: true,
            id:'thePanel',
            layout: 'vbox',
            style: 'background-color:darkblue',
            scroll:'vertical'
        });
//do this in your dynamically called function
    var list = new Ext.List({
        id :'theList',
        itemTpl : '{firstName} {lastName}',
        store: store1,
        width: '100%',
        scroll:false
    });


var smallPanel = new Ext.Panel({layout: 'auto',width:'100%',height:200,style:'background-color:darkgreen;color:white',html:"Hello I'm the panel"});
    panel.items.add(list);
    panel.items.add(smallPanel);
    panel.doLayout();               
    }
});
...