I trying to build an application using Sencha Touch 2.4.1,
and using cordova packager.
My simple application show chart, when i use
"start sencha web start" application for browsing.
(picture 1).
But when i pack the app to android apk,
on my android phone, it doesn't show the chart,
only starting animation..
(picture 2)
However if i remove line with xtype: 'companystockchart',
my application (on phone) is working (of course without chart)!
What am i doing wrong?
Source code:
app.js:
Ext.require([
]);
Ext.application({
name: 'app',
views: ['CompanyStockChart'],
launch: function() {
Ext.create('Ext.Panel', {
fullscreen: true,
layout: 'fit',
title: 'Chart',
iconCls: 'overview',
items:[{
xtype: 'companystockchart'
}],
listeners: {
activate: function() {
}
}
})
}
});
app.view.CompanyStockChart.js:
Ext.define('app.view.CompanyStockChart', {
extend: 'Ext.chart.Chart',
alias: 'widget.companystockchart',
config: {
store: {
fields: ['name', 'value'],
data: [
{ name: 'Jan', value: 110},
{ name: 'Feb', value: 252},
{ name: 'Mar', value: 952},
{ name: 'Apr', value: 325},
{ name: 'May', value: 123},
{ name: 'Jun', value: 52},
{ name: 'Jul', value: 1122},
{ name: 'Aug', value: 35},
{ name: 'Sep', value: 172},
{ name: 'Oct', value: 752},
{ name: 'Nov', value: 810},
{ name: 'Dec', value: 410}
]
},
animate: false,
interactions: ['panzoom'],
series: [
{
type: 'line',
xField: 'name',
yField: 'value',
style: {
fill: 'rgba(0,40,170,0.3)',
stroke: 'black'
}
}
],
axes: [
{
type: 'numeric',
position: 'left',
title: 'Number of Hits',
minimum: 0,
maximum: 1200,
grid: {
fill: '#efefef',
odd: {
fill: '#cdcdcd'
},
even: {
lineWidth: 3
}
}
},
{
type: 'category',
position: 'bottom',
title: 'Month of the Year',
grid: true,
style: {
estStepSize: 1
}
}
]
}
});
Next i try to debug the app, and i see next issue:
(picture 3)
Related
I have developed a bot that has an invite card when the user did not add the bot yet, it will return the following JSON to render the AdaptiveCard:
{
body: [
{
text: translations['MsTeams::AdaptiveCardBodyLooksLikeTryToUseApp'],
wrap: true,
type: 'TextBlock',
},
{
text: translations['MsTeams::AdaptiveCardBodyNeedToInviteApp'],
wrap: true,
type: 'TextBlock',
},
],
actions: [
{
data: {
actionId: 'INSTALL_BOT_SUBMIT',
cancel: true,
},
title: translations['MsTeams::Cancel'],
type: 'Action.Submit',
},
{
data: {
msteams: {
justInTimeInstall: true,
},
actionId: 'INSTALL_BOT_SUBMIT',
},
title: translations['MsTeams::Invite'],
type: 'Action.Submit',
},
],
type: 'AdaptiveCard',
version: '1.0',
}
And it's working fine on desktop, browser, and iOS devices, but not working on Android devices.
Here is the device & app info:
Android device version: 8.0.0
MS teams app version: 1416/1.0.0.2021010802
This is just an idea, but I see lots of hanging commas (e.g. type: 'TextBlock',). It might be that the Android parser is stricter on this - try remove them and test again.
It's about the react-native-payments from Naoufal
I follow the simple tutorial, all is good, installation, setting, and so on.
When I called paymentRequest.show(). I have the warning
Possible Unhandled Promise Rejection(id:0)
I've already write a message to the developer, maybe the issue is in its side, I don't know.
Here is the simple code:
const METHOD_DATA = [{
supportedMethods: ['android-pay'],
data: {
supportedNetworks: ['visa', 'mastercard', 'amex'],
currencyCode: 'USD',
environment: 'TEST', // defaults to production
paymentMethodTokenizationParameters: {
tokenizationType: 'NETWORK_TOKEN',
parameters: {
publicKey: 'your-public-key'
}
}
}
}];
const DETAILS = {
id: 'basic-example',
displayItems: [
{
label: 'Movie Ticket',
amount: { currency: 'USD', value: '15.00' }
}
],
total: {
label: 'Merchant Name',
amount: { currency: 'USD', value: '15.00' }
}
};
const paymentRequest = new PaymentRequest(METHOD_DATA, DETAILS);
paymentRequest.show().then((response) => {
console.log(response)
});
I just want to display the payment view.
Here is the link of tutorial:
https://github.com/naoufal/react-native-payments
in my project using Sencha Touch and Phonegap. I have tried to use Phonegap Media Plugin in Sencha Touch for reproduce a local file audio, but does not works.
This is my code:
Ext.application({ name: 'ApplicationName',
requires: ['Ext.MessageBox'],
launch: function() {
console.log("launch");
this.launched = true;
this.mainLaunch();
},
mainLaunch: function() {
//console.log('Device name: ' + device.name);
if (!this.launched) {return;}
Ext.fly('appLoadingIndicator').destroy();
Ext.create('Ext.Container', {
fullscreen: true,
layout: {
type: 'vbox',
pack: 'center'
},
items: [
{
xtype : 'toolbar',
docked: 'top',
title : 'Ext.Audio'
},
{
xtype: 'toolbar',
docked: 'bottom',
defaults: {
xtype: 'button',
handler: this.playAndroidNativeSound
},
items: [
{ text: 'Play', flex: 1 }
]
}
]
});
},
playAndroidNativeSound: function() {
var src = '/android_asset/www/src/crash.mp3';
var media = new Media(src);
media.play();
}});
Any idea?
Thanks
In my ST2-app i create a panel which contains a carousel-element.
This carousel has to be filled dynamically with images from my store.
My problem is that the code shown below works fine in Chrome, but when i package my app and install it on my Galaxy S2, the initialize-event wont fire.
Has anyone a suggestion what could be the problem here?
I thought the browser androis is using is based on googles chrome-browser, so it should work the same.
Code:
createPanelBalloonSelect: function() {
panelBalloonSelect = Ext.Viewport.add({
xtype: 'panel',
centered: true,
styleHtmlContent: true,
width: '90%',
height: '70%',
modal: true,
scope: this,
layout: {
type: 'vbox',
align: 'stretch'
},
items: [
{
xtype: 'toolbar',
title: 'Auswahl Ballon',
docked: 'top'
},
{
xtype: 'carousel',
id: 'myCarousel',
flex: 1,
items: [],
config: {
initialize: function() {
console.log('ich initialisiere!');
drawingsStore = Ext.getStore('drawingsStore');
data = drawingsStore.getRange();
console.log('data: ' + data);
for(var i=0;i<data.length;i++){
console.log('ich adde');
this.add({
xtype: 'image',
src: data[i].data.canvasData,
cls: 'card'
});
}
}
},
defaults: {
listeners: {
activate: function(newActive, self, oldActive, opt) {
choosenBalloon = self.getActiveIndex();
console.log(choosenBalloon);
}
}
}
},
{
xtype: 'button',
text: 'OK',
name: 'btnAcceptTemplate',
scope: this,
handler: function() {
this.setBalloonSrc(data[choosenBalloon].data.canvasData);
//this.drawBalloon();
this.initSzeneryCanvas();
panelBalloonSelect.destroy();
}
}
]
});
},
My View (MyFormPanel)
var controllers = Ext.define("MyApp.controller.formcontroller", {
extend: "Ext.app.Controller",
config: {
refs: {
username: "username"
},
},
launch: function () {
alert('Controller launched');
},
init: function () {
alert('Controller init');
},
myaction : function (options) {
alert('options');
var username = options.username;
this.render ({
xtype: 'MyATM',
username: username})}
});
var formPanel = Ext.create('Ext.form.Panel', {
fullscreen: true,
scrollable: 'vertical',
layout: {
align: 'center',
type: 'vbox'
},
items: [
{
xtype: 'toolbar',
docked: 'top',
title: 'Login Form'
},
{
xtype: 'fieldset',
items: [
{
xtype: 'fieldset',
title:'Enter user name & password',
defaults: {
required: true,
labelAlign: 'left',
labelWidth: '50%'
},
items: [
{
xtype: 'textfield',
name : 'username',
label: 'User Name',
allowBlank:false,
useClearIcon: true
}, {
xtype: 'passwordfield',
name : 'password',
label: 'Password',
allowBlank:false,
useClearIcon: false
},
{
xtype: 'checkboxfield',
required:false,
id: 'RememberMe',
name: 'RememberMe',
label: 'Remember Me',
labelWidth: '50%'
},
{
xtype: 'button',
ui: 'confirm-round',
text: 'Log In' ,
handler: function() {
//Ext.Msg.alert('Form Values', JSON.stringify(formPanel.getValues(), null, 2));
Ext.ControllerManager.get('formcontroller').ControllerMethod({myaction: myaction});
}
}
]
}],
}]
});
formPanel.add({
xtype: 'toolbar',
docked: 'bottom',
layout: { pack: 'center' },
});
My controller (FormController)
Ext.define("MyApp.controller.formcontroller", {
extend: "Ext.app.Controller",
config: {
refs: {
username: "username"
},
},
launch: function () {
alert('Controller launched');
},
init: function () {
alert('Controller init');
},
myaction : function (options) {
alert('options');
var username = options.username;
this.render ({
xtype: 'MyATM',
username: username})}
});
I am using Sencha touch2 with Phonegap 1.4 on android 2.3. When i try to move view to controller on Login button click on handler function to invoke controller , i am getting error , Ext.dispatch is not defined as function .
Tell me the actual way how to move view to controller and vice versa.
Thanks
Ext.dispatch is not the recommended way to use in Sencha Touch 2. It might be removed...
Anyway, the best way to listen to & handle events on your views from controllers is:
Ext.define("MyApp.controller.formcontroller", {
extend: "Ext.app.Controller",
config: {
refs: {
loginButton: "#login-button" // set an id for your login button and this ref works
},
control: {
loginButton: {
tap: 'handleLogin',
}
handle_login: function(){whatever you want to do here}
}
And in Architect...
a. you go to the button's config, and
b. search for Event Handlers, and
c. you press the [+] button on the right.
d. Add a "basic handler"
e. Choose the TAP event
f. Give it a name (onButtonSendTap or whatever)
g. press DONE
h. right mouse
i. Convert to action
j. Choose [New Controller] or an existing controller
k. If you chose new controller give it a name
and voilla, you have your handler in the controller.
And in Architect...
a. you go to the button's config, and
b. search for Event Bindings, and
c. you press the [+] button on the right.
d. Add a "basic handler"
e. Choose the TAP event
f. Give it a name (onButtonSendTap or whatever)
g. press DONE
h. right mouse
i. Convert to action
j. Choose [New Controller] or an existing controller
k. If you chose new controller give it a name
and voilla, you have your handler in the controller.