Sencha Touch 2.0 - Как я могу скрыть свой элемент списка?

Question

Имеется список и сегментированная кнопка в элементах моей панели:

[{
    xtype:'segmentedbutton',
    id:'segmented-btn',
    items: [{
        ui:'action',
        text: 'A',
        pressed: true
    },{
        ui:'action',
        text: 'B',
    }]
},{
    xtype: 'list',
    id: 'toList',
    scrollable: false,
    data: [],
    itemTpl: ['<div id="{title}-item">{title}</div>']
},{
    xtype: 'list',
    id: 'fromList',
    ui: 'round',
    data: [],
    itemTpl: ['<div id="{title}-item">{title}</div>']
}]

Когда нажата сегментированная кнопка A, элемент списка «Кому» будет скрыт, а когда моя сегментированная кнопка B будет скрыта, элемент списка «От» будет скрыт, и будет показан элемент списка «Кому».

Answer 1

Если вы используете сегментированную кнопку, вы должны указать hidden: true

. В каком списке вы изначально нуждаетесь, вы не указываете hidden: true и второй список, который вам нужноукажите скрыто: true

[{
    xtype: 'segmentedbutton',
    id: 'segmented-btn',
    items: [{
        ui: 'action',
        text: 'A',
        id: 'Abutton', // i added 
        pressed: true
    }, {
        ui: 'action',
        text: 'B',
        id: 'Bbutton', // i added
    }]
}, {
    xtype: 'list',
    id: 'toList',
    scrollable: false,
    data: [],
    itemTpl: ['<div id="{title}-item">{title}</div>']
}, {
    xtype: 'list',
    id: 'fromList',
    ui: 'round',
    hidden: true, // i added
    data: [],
    itemTpl: ['<div id="{title}-item">{title}</div>']
}]


**Now in Controller Code**

'button[action=Abutton]': {
    tap: 'Abutton',
},
'button[action=Bbutton]': {
    tap: 'Bbutton',
},


// now Action

Abutton: function () //first segment button
{
    Ext.getCmp('fromList').hide();
    Ext.getCmp('toList').show();
},


Bbutton: function () // second segment button
{
    Ext.getCmp('toList').hide();
    Ext.getCmp('fromList').show();
}

Попробуйте, это будет работать

Answer 2

Добавление функции слушателя к сегментированной кнопке

listeners: {
    toggle: function(container, button, pressed){
        if(button.text == 'A'){
            this.down('#fromList').show();
            this.down('#toList').hide();
        } else {
            this.down('#fromList').hide();
            this.down('#toList').show();
        }
    }
}

Должно работать, если функция обработчика не работает.