Hi Expert,
I created a very simple app to test a native Android app with Sencha Touch. I have two panels. When a button is tapped in the first panel, the second panel must open. In my browser it works great, but when I create a native Android application, only the initial view is displayed. When I tap the button the second view is not displayed.
This is my code:
Ext.application({
views: [
'MyPanel',
'MyPanel1'
],
controllers: [
'MyController1'
],
name: 'MyApp',
launch: function() {
Ext.create('MyApp.view.MyPanel', {fullscreen: true});
} });
Ext.define('MyApp.view.MyPanel', {
extend: 'Ext.Panel',
alias: 'widget.mypanel',
config: {
items: [
{
xtype: 'button',
itemId: 'mybutton',
text: 'V1'
}
],
listeners: [
{
fn: 'onMybuttonTap',
event: 'tap',
delegate: '#mybutton'
}
]
},
onMybuttonTap: function(button, e, eOpts) {
this.fireEvent('getPan1');
}
});
Ext.define('MyApp.view.MyPanel1', {
extend: 'Ext.Panel',
alias: 'widget.mypanel1',
config: {
items: [
{
xtype: 'button',
itemId: 'mybutton1',
text: 'V2'
}
],
listeners: [
{
fn: 'onMybutton1Tap',
event: 'tap',
delegate: '#mybutton1'
}
]
},
onMybutton1Tap: function(button, e, eOpts) {
this.fireEvent('getPan');
}
});
Ext.define('MyApp.controller.override.MyController1', {
override: 'MyApp.controller.MyController1',
config: {
refs: {
myView: 'mypanel',
myView2: 'mypanel1'
},
control: {
myView: {
getPan1: 'getPan1'
},
myView2: {
getPan: 'getPan'
}
}
},
getPan1: function(){
var a = Ext.create('MyApp.view.MyPanel1', {fullscreen: true});
a.show();
},
getPan: function(){
var a = Ext.create('MyApp.view.MyPanel', {fullscreen: true});
a.show();
}
});
It seems to me that in the native app the event is not captured in the controller. What am I doing wrong?
Please help!
Thanks in advance.
AVADHESH PATEL
03-Jun-2013Ext.application({views: [
'MyPanel',
'MyPanel1'
],
controllers: [
'MyController1'
],
name: 'MyApp',
launch: function() {
console.log("appstart");
Ext.create('MyApp.view.MyPanel', {fullscreen: true});
}
});
Ext.define('MyApp.controller.override.MyController1', {override: 'MyApp.controller.MyController1',
config : {
refs : {
mybutton : 'mypanel button[text="V1"]'
},
control : {
mybutton : {
tap : 'tappedButtonFunction'
}
}
},
tappedButtonFunction : function(){
console.log("Tapped");
Ext.Msg.alert("Test");
// Do something
}
});
Ext.define('MyApp.view.MyPanel', {extend: 'Ext.Panel',
alias: 'widget.mypanel',
requires: [
'Ext.MessageBox'
],
config: {
id: 'PanelID',
items: [
{
xtype: 'button',
id: 'mybutton',
text: 'V1'
}
]
}
});