Sencha Touch: How to Fix the Loading Spinner not rotating error

In order to fix the Loading Spinner not rotating error in Sencha touch 2, Please include the below sass code in the end of your sass file (app.scss).

@keyframes x-loading-spinner-rotate {

  0%{     -ms-transform: rotate(0deg); transform: rotate(0deg); }

  8.32%{  -ms-transform: rotate(0deg); transform: rotate(0deg); }

  8.33%{  -ms-transform: rotate(30deg); transform: rotate(30deg); }

  16.65%{ -ms-transform: rotate(30deg); transform: rotate(30deg); }

  16.66%{ -ms-transform: rotate(60deg); transform: rotate(60deg); }

  24.99%{ -ms-transform: rotate(60deg); transform: rotate(60deg); }

  25%{    -ms-transform: rotate(90deg); transform: rotate(90deg); }

  33.32%{ -ms-transform: rotate(90deg); transform: rotate(90deg); }

  33.33%{ -ms-transform: rotate(120deg); transform: rotate(120deg); }

  41.65%{ -ms-transform: rotate(120deg); transform: rotate(120deg); }

  41.66%{ -ms-transform: rotate(150deg); transform: rotate(150deg); }

  49.99%{ -ms-transform: rotate(150deg); transform: rotate(150deg); }

  50%{    -ms-transform: rotate(180deg); transform: rotate(180deg); }

  58.32%{ -ms-transform: rotate(180deg); transform: rotate(180deg); }

  58.33%{ -ms-transform: rotate(210deg); transform: rotate(210deg); }

  66.65%{ -ms-transform: rotate(210deg); transform: rotate(210deg); }

  66.66%{ -ms-transform: rotate(240deg); transform: rotate(240deg); }

  74.99%{ -ms-transform: rotate(240deg); transform: rotate(240deg); }

  75%{    -ms-transform: rotate(270deg); transform: rotate(270deg); }

  83.32%{ -ms-transform: rotate(270deg); transform: rotate(270deg); }

  83.33%{ -ms-transform: rotate(300deg); transform: rotate(300deg); }

  91.65%{ -ms-transform: rotate(300deg); transform: rotate(300deg); }

  91.66%{ -ms-transform: rotate(330deg); transform: rotate(330deg); }

  100%{   -ms-transform: rotate(330deg); transform: rotate(330deg); }

}

Sencha Touch: How to Fix Message Box unResponsive Error

Sometimes, you may came across a strange behaviour in sencha touch app. i.e the alert message will become unresponsive, this will force you to kill and re-launch the app. This error is mainly due to animation when alert message is getting displayed in your app.

In order to fix this, you need to disable the animation with this line of code.

Ext.Msg.defaultAllowedConfig.showAnimation = false;      

Hope, you enjoyed this post.