Анимировать (вставить) новую панель, чтобы заменить содержимое текущей панели? - PullRequest
Новая
       0

Анимировать (вставить) новую панель, чтобы заменить содержимое текущей панели?

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

Я пытаюсь изменить содержимое Ext.List. Я пытаюсь изменить содержимое на новую панель, хотя мне не нужно больше элементов списка.

Кажется, это заменяет содержимое, но как мне оживить изменение? 

onItemDisclosure: function(record, btn, index) {
    console.log('Disclose more info for ' + record.get('name'));
    var panel1 = Ext.getCmp('panel-1');
    panel1.remove(Ext.getCmp('panel-1'));
    panel1.add(Ext.getCmp('panel-2'));
    panel1.doLayout();
}

1 Ответ

3 голосов
/ 28 сентября 2011

Лучше всего иметь panel-1 и panel-2 в качестве элементов на другой панели, а затем переключаться между ними.Пример: 

    var detailPanel = new Ext.Panel({
            fullscreen: true,
            id:'detailPanel',
            scroll:'vertical',
            tpl:'<h1>{text}</h1>'
    });

   var list = new Ext.List({
        id :'theList',
        itemTpl : '{firstName} {lastName}',
        store: store1,
        width: '100%',
        scroll:false
    });

   var panel =  new Ext.Panel({
        fullscreen: true,
        id:'thePanel',
        layout: 'card',
        cardSwitchAnimation:'slide',
        scroll:'vertical',
         items:[list, detailPanel]
    });

Затем вы можете обновить элемент detailPanel следующим образом Ext.getCmp('detailPanel').update(record.data); и переключиться на него.Ext.getCmp('thePanel').setActiveItem(1,{type:'slide',direction:'left'});

Вторым аргументом setActiveItem является конфигурация анимации.объект.http://dev.sencha.com/deploy/touch/docs/?class=Ext.Panel

...