I am attempting to do something which (at least I believe) should be very straightforward in ST2 but it is not working. I have a main view (xtype: navigationview
) and a secondary view (xtype: container
). There is a button in the navigationbar on the main view that should be hidden when navigating to the secondary view and shown when returning to the main view. I have added the code to mark the setHidden(true)
in the main view config listeners but neither of the events fire.
Is there maybe a better way of doing this?
Main view:
Ext.define('MyApp.view.Main', {
extend: 'Ext.navigation.View',
xtype: 'main',
requires: [
'Ext.dataview.List'
],
config: {
navigationBar: {
items: [
{
xtype: 'button',
iconCls: 'refresh',
iconMask: true,
itemId: 'refreshBtn',
align: 'left'
}
]
},
items: [
{
xtype: 'button',
itemId: 'next-page-button',
text: 'Next Page'
}
],
listeners: {
activate: function() {
this.query('[itemId=refrehBtn]')[0].setHidden(false);
},
deactivate: function() {
this.query('[itemId=refrehBtn]')[0].setHidden(true);
}
}
},
initialize: function() {
this.callParent();
}
});
Sencondary view:
Ext.define('MyApp.view.Main2', {
extend: 'Ext.Container',
xtype: 'main2',
config: {
items: [
{
xtype: 'panel',
items: [
{
xtype: 'panel',
html: 'second view'
},
]
}
]
}
});
Controller:
Ext.define('MyApp.controller.TestController', {
extend: 'Ext.app.Controller',
config: {
refs: {
nextPgBtn: '[itemId=next-page-button]'
},
control: {
nextPgBtn: {
tap: 'showNextPg'
}
}
},
showNextPg: function(btn, e, opts) {
btn.up('navigationview').push({
xtype: 'main2'
});
}
});